Javascript URL API

URL arayüzü (interface), URL'leri ayrıştırmak, oluşturmak, normalleştirmek ve encode etmek için kullanılır.

Bir URL'in bileşenlerini kolayca okumanıza ve düzenlemenize yardımcı olur.

Kullanımı

Mevcut URL'i URL() apiyi kullanarak oluşturuyoruz.

const url = new URL('https://prototurk.com:80/search?q=test#deneme')

artık url değişkeni altında bazı özelliklere erişebiliriz.

hash -> eğer # ile biten bir değer varsa bunu döndürür. Örneğimizdeki sonuç;

console.log(url.hash); 
// #deneme

host -> alan adını portla birlikte döndürür. Örneğimizdeki sonuç;

console.log(url.host); 
// prototurk.com:8

hostname -> alan adını döndürür. Örneğimizdeki sonuç;

console.log(url.hostname); 
// prototurk.com

href -> mevcut url'in tamamını döndürür. Örneğimizdeki sonuç;

console.log(url.href); 
// https://prototurk.com:80/search?q=test#deneme

origin -> alan adı ve portu şemayle birlikte döndürür. Örneğimizdeki sonuç;

console.log(url.origin); 
// https://prototurk.com:80

pathname -> / karakterinden sonrakileri döndürür. Bunun içinde query stringler ve fragmentler hariç tutulur. Örneğimizdeki çıktısı;

console.log(url.pathname); 
// /search

port -> portu döndürür. Örneğimizdeki sonuç;

console.log(url.port); 
// 80

protocol -> url'in protokolünü döndürür. Örneğimizdeki sonuç;

console.log(url.protocol); 
// https:

search -> query stringleri yani soru işaretinden sonrakileri döndürür. Örneğimizdeki sonuç;

console.log(url.search); 
// ?q=test

searchParams -> bir URLSearchParams objesi döndürür bu sayede get() ve set() gibi metodlarla query stringleri alabilir ya da ekleyebilirsiniz. Örneğimizdeki çıktısı;

console.log(url.searchParams.get('q')); 
// test

url.searchParams.set('type', '3')
console.log(url.href);
// https://prototurk.com:80/search?q=test&type=3#deneme

Ayrıca URL validasyonunu da yapabilirsiniz. Örneğin;

try {
    new URL('bu url doğru mu, sanmam?')
} catch (e) {
    console.log(e)
    // TypeError: Failed to construct 'URL': Invalid URL
}

URL'leri manipülasyon etmekte oldukça kolay. Örnek url'imizi erbilen.net olarak değiştirmek isteseydim;

url.hostname = 'erbilen.net';
url.protocol = 'http'
console.log(url.href);
// http://erbilen.net/search?q=test&type=3#deneme