tohokuaikiのチラシの裏

技術的ネタとか。

Firefox37でlocationがうまく使えなかったのでURLUtils.jsを使ってみた

Firefox37で発覚したロケーションバーの全角問題

ChromeIEでは問題なかったし、Firefox34*1でも問題なかったのだけど。

たとえばロケーションバーに
http://tohokuaiki.hateblo.jp/#ここに全角スラッシュ/を入れます。
とした場合、FirebugChromeのコンソールから location.hashとすると

Google Chrome

> location.hash
"#ここに全角スラッシュ/を入れます。"

Firefox37

location.hash
"#ここに全角スラッシュ%uFF0Fを入れます%u3002"

となってしまう。Unicodeとしてエンティティ化されてしまっている。

これをこのまま decodeURIComponentに突っ込むとmalformed uriとしてエラー発生してしまう。

URLは正規化されてなかったりする。

詳しい説明は、下記のページに譲る。Firefoxだけデコードしない値で返すようだけどどうも微妙っぽい感じ。hail2u.net

そこで、URLUtilsというJavaScriptライブラリを使う。これは、URL StandardJavaScriptで実装したものになる。
gist.github.com

使い方
var urlutils = new URLUtils(location);
consoloe.log(urlutils.hash);

これでどのブラウザでも一律してURLエンコードされていない値で取得できる。

*1:最近Chromeを情報しててアップデートを放置してた