web-dev-qa-db-ja.com

CORS-httprequestを「プリフライト」する方法

（所有している）WCFサービスに対してクロスドメインHTTPリクエストを作成しようとしています。クロスドメインスクリプティングの制限に対処するためのいくつかのテクニックを読みました。私のサービスはGETおよびPOSTリクエストの両方に対応する必要があるため、srcがGETリクエストのURLである動的スクリプトタグを実装することはできません。サーバーで自由に変更できるため、「Access-Control-Allow-Origin」ヘッダーと「preflight」リクエストおよびOPTIONSリクエストを含むようにサーバーの応答を設定する回避策の実装を試み始めました。私はこの投稿からアイデアを得ました： Getting CORS working

サーバー側では、私のWebメソッドは 'Access-Control-Allow-Origin：*'をHTTP応答に追加しています。現在、応答にはこのヘッダーが含まれていることがわかります。私の質問は：リクエスト（オプション）を「プリフライト」するにはどうすればよいですか？私はjQuery.getJSONを使用してGETリクエストを実行していますが、ブラウザは悪名高いリクエストをすぐにキャンセルします。

Origin http：// localhost はAccess-Control-Allow-Originでは許可されていません

このCORSテクニックに精通している人はいますか？リクエストをプリフライトするには、クライアントでどのような変更が必要ですか？

ありがとう！

javascriptwcfjquerycors
88
Nick

プリフライトリクエスト中に、Access-Control-Request-MethodおよびAccess-Control-Request-Headersの2つのヘッダーが表示されます。これらのリクエストヘッダーは、実際のリクエストを行うための許可をサーバーに求めています。実際のリクエストが機能するためには、プリフライトレスポンスでこれらのヘッダーを確認する必要があります。

たとえば、ブラウザが次のヘッダーでリクエストを作成するとします。

Origin: http://yourdomain.com
Access-Control-Request-Method: POST
Access-Control-Request-Headers: X-Custom-Header

サーバーは、次のヘッダーで応答する必要があります。

Access-Control-Allow-Origin: http://yourdomain.com
Access-Control-Allow-Methods: GET, POST
Access-Control-Allow-Headers: X-Custom-Header

Access-Control-Allow-Headers応答ヘッダーに特に注意してください。このヘッダーの値は、Access-Control-Request-Headersリクエストヘッダーと同じヘッダーである必要があり、「*」にすることはできません。

この応答をプリフライトリクエストに送信すると、ブラウザが実際のリクエストを行います。 CORSの詳細については、こちらをご覧ください： http://www.html5rocks.com/en/tutorials/cors/

148
monsur

このスレッドは2014年にさかのぼりますが、この問題は私たちの多くにとって最新のものです。 jQuery 1.12/PHP 5.6コンテキストでどのように対処したかを次に示します。

  • jQueryは、限られたヘッダーのみを使用してXHRリクエストを送信しました。 「Origin」のみが送信されました。
  • プリフライトリクエストは不要です。
  • サーバーはそのようなリクエストを検出し、「Access-Control-Allow-Origin：」を追加するだけで済みました。これがクロスオリジンXHRであることを検出した後の$ _SERVER ['HTTP_Origin']ヘッダー。

PHPコードサンプル：

if (!empty($_SERVER['HTTP_Origin'])) {
    // Uh oh, this XHR comes from outer space...
    // Use this opportunity to filter out referers that shouldn't be allowed to see this request
    if (!preg_match('@\.partner\.domain\.net$@'))
        die("End of the road if you're not my business partner.");

    // otherwise oblige
    header("Access-Control-Allow-Origin: " . $_SERVER['HTTP_Origin']);
}
else {
    // local request, no need to send a specific header for CORS
}

特に、プリフライトは必要ないため、exit;を追加しないでください。

0
Fabien Haddadi