Google Chrome, Microsoft Edge で明示的にエンコーディングを指定して表示する - Windows

Google Chrome, Microsoft Edge で明示的にエンコーディングを指定して表示する方法を紹介します。

概要

Microsoft EdgeやGoogle Chromeで表示結果が文字化けする場合があります。 通常のWebページを閲覧している場合は自動でエンコーディングが認識されるため、ほとんど問題は発生しませんが、エラーページやレスポンス結果が短いもの、 APIの戻り値などで、レスポンスヘッダが設定されていない場合には、下図のような文字化けの表示になることがあります。
Microsoft EdgeやGoogle ChromeのWebブラウザで明示的に文字コードやエンコーディングを指定して表示結果を確認したいですが、メニューにはそのような設定はありません。 Internet Explorer ではエンコーディングの指定ができたため、これまではInternet Explorer を使って文字コードを指定した表示で確認できましたが、 Windows 11では、Internet Explorerが削除されたため、Google ChromeやMicrosoft Edgeで確認する必要があります。

対応方法

拡張機能をインストールすると、文字コードを指定してページを表示できます。

手順:Microsoft Edge

Microsoft Edgeのウィンドウ右側のメニューボタン[...]をクリックします。下図のドロップダウンメニューが表示されます。 メニューの[拡張機能]の項目をクリックします。


拡張機能の画面が表示されます。ページ下部の[Microsoft Edge の拡張機能を検出する]ボタンをクリックします。


下図の[Edge アドオン]ページが表示されます。


左側の検索ボックスに "charset" を入力します。右側の検索結果に該当する拡張機能の一覧が表示されます。結果のリストの[Charset]の項目の右側の[インストール]ボタンをクリックします。


ウィンドウ上部に確認ダイアログが表示されます。下図のメッセージが表示されます。ダイアログ下部の[拡張機能の追加]ボタンをクリックします。


拡張機能がインストールされた旨のメッセージが表示されます。また、アドレスバーの右側にボタンが新たに追加されたこともわかります。


再度文字化けしたページを表示します。


アドレスバーの右側のCharsetのボタンをクリックします。下図のドロップダウンメニューが表示され、エンコーディングの一覧が表示されます。 変更したいエンコーディングの項目をクリックします。今回は、[Unicode (UTF-8)]に切り替えます。項目をクリックします。


表示がUnicode UTF-8に切り替わりました。文字化けしていた文字が正しく表示されました。

手順:Google Chrome

Google Chrome の場合はウィンドウ右側のメニューボタン[...]をクリックします。下図のドロップダウンメニューが表示されます。 メニューの[その他のツール]の[拡張機能]の項目をクリックします。


拡張機能の画面が表示されます。


画面左上のハンバーガーメニューのボタンをクリックします。下図のメニューがスライドイン表示されます。メニューの下部の[Chrome ウェブストアを開きます]の項目をクリックします。


下図の Chrome ウェブストアのページが表示されます。


左上のテキストボックスに "Charset" を入力して検索します。右側の検索結果の一覧が表示されます。右側のエリアの[Charset]の項目をクリックします。


Charset の詳細ページが表示されます。ページの右上の[Chrome に追加]ボタンをクリックします。


ウィンドウ上部に確認ダイアログが表示されます。下図のメッセージが表示されます。ダイアログ下部の[拡張機能の追加]ボタンをクリックします。


拡張機能がインストールされた旨のメッセージが表示されます。


再度文字化けしたページを表示します。アドレスバーの右側にボタンが新たに追加されています。


アドレスバーの右側のCharsetのボタンをクリックします。下図のドロップダウンメニューが表示され、エンコーディングの一覧が表示されます。 変更したいエンコーディングの項目をクリックします。今回は、[Unicode (UTF-8)]に切り替えます。項目をクリックします。


表示がUnicode UTF-8に切り替わりました。文字化けしていた文字が正しく表示されました。


Webブラウザで明示的に文字コードを指定した表示ができました。