Как извлечь часть имени хоста URL-адреса в JavaScript

Ответ 1

предположим, что у вас есть страница с этим адресом: http://sub.domain.com/virtualPath/page.htm. для достижения этих результатов используйте код страницы:

• window.location.host: вы получите sub.domain.com:8080 или sub.domain.com:80
• window.location.hostname: вы получите sub.domain.com
• window.location.protocol: вы получите http:
• window.location.port: вы получите 8080 или 80
• window.location.pathname: вы получите /virtualPath
• window.location.origin: вы получите http://sub.domain.com *****

Обновление: о .origin

***** Как указано в ref, совместимость браузера для window.location.origin не ясна. Я проверил его в chrome, и он вернул http://sub.domain.com:port, если порт имеет значение не 80, а http://sub.domain.com, если порт равен 80.

Особая благодарность @torazaburo за упоминание об этом мне.

Ответ 2

Вы можете объединить протокол местоположения и хост:

var root = location.protocol + '//' + location.host;

Для URL, скажем 'http://stackoverflow.com/questions', он вернет 'http://stackoverflow.com'

Ответ 3

Используйте объект document.location и его свойства host или hostname.

alert(document.location.hostname); // alerts "stackoverflow.com"

Ответ 4

Есть два пути. Первый вариант - это вариант другого ответа здесь, но на этом приходится нестандартные порты:

function getRootUrl() {
  var defaultPorts = {"http:":80,"https:":443};

  return window.location.protocol + "//" + window.location.hostname
   + (((window.location.port)
    && (window.location.port != defaultPorts[window.location.protocol]))
    ? (":"+window.location.port) : "");
}

Но я предпочитаю этот более простой метод (который работает с любой строкой URI):

function getRootUrl(url) {
  return url.toString().replace(/^(.*\/\/[^\/?#]*).*$/,"$1");
}

Ответ 5

Принятый ответ не работал для меня, так как хотел иметь возможность работать с любыми произвольными URL-адресами, а не только с URL текущей страницы.

Посмотрите на объект URL:

var url = new URL("http://aaa.bbb.ccc.com/asdf/asdf/sadf.aspx?blah");
url.protocol;  // "http:"
url.hostname;  // "aaa.bbb.ccc.com"
url.pathname;  // "/asdf/asdf/sadf.aspx"
url.search;    // "?blah"

Ответ 6

использовать

window.location.origin

и для: " http://aaa.bbb.ccc.ddd.com/sadf.aspx?blah"

вы получите: http://aaa.bbb.ccc.ddd.com/

Ответ 7

Try

document.location.host

или

document.location.hostname

Ответ 8

Есть еще один хак, который я использую и никогда не видел в любом ответе StackOverflow: использование атрибута "src" изображения приведет к полному базовому пути вашего сайта. Например:

var dummy = new Image;
dummy.src = '$';                  // using '' will fail on some browsers
var root = dummy.src.slice(0,-1); // remove trailing '$'

По URL-адресу, подобному http://domain.com/somesite/index.html, root будет установлено на http://domain.com/somesite/. Это также работает для localhost или любого действительного базового URL.

Обратите внимание, что это приведет к неудачному HTTP-запросу на $ фиктивном изображении. Вместо этого вы можете использовать существующее изображение, чтобы избежать этого, только с небольшими изменениями кода.

В другом варианте используется фиктивная ссылка, без побочных эффектов на HTTP-запросы:

var dummy = document.createElement ('a');
dummy.href = '';
var root = dummy.href;

Я не тестировал его в каждом браузере.

Ответ 9

Проверьте это:

alert(window.location.hostname);

это вернет имя хоста как www.domain.com

и

window.location.host

вернет имя домена с портом, например www.example.com:80

Для полной проверки проверьте сайт разработчика Mozilla.

Ответ 10

Я хотел бы указать что-то. Если кто-то хочет получить весь URL-адрес с пути, как мне нужно, можете использовать:

var fullUrl = window.location.protocol + "//" + window.location.hostname + window.location.pathname;

Ответ 11

Я знаю, что это немного поздно, но я сделал маленькую чистую функцию с небольшим синтаксисом ES6

function getHost(href){
  return Object.assign(document.createElement('a'), { href }).host;
}

Это также может быть написано в ES5 как

function getHost(href){
  return Object.assign(document.createElement('a'), { href: href }).host;
}

Конечно, IE не поддерживает Object.assign, но в моей работе это не имеет значения.

Ответ 12

Как сказал Мартин, другие ответы не будут работать с произвольными URL-адресами. Новый объект URL-адрес будет работать, но все еще экспериментален и несовместим со всеми браузерами.

Для более надежного и кросс-браузерного решения вы можете использовать этот компонент, который я построил для анализа произвольного URL-адреса в свойствах, аналогичных найденным в указанном выше объекте URL.

Например:

var urlObject = parseUrl('http://aaa.bbb.ccc.com/asdf/asdf/sadf.aspx?blah');
var newUrl = urlObject.hostname;

newUrl теперь будет содержать:

aaa.bbb.ccc.com

Вы можете импортировать компонент для использования parseUrl()

Ответ 13

Regex обеспечивает гораздо большую гибкость.

    //document.location.href = "http://aaa.bbb.ccc.com/asdf/asdf/sadf.aspx?blah
    //1.
     var r = new RegExp(/http:\/\/[^/]+/);
     var match = r.exec(document.location.href) //gives http://aaa.bbb.ccc.com

    //2. 
     var r = new RegExp(/http:\/\/[^/]+\/[^/]+/);
     var match = r.exec(document.location.href) //gives http://aaa.bbb.ccc.com/asdf

Ответ 14

Использование строковых методов вместе с фильтром:

hostName = (url) => url.indexOf('www') > -1 ?
  url.split("/").filter(x => !!x)[1].substring(4) :
  url.split("/").filter(x => !!x)[1]


console.log(hostName('https://www.website.com/sub/file.html'));
console.log(hostName('http://website.co.uk'));
console.log(hostName('http://website.com'));
// for invalid link, hostname is again extracted
console.log(hostName('http:/website.com'));