css.in.ua
Підтримати

JS властивість Location.port

Загальний опис

Властивість port об'єкта Location в JavaScript відіграє важливу роль у визначенні порту, який використовується для підключення до хоста веб-сервера. Вона є частиною повного URL і повертає номер порту, зазначений в URL. Ця властивість особливо корисна у ситуаціях, коли потрібно зробити запити до сервера, який працює на нетиповому порту, або для виявлення, чи веб-додаток запущено на специфічному порту під час розробки.

port повертає рядок, що містить номер порту URL. Наприклад, якщо URL сторінки має вигляд http://www.example.com:8080/page, то location.port поверне 8080. Якщо порт не зазначено в URL, location.port повертає пустий рядок.

Приклади використання:

  1. Отримання номера поточного порту: Основне використання port полягає в отриманні номера порту поточного URL:

     let currentPort = window.location.port;
 console.log(currentPort);

    Цей код виведе на консоль номер порту поточної веб-сторінки.

  2. Застосування в умовних інструкціях: port може бути використаний для виконання специфічних дій в залежності від номера порту:

     if (window.location.port === "8080") {
	 console.log("Веб-додаток запущено на порту розробки.");
 }

    Цей код допомагає ідентифікувати, чи запущено додаток у середовищі розробки.

  3. Динамічне налаштування запитів: port може бути корисним для динамічного конфігурування запитів до сервера, особливо коли використовуються різні порти:

     let url = `http://api.example.com:${window.location.port}/data`;
 fetch(url)
	 .then(response => response.json())
	 .then(data => console.log(data));

    В цьому прикладі URL для запиту формується виходячи з поточного порту.

location.port є корисним інструментом для розробників, що дозволяє легко ідентифікувати та використовувати номер порту в URL, що є важливим для розробки та відладки веб-додатків, особливо при роботі з різними середовищами або конфігураціями сервера.

Порада:

Використання location.port дозволяє вам отримати номер порту, на якому запущений веб-сервер поточної сторінки. Це особливо корисно у розробці локальних середовищ, де може бути використано різні порти для тестування різних версій додатку.
Порада:

При перевірці або дебагуванні мережевих налаштувань вашого додатку, location.port може бути використаний для забезпечення, що веб-запити надсилаються на правильний порт. Це може бути важливим, особливо в складних середовищах із багатьма службами.
Порада:

При створенні умовних інструкцій у JavaScript, location.port може бути використаний для визначення, чи поточний порт відповідає певним критеріям, що дозволяє кастомізувати поведінку додатку в залежності від мережевого оточення.

Синтаксис

location.port

Значення

Return

Переглядачі

Переглядач

1

1

1

12.1

12
Переглядач

4.4

18

4

1
Переглядач

-

1.7

Приклади


У цьому прикладі ми використовуємо властивість port разом з властивістю protocol для визначення, чи використовується захищений порт 443. Якщо так, ми вважаємо з'єднання безпечним. Це може бути корисним для підвищення безпеки вашого додатку, наприклад, вимагаючи HTTPS на порту 443.

// Отримуємо номер порту з поточного URL
const currentPort = window.location.port;

// Перевіряємо, чи використовується HTTPS та порт 443
const isSecure = window.location.protocol === "https:" && currentPort === "443";

// Виводимо результат перевірки
if (isSecure) {
    console.log("З'єднання є безпечним (HTTPS на порту 443).");
} else {
    console.log("З'єднання не є безпечним.");
}

У цьому прикладі ми отримуємо номер порту з поточного URL та виводимо його в консолі. Це може бути корисним для налагодження та відладки, коли вам потрібно перевірити, на якому порті працює ваш веб-сервер.

// Отримуємо номер порту з поточного URL
const currentPort = window.location.port;

// Виводимо номер порту
console.log(`Поточний номер порту: ${currentPort}`);

Спільнота

Зв'язок