ＦＣ２ブログでＩＥ6だけに出る「webページに問題があるため...」というエラーの原因はtwitterだった！

ご注意：この記事はウェブマスター向けで、専門的過ぎる記事なので、一般の方には意味がわからない可能性があります。

ここ１週間ほどＩＥ６（Internet Explorer 6）にだけ起こる不可解なエラーに悩まされていた。その不可解なエラーは、ＩＥ８、Firefox、Chrome、Safariでは、でないエラーだった。ちなみにIE7はチェックしていない。

「うぇぶかにほん公式ブログ日本Web化計画」では、ＩＥ６をサポート対象から外したというアナウンスをしていますが、まだ使っている人が多いのも事実なのでＩＥ６のブラウザチェックもしている。本音を言えば、このやっかい極まりないＩＥ６がこの世界からなくなってしまえば・・・と思いますが・・・

上の画像がそのエラーで、「Webページに問題があるため、正しく表示または機能しなくなる可能性があります。今後、ステータスバーに表示された警告アイコンをダブルクリックすると、このメッセージを表示できます。」という警告ダイアログが何度も連続して出る。

詳細には、以下のメッセージが・・・

　ライン:2
　文字:3581
　エラー:"}"がありません。
　コード:0
　URL:http://webkacoco.blog84.fc2.com/

次に[ツール][インターネットオプション][詳細設定]のブラウズ[スクリプトのデバッグを使用しない（Internet Explorer）]のチェックを外して、再度ＩＥ６で見ると以下のエラー表示が・・・



　ランタイムエラーが発生しました。デバッグしますか？
　行：１
　エラー："}"がありません。

さらにブログタイトル下の「about」～「Search」切り替えタブボタンが機能しない。

「切り替えタブボタンのJavaScriptの構文エラーかな？ "}" どっか抜けてるのかな？」と思い、JSファイルを調べてみたが、何度見直しても間違いはみつからない。

「うーんおかしい、まさかＩＥ６お得意のバグか！？」

嫌な予感がしたので、同じオリジナルテンプレートを使っている「なか散歩」「日本Web化計画」をＩＥ６で確認してみた。すると、なか散歩では同じエラーが出たが、日本Web化計画ではなぜかエラーが出なかった。

「文字コードか？」

この３つのブログに、決定的な違いがあることを思い出した。「ピースフルパラダイスライフ」と「なか散歩」の文字コードは「euc-jp」、しかし、同じＦＣ２ブログである「日本Web化計画」は、なぜか「UTF-8」なのだ。そして、切り替えスイッチに使っているＪＳファイルは、UTF-8(正確にはUTF-8N)を指定して保存している。

そう、euc-jpのブログにUTF-8で保存されたJSファイルを読み込んでいたのが原因だった。だから２つのブログだけは、JSファイルが文字化けしてしまいエラーになったのだ。非常に初歩的なミスである。しかし、ＩＥ８では問題なく機能しているので、まったく気がつかなかった。さっそく以下のように[charset="UTF-8"]を追加した。こうする事でＩＥ６にだけ起こる文字コードの違いによる不具合を改善できる。

<script type="text/javascript" src="http://ほにゃらら/切り替え.js" charset="UTF-8"></script>

「よし、これでＯＫのはずだ！」

そう思い込み、すがすがしい気分で、再度ＩＥ６のチェックをしてみた。しかし、なんと、まったく同じエラーがやはり何度も連続で出るではありませんか！

「どうゆうことだこれは！？」

ただ今回は、先ほどの切り替えタブボタンが機能しない不具合は改善していた。やはり、JSファイルとの文字コード違いは、トラブルの原因だったということである。

では、他に一体何が問題だというのか？JavaScriptの構文もCSSもHTMLも何度見直してみてもエラーチェック用のソフトを使ってみても問題が発見できなかった。

それから一週間が過ぎた・・・その間、暇さえあればGoogleで問題の答えを尋ねてみたが、無情にも正解は見つからなかった。

「だめだ見つからない・・・これは、きっとＩＥ６の呪いなんだ！そうだ、呪いだ！たぶん私のＰＣのＩＥ６にだけ起こっている呪いなんだ！ブツブツブツ・・・」

気が狂いそうな気分で、今日もHTMLをひとつひとつチェックしていた。

諦めかけたその時、ふと他にもJSファイルがあることに気がついた。

それは・・・

Twitter公式ツイートボタンのタグだった。

そうです、原因は自分ではなくTwitter公式ツイートボタンだったのだ！

「なんてこったぁ～、ついったぁあ～ああついったああああ！」

ツイッタータグのJSファイルは、やはりUTF-8で保存されていた。タグに以下のように[charset="UTF-8"]を追加するとエラーは無くなった。

<a href="http://twitter.com/share" class="twitter-share-button" data-count="horizontal" data-via="webkajp" data-lang="ja">Tweet</a><script type="text/javascript" src="http://platform.twitter.com/widgets.js" charset="UTF-8"></script>

まさか、ツイッター・・・完全に盲点だった。しかしこれ、素人だとまず気がつか可能性が高いでしょ・・・もしかしたらツイッターは意図的にIE6排除するためにエラーが出るようにしているんじゃ！？おかげで、何時間時間を使った事か・・・。

念のためTwitter公式ウィジェットのプロフィールウィジェットのタグにも[charset="UTF-8"]を追加しておいた。

つかれた。