読者です 読者をやめる 読者になる 読者になる

jQueryのgetJSONで文字コード違うとIEでスクリプトエラーになるのを解消する

jQueryでgetJSON使ってjsonpするライブラリ作っていたのだけど、IEでエラーになるって指摘を受けた。
(僕はFirefoxだったのと、utf-8のページでロードしてたので気付かなかったのよね。。)


で、確認した。
確かにエラー。
なんでだろ?と思いIEのデバッガでエラーを確認してみると、
どうやら取得したJSONの文字化けのせいっぽい。


確かに、自分で作ったスクリプトを<script charset="utf-8" ...>とかでロードしたとしても、
その先のjsonpの部分でcharset指定しないと文字化けを起こすよね。


と言うことでjQueryのドキュメントを確認。
jQuery.ajax( options )
…それっぽいのがナイでやんの。。。


と言うことでjQueryのソース見てみた。
jsonpだからcreateElement("script")してるところを探してみると、
あった。

var script = document.createElement("script");
script.src = s.url;
if (s.scriptCharset)
script.charset = s.scriptCharset;

あったね。見事にあった。s.scriptCharset。
コレ指定すればよいわけね。
ドキュメントに書いておいてよ。。


で、これを使うために以下の1行を追加。

$.ajaxSetup({scriptCharset:'utf-8'});

$.getJSONのときに毎回指定しても良いけど、何個も使ってるし、全部utf-8で返すjsonpだったのでajaxSetupで指定しました。


試したら上手くいった。
良かった。


その後scriptCharsetで探してみたら他にも言ってるサイトあった。

第12回 jQueryライブラリ(2530行目~2833行目):jquery.jsを読み解く|gihyo.jp … 技術評論社

また,s.scriptCharsetが指定されていれば2610行目でcharsetを設定します。

jQueryとphpでAjaxな郵便番号入力補助を作ったんで後はcssとキャッシュコントロール - blog::konk303

IE 文字化け問題

jQueryの問題だったorz。詳しくは後で書くけど、ajax.setupの中にscriptCharsetってオプションがあって(documentには未記載)、scriptタグのcharsetにはこれが使われるんだな。
utf-8に設定したら何の問題もなく動いた。


ちなみに、返すjsonが日本語でなければそもそもエラー出ない。
Unicode の文字列をソースコードに埋め込む方法 - bkブログ

JavaScript の場合、document.write("\u3042\u0062\u0063") などによって出力された文字列はウェブページのエンコーディングに合わせてよきにはからわれます。

これね。Unicodeだとそのページの文字コードに合わせてよきにはかられると。
はてブのコメント返すJSONPUnicodeになってたのでエラーになりませんでした。