今回は CORS を使用して WebApi Ajax クロスドメイン リクエストを実装する方法について説明します。 CORS を使用して WebApi Ajax クロスドメイン リクエストを実装する際に注意すべき点は何ですか? 以下は実践的なものです。ケース、見てみましょう。
概要ASP.NET Web API を使用したことがある人なら誰でも、複雑な
構成ファイルはなく、単純な ApiController と必要なアクションだけで機能することを知っています。ただし、API を使用する場合、クロスドメイン リクエストの問題が常に発生します。特に今日ではさまざまな APP が急増しており、API に対するクロスドメイン リクエストは避けられません。デフォルトでは、CSRF クロスサイト フォージェリ攻撃 (または
javascriptの同一オリジン ポリシー) を防ぐために、Web ページが別のドメインからデータを取得する場合は制限されます。この制限を突破する方法はいくつかありますが、これはよく知られた JSONP です。もちろん、これは多くの解決策の 1 つにすぎません。JSONP は GET リクエストのみをサポートしているため、今日の複雑なビジネスのニーズを満たすことはできません。 CORS (Cross Origin Resource Sharing https://www.w3.org/wiki/CORS) クロスドメイン リソース共有は、サーバーがクロスドメイン制限を緩和し、ヘッダーに基づいて制限を切り替えることを可能にする新しいヘッダー仕様です。クロスドメインリクエストを制限しません。重要なことは、すべての http リクエスト メソッドをサポートしていることです。
QuestionXMLHttpRequest クロスドメイン POST または GET リクエストの場合、リクエスト メソッドは自動的に OPTIONS の質問になります。
CORS (クロスオリジンリソースシェア) 仕様の存在により、ブラウザは最初にオプションスニフを送信し、同時にヘッダーにオリジンを含めて、クロスドメインリクエストの許可があるかどうかを判断します。サーバーは、ブラウザーのアクセス制御許可オリジンの値で応答します。オリジンと一致する場合、サーバーがプログラムにクロスドメインへのアクセスを許可しない場合でも、
投稿リクエストが正式に送信されます。サポートされている場合、リクエストは無効になります。
理由セキュリティ上の理由から、ブラウザはプリフライトリクエストの透過的なサーバー検証メカニズムを使用して、カスタムヘッダー、GET または POST 以外のメソッド、およびさまざまなタイプのテーマコンテンツを使用する開発者をサポートします。つまり、オプションリクエストはを最初に送信し、
リクエストを正しく送信する (許可する) かどうかをサーバーに問い合わせて、リクエストを送信しても安全であることを確認します。
OPTIONS が表示される状況は一般的に次のとおりです:
1. 非 GET、POST リクエスト
2. POST リクエストのコンテンツ タイプは、従来の 3 つではありません: application/x-www-form-urlencoded (HTTP を使用して送信) POST メソッド form)、multipart/form-data (上記と同じですが、主にフォームの送信に
ファイルのアップロードが伴う場合に使用されます)、text/plain (プレーン テキスト)3 POST リクエストのペイロードは text/ です。 html
4、カスタム ヘッダーの設定
OPTIONS リクエスト ヘッダーには、Origin、Access-Control-Request-Method、Access-Control-Request-Headers のヘッダーが含まれます。このリクエストを送信した後、サーバーは次のヘッダーとヘッダーを設定できます。ブラウズはサーバーと通信して、リクエストを許可するかどうかを決定します。
Access-Control-Allow-Origin、Access-Control-Allow-Method、Access-Control-Allow-Headersソリューションこのメソッドは強力で、ASP.NET Web の複雑なクロスドメイン要求を解決できます。複雑なヘッダー情報、本文コンテンツ、および認証検証情報を運ぶ API
方法 1
public class CrosHandler:DelegatingHandler { private const string Origin = "Origin"; private const string AccessControlRequestMethod = "Access-Control-Request-Method"; private const string AccessControlRequestHeaders = "Access-Control-Request-Headers"; private const string AccessControlAllowOrign = "Access-Control-Allow-Origin"; private const string AccessControlAllowMethods = "Access-Control-Allow-Methods"; private const string AccessControlAllowHeaders = "Access-Control-Allow-Headers"; private const string AccessControlAllowCredentials = "Access-Control-Allow-Credentials"; protected override TaskSendAsync(HttpRequestMessage request, CancellationToken cancellationToken) { bool isCrosRequest = request.Headers.Contains(Origin); bool isPrefilightRequest = request.Method == HttpMethod.Options; if (isCrosRequest) { Task taskResult = null; if (isPrefilightRequest) { taskResult = Task.Factory.StartNew (() => { HttpResponseMessage response = new HttpResponseMessage(System.Net.HttpStatusCode.OK); response.Headers.Add(AccessControlAllowOrign, request.Headers.GetValues(Origin).FirstOrDefault()); string method = request.Headers.GetValues(AccessControlRequestMethod).FirstOrDefault(); if (method != null) { response.Headers.Add(AccessControlAllowMethods, method); } string headers = string.Join(", ", request.Headers.GetValues(AccessControlRequestHeaders)); if (!string.IsNullOrWhiteSpace(headers)) { response.Headers.Add(AccessControlAllowHeaders, headers); } response.Headers.Add(AccessControlAllowCredentials, "true"); return response; }, cancellationToken); } else { taskResult = base.SendAsync(request, cancellationToken).ContinueWith (t => { var response = t.Result; response.Headers.Add(AccessControlAllowOrign, request.Headers.GetValues(Origin).FirstOrDefault()); response.Headers.Add(AccessControlAllowCredentials, "true"); return response; }); } return taskResult; } return base.SendAsync(request, cancellationToken); } }
protected void Application_Start() { IOCConfig.RegisterAll(); AreaRegistration.RegisterAllAreas(); WebApiConfig.Register(GlobalConfiguration.Configuration); FilterConfig.RegisterGlobalFilters(GlobalFilters.Filters); RouteConfig.RegisterRoutes(RouteTable.Routes); BundleConfig.RegisterBundles(BundleTable.Bundles); GlobalConfiguration.Configuration.MessageHandlers.Add(new CrosHandler()); }
Global.asax ファイルに次の設定を追加します
設定ファイル、この方法は単純で、単純なクロスドメインリクエストに対処するためのものですAjax を使用して Razor ページを部分的に更新する方法の詳細な説明
以上がCORS を使用して WebApi Ajax クロスドメイン リクエストを実装する方法の詳細内容です。詳細については、PHP 中国語 Web サイトの他の関連記事を参照してください。