jQuery 1.10.1の落とし穴

最近はローカルアプリが主流ですが、珍しくFacebookのWebアプリを開発することになりました。

で、その時にハマったことと、その解決策でも書いておくことにします。

jQueryは現在、最新版が2.0.2と1.10.1で、2.0.2はInternet Explorer 8(IE8)以下が非サポートとなっています。

IE8以下は、すでにGoogleYahoo!JAPANが非対応の方針を打ち出したので、もう切り捨てでも良いかと思いますが、いちおう今回はjQuery 1.10.1を導入することに。

FacebookのWebアプリは、手順としては普通にWebサイトを作って、それをFacebook上でインラインフレーム(iframe)に組み込む形になります。

ということで、まずは普通に自前サーバ、自前ドメインで開発して、バグチェックも完了。

いざFacebook Developersのページからアプリ登録して、Facebook上で動かしてみると、Google Chrome 27Firefox 21Safari 6では問題がないのに、Internet Explorer 10(IE10)、Opera 12ではJavaScriptが動作しません。

例えば、

<!DOCTYPE html>
<html lang=”ja”>
<head>
<meta charset=”utf-8″>
<script src=”https://www.example.com/jquery-1.10.1.js”></script>
<script>
$(function() {
$(“#test”).append(“<h1>OK!</h1>”);
});
</script>
</head>
<body>
<div id=”test”></div>
</body>
</html>

のような簡単なスクリプトでも、動かない状態です。

ググると、クロスサイト対策でCookieが拒否されるとか、JSONPを使えとか、ずいぶん彷徨いましたが、何てことはなく、jQueryのバージョンに問題があったようです。

ということで、jQuery 1.10.1からjQuery 1.9.1に変更すると何事もなかったかのように解決。

う~む、今回もマイクロソフトの罠かと思いましたよ。

コメントを残す