ブックマークレット – えむ家のメモ帳

今回はWEB制作でよくあるテスト環境と本番環境のURL切り替えを、ブックマークレットで実装したのでメモしときます。
※動作確認はChromeのみです。

ブックマークレットとは

気に入ったウェブサイトをブラウザのお気に入りに登録すると、通常そのサイトのURLが登録されますが、
URLの代わりにプログラムを登録すると、表示しているページに対してちょっとした動作を自動化できたりします。

var area = location.href;　//現在のURLを取得
var urlFlag = false;　//変換するURLがあるか判定

function changeUrl(testUrl, honbanUrl) {
  //テストURLがあれば本番に置換、またはその逆
  if(document.location.href.indexOf(testUrl)>0){
    area=document.location.href.replace(testUrl,honbanUrl);
    urlFlag = true; //URLを置換したらフラグを更新
    window.open(area);
  } else if(document.location.href.indexOf(honbanUrl)>0){
    area=document.location.href.replace(honbanUrl,testUrl);
    urlFlag = true; //URLを置換したらフラグを更新
    window.open(area);
  } 
}
//関数実行
changeUrl('www-test.example.com','www.example');
changeUrl('XXX.XXX.X.XXX','www.test.jp');
//変換するURLがなければアラートを出す
if(urlFlag === false) {
  alert('このURLには対応していません！')
}

コードに改行が含まれているとうまく動作しません。
手作業ですべての改行を削除するのは大変なので、ブックマークレットのコードに変換できるサイトを利用します。

いつもお世話になっているサイトはこちら。

https://ytyng.github.io/bookmarklet-script-compress/

※コメントが入っているとうまく変換されない可能性があるので、削除して変換します。

ブックマークレットでテスト環境のタグが入っていないか確認する

var htmlTxt = document.getElementsByTagName("html")[0].innerHTML; var keyword = "www-test"; htmlTxt.replace( /＜！－－[\s\S]*?--＞/g , ''); result=htmlTxt.indexOf(keyword); if(result !== -1){ var count = (htmlTxt.split(keyword).length - 1); alert(keyword + "が" + count + "個あります。確認してください！"); } else { alert("OK！"); }