วิธีแยกส่วนชื่อโฮสต์ของ 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ยังไม่ชัดเจน ฉันได้ตรวจสอบมันด้วยโครเมี่ยมและมันกลับมา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 ของหน้าปัจจุบัน

ลองดูที่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