Greasemonkeyユーザースクリプト内のjQuery.getJSON
-
22-07-2019 - |
質問
クロスドメインAJAXリクエストを行うユーザースクリプトを記述しようとしています。
@requireを使用してスクリプト内にjQueryを含めましたが、jQuery.getJSONを実行しようとするまではすべて正常に動作しているようです。
アクセスしているAPIはjsonpをサポートしていますが、jsonp123456789が定義されていないことを示すエラーが引き続き表示されます。
これを収集できたのは、jQueryがページの先頭に直接jsonp応答を書き込み、それがサンドボックス化されるためです。それが発生すると、jQueryはコールバックにアクセスできなくなり、未定義になります。 (私はこれが事実であるというわけではありませんが、私にはそう思われます。)
これを回避する方法はありますか? unsafeWindow内でコールバック関数を宣言することをお勧めしますが、これを行う方法がわからず、機能させることができませんでした。
解決
jQueryが GM_xmlhttpRequest
を内部的に使用してjQueryメソッドとGreasemonkeyのクロスサイト機能のすべての利便性を得ることができたらいいと思いませんか? mahemoffが指摘しているように、GreasemonkeyはJSONPに依存せずに直面しているコールバックの問題に遭遇することなくリクエストを行うことができますが、JSONコンテンツを自分で処理する必要があります。
これを行うライブラリを作成しました: Greasemonkey / jQuery XHRブリッジ。 userscriptでそのスクリプトを @require
した場合、すべての $。get
および $。getJSON
および $。post
など。jQuery呼び出しは、JSONPなどの手法に依存せずにクロスサイトで機能します。
したがって、このブリッジを使用し、URLから?callback =?
を削除するだけで、jQueryコードは修正なしで機能します。 このブログ投稿では、段階的なウォークスルーを提供しています。ブリッジプラグインに関する質問、コメント、バグレポート、提案がある場合は、お知らせください。
他のヒント
回避策は、GM_HttpRequestを使用することです。通常のXHRとは異なり、GM_HttpRequestはクロスドメインコールを許可するため、クロスドメインリクエスト用のJSONPの代わりにこれを使用できます。次のようなものが必要です:
GM_xmlhttpRequest({
method: "GET",
url: "http://example.com/path/to/json",
onload: function(xhr) {
var data = eval("(" + xhr.responseText + ")");
// use data ...
}
});
このevalのJSONは最も簡単な方法です。信頼できないJSONに対してより安全なソリューションが必要な場合は、小さなJSON解析ライブラリ。
残念ながら、一見無駄なゼロ期間setTimeout をラップする必要もあります。全部。 GM_xmlhttpRequestを独自のメソッドに固定してから、setTimeout(makeCall、0);を実行するのが最も簡単です。
実際の例はこちらをご覧ください。
ご存じのとおり、現時点では、Google Chromeは便利なGM_機能をサポートしていません。
そのため、さまざまなサンドボックスの制限により、クロスサイトAJAXリクエストを行うことは不可能です(ジェームズ・パドルシーのクロスドメイン要求スクリプト)
ChromeでGreasemonkeyスクリプトがいつ更新されたかをユーザーが知る方法が必要でした(Chromeでも更新されないため...)。ここに文書化されたソリューション(および Lighthouse ++ スクリプトで使用されているソリューション)を思い付きました。スクリプトのバージョンをチェックしたい人のために読む価値があります:
http://blog.bandit.co .nz / post / 1048347342 / version-check-chrome-greasemonkey-script