JavaScriptでツールを作っている時に現在開いているURLを分析したり、リダイレクトさせたり、リファラのURLをカテゴリ分けしたり・・・
URLを操作する事がしばしばあります。
そんな時に使いたいスニペットを作っておきました。
ケース
・URIからルートパスを取得したい。
※現在開いているサイトの隣ページに移動する場合など
・URLからドメインを取得する。
・クエリ情報の中から特定のクエリ情報を取得する。※クエリをkey=valueの連想配列で取得する。
ソース
/**
* URLからクエリ値を連想配列で返す;
* $$URL.getUrlProperty(location.href)
* 概要：表示しているページのブラウザアドレスのURLクエリを連想配列で返します。
* param:url *未記入可
*/
(function(){
var $$={};
$$.getUrlProperty=function(uri){
if(!uri){
uri = location.href;
}
var data={};
//URLとクエリ分離分解;
var query=[];
if(uri.indexOf("?")!=-1){
query = uri.split("?");
}
else if(uri.indexOf(";")!=-1){
query = uri.split(";");
}
else{
query[0] = uri;
query[1] = '';
}
//基本情報取得;
var sp = query[0].split("/");
var data={
url:query[0],
//dir:this.dir(uri),
domain:sp[2],
protocol:sp[0].replace(":","")
query:(query[1])?(function(q){
var data=[];
var sp = q.split("&");
for(var i=0;i<sp.length;i++){
var kv = sp[i].split("=");
if(!kv[0]){continue}
data[kv[0]]=kv[1];
}
return data;
})(query[1]):[],
};
return data;
};
window.$$URL = $$;
return $$;
})();
使い方
1.対象ページのHTMLに上記JSソースを挿入（jsタグ、jsファイルどちらでもOK）
2.現在開いているURLの情報を取得
# http://ex.com/index.php?a=1&b=2
var url = $$URL.getUrlProperty(location.href);
URL部分の表示
console.log(url.url);
# [結果] http://ex.com/index.php
ドメインを表示
console.log(url.domain);
# [結果] ex.com
現在開いている階層までを表示
console.log(url.dir);
# [結果] http://ex.com/
http,httpsの表示
console.log(url.protocol);
# [結果] http
クエリ情報の表示(a=*)
console.log(url.a);
# [結果] 1
Issue
1.ドメイン取得の際に、nodejsなどを使っている場合、通常の80番、443番以外を使用した場合の対応ができていません。
2.POSTクエリの情報は取得できません。input=hiddenなどに格納して別途取得してください。
