Clever Geek Handbook

ブラウザーの不完全な世界：リンクのURIエンコード

先日、ブラウザの世界で別の欠陥に遭遇しました。 たぶんこれは些細なことですが、Habréを検索しても結果は返されませんでした。



非ASCII文字を含むリンクがページにあります。 javascriptでhref値を取得した場合、結果はブラウザーによって異なります。



W3Cの推奨によると、ブラウザーはリンク内の無効な文字をzassekapitする必要があります。 しかし、エージェントがトランスコードする必要がある正確な瞬間については述べていません（私は見つけませんでした）。 1つのことは明らかです。リクエストを送信するとき、URIはすでにエンコードされています。



次のテストページで、さまざまなブラウザの動作を確認しましょう。

< html >

< head >

< script type ="text/javascript" >

window.onload = function () {

alert( document .getElementById( "anchor" ).href);

}

</ script >

</ head >

< body >

< a id ="anchor" href ="http://www.google.ru/search?q=Hello world!" > Test link </ a >

</ body >

</ html >



* This source code was highlighted with Source Code Highlighter .





「http://www.google.com/search?q=Hello world！」というスペースのあるシンプルなリンクで、ブラウザが私たちに何を伝えているのか見てみましょう。

ブラウザ 結果
IE7、IE8 
  http://www.google.com/search?q=Hello world！
Chrome 2.0、4.0 
  http://www.google.com/search?q=Hello%20world！
Opera 9.6 
  http://www.google.com/search?q=Hello%20world！
Firefox 3.5.2 
  http://www.google.com/search?q=Hello%20world！
Safari 4.31 
  http://www.google.com/search?q=Hello%20world！


うわー IEは再び独自の道を進んでいるようです。すべてのブラウザはリンクをトランスコードしてDOMに保存しましたが、IEはこのアクションを後のために残します。



2番目のテストを行いましょう。 今回は、「javascript：alert（ 'Hello world！'）」のようなリンクを使用します。

ブラウザ 結果
IE7、IE8 
  javascript：アラート（「Hello world！」）
Chrome 2.0、4.0 
  javascript：アラート（「Hello world！」）
Opera 9.6 
  javascript：アラート（「Hello world！」）
Firefox 3.5.2 
  javascript：アラート（「Hello％20world！」）
Safari 4.31 
  javascript：アラート（「Hello％20world！」）


予想外のイベントの変わり目でしょうか？ なぜこれが起こっているのかの説明はありません。 誰でもコメントできますか？



注意してください。 このような場合、decodeURI（）またはdecodeURIComponent（）を使用して、リンクを共通分母にキャストできます。



UPD： tenshiからのヒントで、.getAttribute（ 'href'）をチェックしました。 すべてのブラウザーで、結果の値は元の値と等しく、再コーディングされません。


More articles:


All Articles