Cara mengekstrak bagian hostname dari URL dalam JavaScript

Apakah ada cara yang sangat mudah untuk memulai dari URL lengkap:

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

Dan ekstrak hanya bagian host:

aaa.bbb.ccc.com

Pasti ada fungsi JavaScript yang bisa diandalkan, tapi saya tidak bisa menemukannya.

anggaplah bahwa Anda memiliki halaman dengan alamat ini: http://sub.domain.com/virtualPath/page.htm. gunakan kode halaman berikut ini untuk mencapai hasil tersebut:

• window.location.host: Anda akan mendapatkan sub.domain.com:8080atausub.domain.com:80
• window.location.hostname : Anda akan mendapatkannya sub.domain.com
• window.location.protocol : Anda akan mendapatkannya http:
• window.location.port: Anda akan mendapatkan 8080atau80
• window.location.pathname : Anda akan mendapatkannya /virtualPath
• window.location.origin: Anda akan mendapatkan http://sub.domain.com*****

Perbarui: tentang .origin

***** Sebagai negara referensi , kompatibilitas browser untuk window.location.origintidak jelas. Saya telah memeriksanya di chrome dan mengembalikannya http://sub.domain.com:portjika portnya tidak lebih dari 80, dan http://sub.domain.comjika portnya adalah 80.

Terima kasih khusus kepada @torazaburo karena menyebutkan hal itu kepada saya.

Anda dapat menggabungkan protokol lokasi dan host:

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

Untuk url, katakanlah 'http://stackoverflow.com/questions', itu akan kembali'http://stackoverflow.com'

Gunakan document.locationobjek dan nya hostatau hostnameproperti.

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

Jawaban yang diterima tidak berfungsi untuk saya karena ingin dapat bekerja dengan url arbiter apa pun, bukan hanya URL halaman saat ini.

Lihatlah URLobjeknya :

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"

Ada dua cara. Yang pertama adalah varian dari jawaban lain di sini, tetapi yang ini bertanggung jawab untuk port non-default:

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

Tapi saya lebih suka metode yang lebih sederhana ini (yang bekerja dengan string URI):

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

menggunakan

window.location.origin

dan untuk: " http://aaa.bbb.ccc.ddd.com/sadf.aspx?blah "

Anda akan mendapatkan: http://aaa.bbb.ccc.ddd.com/

Mencoba

document.location.host

atau

document.location.hostname

Ada peretasan lain yang saya gunakan dan tidak pernah dilihat dalam respons StackOverflow: menggunakan atribut "src" dari sebuah gambar akan menghasilkan jalur basis lengkap dari situs Anda. Contohnya :

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

Pada URL suka http://domain.com/somesite/index.html, rootakan diatur ke http://domain.com/somesite/. Ini juga berfungsi untuk localhost atau URL dasar yang valid.

Perhatikan bahwa ini akan menyebabkan permintaan HTTP gagal pada $gambar dummy. Anda dapat menggunakan gambar yang sudah ada sebagai gantinya untuk menghindari ini, dengan hanya sedikit perubahan kode.

Varian lain menggunakan tautan dummy, tanpa efek samping pada permintaan HTTP:

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

Saya tidak mengujinya di setiap browser.

Periksa ini:

alert(window.location.hostname);

ini akan mengembalikan nama host sebagai www.domain.com

dan:

window.location.host

akan mengembalikan nama domain dengan port like www.example.com:80

Untuk referensi lengkap, periksa situs pengembang Mozilla .

Saya ingin menentukan sesuatu. Jika seseorang ingin mendapatkan seluruh url dengan jalur seperti yang saya butuhkan, dapat menggunakan:

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

Saya tahu ini agak terlambat, tapi saya membuat sedikit fungsi bersih dengan sedikit sintaks ES6

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

Bisa juga ditulis dalam ES5 suka

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

Tentu saja IE tidak mendukung Object.assign, tetapi dalam pekerjaan saya, itu tidak masalah.

Regex memberikan lebih banyak fleksibilitas.

    //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