Firefox、Chromeなどで文字化けを防ぐ方法 ヘッダー情報に文字コードを指定
FirefoxやGoogle ChromeではHTMLのContent-typeに文字コードを指定しても文字化けすることがあります。
HTTPの仕様ではサーバからファイルをブラウザ(クライアント)に送信するときに、本文より前のヘッダー情報の中にContent-typeを指定する必要があります。
[参考記事] PHPのよく使うヘッダー関数のまとめ
[参考記事] Internet Explorerでヘッダー情報をみる方法
[参考記事] Firefoxでヘッダー情報をみる方法
[参考記事] Google ChromeでHTTP headerをみる方法
[参考記事] docomo端末でCSSを使うには
ページにアクセスしたときにサーバから送信される情報は次のようになっています。
HTTP/1.1 200 OK Date: Sat, 11 Jun 2011 08:17:41 GMT Last-Modified: Sat, 11 Jun 2011 08:05:56 GMT Accept-Ranges: bytes Content-Length: 22744 Keep-Alive: timeout=15, max=1000 Connection: Keep-Alive Content-Type: text/html; charset=shift_jis Content-Language: ja <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> <html xmlns="http://www.w3.org/1999/xhtml" xml:lang="ja" lang="ja"> ……… …… ……… </html>
ここで最初の改行2つでヘッダー情報とボディー部に分けられます。
つまり次の部分がヘッダー情報です。
HTTP/1.1 200 OK Date: Sat, 11 Jun 2011 08:17:41 GMT Last-Modified: Sat, 11 Jun 2011 08:05:56 GMT Accept-Ranges: bytes Content-Length: 22744 Keep-Alive: timeout=15, max=1000 Connection: Keep-Alive Content-Type: text/html; charset=shift_jis Content-Language: ja
ブラウザ(クライアント)からサーバに送信するリクエストヘッダーと区別して、サーバからブラウザ(クライアント)に送信されるヘッダー情報はレスポンスヘッダーとも呼ばれます。
[参考記事] リクエストヘッダーをみるツール
このレスポンスヘッダーは、これから送信する情報がどんなものかをあらわしています。
そこでヘッダー情報にあるContent-Typeはこのファイルがどのような種類のファイルかという情報になりますが、文字コードを指定することがRFCでは推奨されています。(should)
FirefoxやGoogle Chromeではこの情報を重視するため、HTMLのContent-typeに文字コードを指定しても文字化けしてしまうことがあります。
ヘッダー情報にあるContent-Typeに文字コードを指定するには、httpd.confや.htaccessに次のコードを追加します。
UTF-8であれば
AddType "text/html; charset=utf-8" .html
Shift-JISであれば
AddType "text/html; charset=shift_jis" .html
またXMLファイルの場合は次のように指定します。
AddType "application/xml; charset=utf-8" .xml
[参考記事] PHPのよく使うヘッダー関数のまとめ
[参考記事] Internet Explorerでヘッダー情報をみる方法
[参考記事] Firefoxでヘッダー情報をみる方法
[参考記事] Google ChromeでHTTP headerをみる方法
[参考記事] docomo端末でCSSを使うには
[参考記事] Androidのapkファイルをサーバから端末にダウンロードする
関連記事
- HTMLソースの最後にコメントで『Quick Cache』とあるページ
- inputタグにhiddenで隠された__VIEWSTATEとは(通信の盗聴、値の改ざん、回線の圧迫)
- Twitterウィジェットのカスタマイズ(ウィジェット部分のHTML・CSS)
- 多言語対応テキストエディタの一覧
- サイトマップ(sitemap.xml)のつくり方とちょっとしたテクニック
- Windows7やWindowsVistaでTelnetを使用する方法
- SELECTタグで色を選択する場合のサンプル
- ナインパッチとは(9-Patch)
- SSL(HTTPS)でファイルのダウンロードができない場合
- Google Chromeで一部の文字だけ四角記号に文字化けするときの対処法
- 特定のディレクトリのみベーシック認証を外す方法
- BRタグが<br />と書ける理由 『<br> が <br /』で『</br> が >』になる
- DOCTYPE宣言/XML宣言
- htmlファイルのコメントに <!--# から始まるものは使用しないほうがいい
- IPアドレス制限とベーシック認証を併用する方法
- サブドメインにアンダーバーがあるとクッキーは使えない
- 会員専用ページを作る方法 (ベーシック認証 / Basic認証 / 基本認証)
- 都道府県を選択するときのサンプルコード (JISコード準拠)
- 生年月日などで年を選択するときのサンプルコード
- 連続する半角英数字を途中で自動改行させるには、​が使えます
- SSLの警告
- mailtoの使い方
- 開発環境 ツール類
- PHP
- phpMyAdminでログイン画面を出さずにデータベースに接続する方法
- MACアドレス変更ソフト K-MAC
- コマンドラインからpearを実行するとエラーが出る 環境変数PHP_PEAR_PHP_BINの設定
- Softbankで絵文字を表示させる
- WinSCPでリスト取得のエラー『ディレクトリのリストに不正な行 'ケ邱ラ' 不正な権限の表記』
- プラグインvagrant-vbguestを使うときの注意点
- 「VCRUNTIME140_1.dllが見つからないため、コードの実効を続行できません」の対処法
- CakePHPでカラムを比較してSELECTする方法
スポンサーリンク