1

私はこの問題の解決策を見つけるためにほぼ一日を費やしました。

Google fontsAPIとjQuery1.4.4を使用して、多くのフォントを動的に取得して表示するコードを正常に記述しました。（すべてのブラウザで動作します）

jQueryをバージョン1.7.2に変更する必要がありましたが、残念ながら、作成したコードはInternetExplorerを除くすべてのブラウザーで正常に機能することに気付きました。

いくつかのテストを行ったところ、Internet Explorerで、1.4.4より前のバージョンのjQueryを使用すると、$。getJSONまたは$.ajaxがGoogleからJSONフォントデータを読み込めないことがわかりました。

これは私が使用しているコードです：

$(function(){           

$.getJSON('https://www.googleapis.com/webfonts/v1/webfonts?key=XXXXXX', function(json) {

alert(json);

});
});

いくつかの調査の後、私もこれを試しました：

$.ajax({
type: "get",
url: "https://www.googleapis.com/webfonts/v1/webfonts?key=XXXXXXXX",
cache:false,
dataType:'json',
success: function(data){
alert(data);
}
});

1.4.4以降のjQueryバージョンを使用するInternetExplorerでは、どちらの方法も失敗します。何も起こりません。

なぜ何かアイデアはありますか？助けてくれてありがとう。

4

1 に答える 1

1

サイトのドメイン外のホストへの接続をブロックしているのはIEのようです。これは同一生成元ポリシーによるものです。これは通常、最新の最高のブラウザでは大した問題ではありませんが、どのブラウザでも発生する可能性があります。JSFiddleを使用してコードをテストしたところ、Chrome21の同一生成元に関するエラーがスローされました。

通常、これを修正する方法はJSONPを使用することです。残念ながら、GoogleWebfontsAPIはJSONPをサポートしていません。そのデータクロスブラウザを取得することについて私が考えることができる最善の方法は、PHPなどのサーバー側プログラミング言語を使用してJSONをダウンロードすることです。そこから、JSONをページにエコーアウトし、$.getJSON関数を使用してサーバー上でローカルにそのデータを取得できます。

例： fontApi.php（サーバー上のローカルファイル）

<?php
$json = file_get_contents('https://www.googleapis.com/webfonts/v1/webfonts?key=XXXXXX');
die($json); // prints JSON to the screen that jQuery can use
?>

次に、次のjQueryを使用します...

$.getJSON('fontApi.php', function(json) {
    //your code
});

うまくいけば、これはあなたを助けるでしょう:)

于 2012-08-08T23:42:59.337 に答える