·4分で読めます

MacのHTMLエンティティエンコーダー/デコーダー

ユーザーが投稿したテキストを安全にレンダリングすることも、&や<だらけのページソースを読むことも、突き詰めれば同じ面倒な変換の問題に行き着きます。

ウェブページ上のあるテキストが、プレーンなアンパサンドではなく&として表示される理由をデバッグしています。あるいはHTMLを手書きしていて、ブラウザがタグの開始と解釈しないように小なり記号をエスケープする必要があります。いずれにせよ、あなたはHTMLエンティティ——正しく表示するため、あるいはマークアップを壊さないために特別なエンコーディングを必要とする少数の文字のセット——を扱っていることになります。

よく使われるものは覚えやすいです。&&amp;に、<&lt;に、>&gt;になります。しかしカーリークォート、emダッシュ、ノーブレークスペース、アクセント付き文字にまで踏み込むと、エンティティ名は直感的ではなくなり、毎回参照表を検索することになります。

単なる整形の問題ではなく、セキュリティの側面もある

HTMLエンティティのエンコーディングは、純粋に見た目だけの問題ではありません。ユーザーが投稿したコンテンツをウェブページにレンダリングする前にエンコードしないことは、クロスサイトスクリプティングの典型的な攻撃経路です。あなたのアプリケーションがコメント、ユーザー名、フォーム入力といった生のテキストをHTML内に表示する必要がある場合、何がどのようにエンコードされるかを正確に理解することは、見た目をきれいにするだけでなく、安全なコードを書くことの一部です。

逆に、デコードも同じくらいよくある要求です。ウェブページのスクレイピング、RSSフィードの解析、エクスポートされたCMSドキュメントの読み込みでは、他の場所で使う前にプレーンな文字に戻す必要のあるエンティティエンコード済みのテキストが手元に残ることがよくあります。

1ステップでエンコード・デコード

Bellowsには、41個の開発者ツールの1つとしてHTMLエンティティエンコーダー/デコーダーが含まれています。生のテキストを貼り付ければ適切にエスケープされたHTMLエンティティが得られ、エンコードされたマークアップを貼り付ければ読みやすいテキストが表示されます。どちらの方向も即座に、完全にオフラインで行われます。

Bellows HTML entity encoder and decoder tool on macOS

スクレイピングしたコンテンツのクリーンアップ

RSSフィード、エクスポートされたブログ記事、スクレイピングされたHTMLから取得したテキストは、プレーンな句読点があるべき場所にエンティティコードが並んでいることがよくあります。他の場所に保存したり表示したりする前に一括でデコードすることで、アポストロフィがあるべき場所に&#8217;が散らばったページになることを防げます。

マークアップを手書きする

HTMLテンプレートやメールニュースレターを手作業で編集していて、目に見えるテキストに実際の山括弧やアンパサンドを含める必要があるとき、最初から正しくエンコードしておけば、メールをすでに送信した後にしか表面化しないレンダリングバグを防げます。

Mac App StoreでBellowsを入手する

次の記事

Bellows

41 developer tools in one native Mac app — JSON, JWT, Base64, hashes, and more.

Get Bellows on the Mac App Store