【HTML】よく似ているけど全く違う二つのエンコードについての解説。
  • facebookページ
  • twitterページ
  • 2020.03.30

    【HTML】よく似ているけど全く違う二つのエンコードについての解説。

    エスケープ処理とエンコードについて同じと思っている方が多くいますが、これは間違いです。

    特に初心者の方に多い間違いなのですが、明確な違いについてうまく説明できない中級者の方もいらっしゃいます。

    そこで今回はこの「エンコード」について解説をしてみたいと思います。

    エンコードとは

    エンコードとは「データを一定の基準に基づいて符号化する事」を指します。

    文字にはそれぞれGID/CIDという固有の番号が振られていだけで、文字コードとの関連は不明確です。

    OSが文字を認識するためには文字コードの明確化が不可欠ですから、まずは文字をコードとして認識させないといけません。

    そこで文字をコード化する作業が必要になるわけですが、この作業を「エンコーディング」といいます。

    エンコーディングにはいくつものテーブルが存在し、文字コードによって使用するテーブルを使い分けて関連付けています。

    エディタによってはファイルを保存する際にエンコーディングを選択するものがありますが、これは今回の記事で解説する作業を半自動で行ってくれるものとなっています。

    ※エンコーディングを指定することによってコード化させるスクリプトが内部的に自動で行われるという意味です。

    相互一致がエンコードルール

    エンコーディングの基本ルールは、情報の保存時と開く際のコードの一致です。

    HTMLファイルをunicodeで保存した場合には、開く際にもunicodeで開かせないと意味がありません。

    これが一致していない場合には必ず文字化けの原因となります

    HTMLファイルは一旦サーバーに保存され、URLによってそのファイルをブラウザというアプリケーションで開くことが出来ます。

    メールの場合にはファイルがないと思われがちですが、メールも送受信するためにはメールフォルダに送受信する情報がファイルとして保存されています。

    エンコードの指定方法

    HTMLファイルでエンコードを指定する方法については以下の通りです。

    というタグをタグ内に記述します。

    こうすることで、ブラウザで開いた際にどの文字コードで記述されているのかをブラウザが認識できるようになります。

    パーセントエンコーディング

    ここまで説明してきたエンコーディングですが、もう一つ用語として混同されがちなのがこの「パーセントエンコーディング」です。

    同じエンコーディングでも、パーセントエンコーディングは文字エンコーディングとは意味合いが異なります

    以下では、文字エンコーディングとパーセントエンコーディングについて簡単に違いをまとめています。

    文字エンコーディング

    utf-8″や”EUC-JP”など、ファイルに保存される際の文字コードとブラウザで開く際の文字コードを一致させる作業

    パーセントエンコーディング

    メールでPOST送信する際などに使われる方法で、非ASCII文字などを「%xx」の形に変換する作業

    ASCII文字とは

    半角英数字や制御文字の他にも半角記号など、ひらがなやカタカナ、漢字のような日本語として使われている2バイト文字以外の文字を指します。

    エスケープとの違い

    エスケープ処理も文字の変換処理を行うため、パーセントエンコーディングとエスケープ処理は説明上似たように感じるかもしれません。

    以下ではこのエスケープ処理とパーセントエンコーディングの違いについて解説しています。

    エスケープ処理

    特殊文字を何の意味も持たない文字に変換するだけ」でコード化はされない。

    このため、エスケープに使用した文字列はブラウザには表示されない。

    例) 小なりはエスケープ処理させるために「&gt;」と記述しますが、ブラウザでは「<」とだけ表示される

    パーセントエンコーディング

    コード化するだけでエンコードで置き換えた文字は全てブラウザで表示される。

    例) 「テスト」をパーセントエンコーディングすると「%E3%83%86%E3%82%B9%E3%83%88」に置換されます。

    パーセントエンコーディングの場合には「文字列を別の文字列に置き換える」とも言えます。

    エスケープ処理はURLで使われることはありません。

    またHTMLフォームで送信する際にPOST送信した場合には、このパーセントエンコーディングが使用された状態で送信されます。

    デコード処理

    Webアプリケーションでエンコードされた文字を読む場合には、そのエンコーディングされた文字を復元しなければなりません。

    これを「デコード処理」といいます。

    基本的にデコード処理は「%xx」という形に処理されている文字の%を除去し、「xx」の部分をコード表に則って再度変換します。

    パーセントエンコーディングの用途

    Chromeなど有名ブラウザには既に自動エンコーディング機能があるものも多いため、URLに日本語を入力しても自動で認識されますのであまり意識している人はいないかもしれませんが、URLには2バイト文字である日本語は使用できません

    このため、実はパーセントエンコーディングはたくさんの場所で使用されています。

    例えば以下のようなURLも、実際にはブラウザは「https://ja.wikipedia.org/wiki/%E3%82%A8%E3%83%B3%E3%82%B3%E3%83%BC%E3%83%89」でURL検索をしています。

    日本語で表示されている部分は、ブラウザがURL検索を実行した後で自動デコードし、2バイト文字に置き換えているだけというわけです。

    エンコードできないケースも…

    エンコード出来ない文字列というものもケースとしては存在しますので簡単に解説してみたいと思います。

    例えば銀行系のローンでよく見かける「金利0.1%20年固定」のようなフレーズです。

    これは二重エンコードと呼ばれています。

    この状態でエンコーディングすると「%20」がスペースキーと認識されてしまうため、デコードした際には「金利0.1 年固定」となってしまいます。

    まとめ

    いかがでしたか?

    今回は文字エンコードとパーセントエンコーディング(URLエンコーディング)について解説してみました。

    同じエンコードでも全く性質が異なるこの二つですが、間違った知識が頭に入っていると参考書などを読む際に認識のずれが生じ、思うように学習がはかどらないこともあります。

    初めのうちは覚えることが多く、技術よりは理論や用語が学習の主となりますが、ここでしっかりと基本的な部分をマスターしておくように心がけましょう。



    優良フリーランス案件多数掲載中!
    フリーランスエンジニアの案件をお探しなら
    ポテパンフリーランス

    この記事をシェア

    • Facebookシェア
    • Twitterシェア
    • Hatenaシェア
    • Lineシェア
    pickup









    ABOUT US

    ポテパンはエンジニアと企業の最適なマッチングを追求する企業です。

    READ MORE