Як витягти частину URL-адреси імені хоста в JavaScript

Чи є дійсно простий спосіб почати з повної URL-адреси:

document.location.href = "http://aaa.bbb.ccc.com/asdf/asdf/sadf.aspx?blah"

І витягніть лише головну частину:

aaa.bbb.ccc.com

Повинна бути функція JavaScript, яка робить це надійно, але я не можу її знайти.

Припустимо , що у вас є сторінка з цією адресою: 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

***** Як реф стану, сумісність браузера для window.location.originне ясно. Я перевірив це в chrome, і він повернувся, http://sub.domain.com:portякщо порт - це щось, крім 80, і http://sub.domain.comякщо порт - 80.

Особлива подяка @torazaburo за те, що він мені це згадав.

Ви можете з'єднати протокол розташування та хост:

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

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

Використовуйте document.locationоб'єкт та його hostабо hostnameвластивості.

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

Прийнята відповідь не працювала для мене, оскільки я хотів мати можливість працювати з будь-якими довільними 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"

Є два способи. Перший - це варіант іншої відповіді, але цей обліковий запис стосується портів, які не є типовими:

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");
}

використання

window.location.origin

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

ви отримаєте: http://aaa.bbb.ccc.ddd.com/

Спробуйте

document.location.host

або

document.location.hostname

Є ще один хак, який я використовую і ніколи не бачив у жодній відповіді 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;

Я проте тестував це не в кожному браузері.

Перевір це:

alert(window.location.hostname);

це поверне ім'я хоста як www.domain.com

і:

window.location.host

поверне доменне ім’я з портом www.example.com:80

Для повної довідки перевірте сайт розробника Mozilla .

Я хотів би щось уточнити. Якщо хтось хоче отримати всю URL-адресу шляхом, як мені потрібно, може скористатися:

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

Я знаю, що це трохи пізно, але я зробив чисту функцію з маленьким синтаксисом 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, але в моїй роботі це не має значення.

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