6

新しいブラウザをサポートするだけです。

JSONP データを提供するために外部サービスに依存する必要があります。私はそのサービスを所有しておらず、CORSを許可していません。

外部サーバーからの JSONP リクエストを信頼しなければならないことに非常に不安を感じています。外部サーバーは私の側で任意のコードを実行できるため、ユーザーを追跡したり、情報を盗んだりする可能性さえあるからです。

安全なJSONPリクエストを作成する方法があるかどうか疑問に思っていましたか?

(関連:パブリックな JSONP リクエストを確実に保護する方法はありますが、新しいブラウザーの緩和ではそうではありません)

注: Q&A スタイルで質問/回答しましたが、他のアイデアにも非常にオープンです。

4

1 に答える 1

11

はい！

可能です。それを行う 1 つの方法は、WebWorkersを使用することです。WebWorkers で実行されているコードは、ページが実行している DOM またはその他の JavaScript コードにアクセスできません。

WebWorker を作成し、それを使用して JSONP リクエストを実行し、完了したら終了することができます。

プロセスは次のようなものです。

  • リクエストする URL を使用して BLOB から WebWorker を作成する

  • importScriptsローカル コールバックで JSONP リクエストをロードするために使用します

  • そのコールバックが実行されると、メッセージがスクリプトに戻されます。スクリプトは、データを使用して実際のコールバック メッセージを実行します。

そうすれば、攻撃者は DOM に関する情報を一切知ることができなくなります。

実装例は次のとおりです。

//   Creates a secure JSONP request using web workers.
//   url - the url to send the request to
//   data - the url parameters to send via querystring
//   callback - a function to execute when done
function jsonp(url, data, callback) {
    //support two parameters
    if (typeof callback === "undefined") {
        callback = data;
        data = {};
    }
    var getParams = ""; // serialize the GET parameters
    for (var i in data) {
        getParams += "&" + i + "=" + data[i];
    }
    //Create a new web worker, the worker posts a message back when the JSONP is done
    var blob = new Blob([
        "var cb=function(val){postMessage(val)};" +
        "importScripts('" + url + "?callback=cb" + getParams + "');"],{ type: "text/javascript" });
    var blobURL = window.URL.createObjectURL(blob);
    var worker = new Worker(blobURL);

    // When you get a message, execute the callback and stop the WebWorker
    worker.onmessage = function (e) {
        callback(e.data);
        worker.terminate();
        };
    worker.postMessage(getParams); // Send the request
    setTimeout(function(){
        worker.terminate();//terminate after 10 seconds in any case.
    },10000);
};

JSFiddle で機能する使用例を次に示します。

jsonp("http://jsfiddle.net/echo/jsonp", {
    "hello": "world"
}, function (response) {
    alert(response.hello);
});

この実装は他のいくつかの問題には対処しませんが、ページ上の DOM または現在の JavaScript へのすべてのアクセスを防ぎます。安全な WebWorker 環境を作成できます。

これは、IE10+、Chrome、Firefox、Safari、およびモバイル ブラウザーで動作するはずです。

于 2013-05-21T00:07:14.730 に答える