AJAXによるMVCまたはWebAPIサービスへのクロスドメイン呼び出しの問題点と解決策 ASP.NET

クズども · 掲載地 2015/12/01 15:20:20

問題の説明

MVCやWeb API ASP.NET 書かれたサービス ASP.NET クロスドメインコールが行われると、アクセス不能になります。

繁殖方法

テンプレートを使って最もシンプルな ASP.NET Web APIプロジェクトを作成し、デバッグして動作を確認します
HTMLページが1つだけの別のプロジェクトを作成し、AJAXコールを行ってください
ブラウザでこのページを開くと、以下のエラーが表示されます(405:方法が許可されていません)

注:同様の状況は ASP.NET MVCでも発生します。場合によっては、MVCはサービス開発に直接利用されることもあり、これはWebAPIと比べて独自の利点と欠点があります。以下はMVCを用いて開発されたサービスの例です

原因分析

クロスドメイン問題の根本的な理由は、ブラウザが両方のリクエストに対して低い権限を持ち、通常はローカルドメインのリソースへの呼び出しのみを許可し、ターゲットサーバーが明確にクロスドメインコールを許可しない限り例外であることにあります。

したがって、クロスドメイン問題はブラウザの挙動によって引き起こされますが、解決策はサーバー側にあります。すべてのクライアントにセキュリティを下げることを義務付けることは不可能だからです。

解決

MVCと ASP.NET ASP.NET Web APIの両方のプロジェクトタイプについて調べた結果、以下のシナリオが実現可能だと判断しました。

ASP.NET MVCの場合は、web.configに以下の内容を追加するだけで済みます

ASP.NET Web APIについては、上記の設定に加えて、各APIコントローラーごとにOPTIONSメソッドを追加する特別な設計が必要ですが、何も返さずに。

パブリック文字列オプション()

{

nullを返します; HTTP 200 レスポンス(空体付き)

}

注意:この機能は調査すれば実現可能で、フィルターとして設計した方が良い場合もあります。

クズども · 掲載地 2015/12/01 15:39:52

<system.webServer>
<httpProtocol>
<customHeaders>
<add name="Access-Control-Allow-Origin" value="*" />
<add name="Access-Control-Allow-Headers" value="Content-Type" />
<add name="Access-Control-Allow-Methods" value="GET, POST, PUT, DELETE, OPTIONS" />
</customHeaders>
</httpProtocol>
<handlers>
<remove name="ExtensionlessUrlHandler-Integrated-4.0" />
<remove name="OPTIONSVerbHandler" />
<remove name="TRACEVerbHandler" />
<add name="ExtensionlessUrlHandler-Integrated-4.0" path="*." verb="*" type="System.Web.Handlers.TransferRequestHandler" preCondition="integratedMode,runtimeVersionv4.0" />
</handlers>
</system.webServer>

コードをコピーします

[WebAPI] AJAXによるMVCまたはWebAPIサービスへのクロスドメイン呼び出しの問題点と解決策 ASP.NET