CORSを有効にしましたが、プレフライトの応答に無効なHTTPステータスコード404が付きます。JSONを投稿するとき

Question

私は徹底的に検索しましたが、特定の状況でこの問題の解決策を見つけることはできません。

Fiddler（POST）を使用したクロスドメインサービスコールが正しく実行され、データが受信されます。しかし、ブラウザ（Chrome）から「プリフライトで無効なHTTPステータスコード404があります」というメッセージが表示されます

Web APIアプリケーションがあり、CORSがインストールされており、web.configファイルに次の情報が含まれています。

ここで

<system.webServer> 
    <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> 
    <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> 
</system.webServer> 

Ajax呼び出している：明らかに

var secretKey = 'difusod7899sdfiertwe08wepifdfsodifyosey', 
    url = 'http://api.intrinsic.co.uk/api/v1/PTS/ActiveDrivers?api_key=098werolllfWnCbPGAuIXVOJidDHRfYcgxImMlxTXopuekXrSOqOWzEAIdeNTWGPQPpyHxgVGsFysGFKPzq'; 

    jQuery.ajax ({ 
     url: url, 
     type: "POST", 
     data: JSON.stringify({ secretKey: secretKey}), 
     dataType: "json", 
     contentType: "application/json; charset=utf-8", 
     success: function(data){ 
      var content = "<table class=\"container\"><thead><tr><th>Driver Number</th><th>Timestamp</th><th>VRN</th><th>Latitude</th><th>Longitude</th><th>Track Link</th></tr></thead><tbody>"; 
      $.each(data.ActiveDrivers.DriverLocationStatus, function (index, element) { 
       content += "<tr><td>" + element.DriverNumber + "</td>"; 
       content += "<td>" + dateFormat(element.Timestamp, "d/m/yy") + " " + dateFormat(element.Timestamp, "h:MM TT") + "</td>"; 
       content += "<td>" + element.VRN + "</td>"; 
       content += "<td>" + element.CurrentLatitude + "</td>"; 
       content += "<td>" + element.CurrentLongitude + "</td>"; 
       content += "<td><a href=\"https://www.google.co.uk/maps/place//@" + element.CurrentLatitude + "," + element.CurrentLongitude + ",15z/\" target='_blank'>Track &raquo;</a></td></tr>"; 
      }); 
      content += "</tbody></table>"; 
      $("#result").html(content); 
     } 
    }); 

は、それがバイオリンを使用して動作しますが、前述したように、完全に同じドメイン上で動作し、。

コンテンツタイプ 'application/json'で失敗しているのはブラウザのプリフライトOPTIONSチェックですが、修正方法はわかりません。

web.configファイルに追加する必要があるものがありますか？

私は 'content-type'を削除しようとしましたが、影響はありません。

私はthis article問題を解決するだろう期待していた（それは有望に見えた）が、同じエラーが発生した：

XMLHttpRequest cannot load [URL]. Response for preflight has invalid HTTP status code 404 

Answer 1

私は最終的にこれが動作するようになりました。

この記事「WebAPI with CORS – IIS Intercepts OPTIONS Verb」は私の考えを伝えました。イメージは、IISでOPTIONSハンドラマッピングが表示された場所とその理由を示しました.Web.config内でIISがインターセプトされないようにするために、それを削除する必要がありました。

私がIISを見たところ、ハンドラはそこにいませんでした。私はリンクされた記事 'Can't set HttpHandler order using Web.Config unless a «clear» tag exists'を見て、この記事ではOPTIONハンドラを削除した後、明示的にweb.config内に追加されていることが分かりました。

IISでOPTIONハンドラが表示されないので、私もweb.configファイルに追加して、すべてが突然動いてしまいました。この追加は必要とされていたようだ。

最終的なweb.configハンドラのセクションは、次のようになります（これは、今後別のWebサーバーに移行した場合に問題が発生した場合に備えて、最初の「削除」を維持することにしました）。

<system.webServer> 
    <handlers> 
     <remove name="WebDAV"/> 
     <remove name="OPTIONSVerbHandler"/> 
     <remove name="ExtensionlessUrlHandler-ISAPI-4.0_32bit" /> 
     <remove name="ExtensionlessUrlHandler-ISAPI-4.0_64bit" /> 
     <remove name="ExtensionlessUrlHandler-Integrated-4.0" /> 
     <add name="ExtensionlessUrlHandler-ISAPI-4.0_32bit" path="*." verb="GET,HEAD,POST,DEBUG,PUT,DELETE,PATCH,OPTIONS" modules="IsapiModule" scriptProcessor="%windir%\Microsoft.NET\Framework\v4.0.30319\aspnet_isapi.dll" preCondition="classicMode,runtimeVersionv4.0,bitness32" responseBufferLimit="0" /> 
     <add name="ExtensionlessUrlHandler-ISAPI-4.0_64bit" path="*." verb="GET,HEAD,POST,DEBUG,PUT,DELETE,PATCH,OPTIONS" modules="IsapiModule" scriptProcessor="%windir%\Microsoft.NET\Framework64\v4.0.30319\aspnet_isapi.dll" preCondition="classicMode,runtimeVersionv4.0,bitness64" responseBufferLimit="0" /> 
     <add name="ExtensionlessUrlHandler-Integrated-4.0" path="*." verb="GET,HEAD,POST,DEBUG,PUT,DELETE,PATCH,OPTIONS" type="System.Web.Handlers.TransferRequestHandler" preCondition="integratedMode,runtimeVersionv4.0" /> 
     <add name="OPTIONSVerbHandler" path="*" verb="OPTIONS" modules="ProtocolSupportModule" requireAccess="None" responseBufferLimit="4194304" /> 
    </handlers> 
    <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, OPTIONS" /> 
     </customHeaders> 
    </httpProtocol> 
</system.webServer> 

Answer 2

上記の設定が変更された後、405エラーが発生しました。

最後に、それはGlobal.asaxのは

protected void Application_BeginRequest(Object sender, EventArgs e) 
    { 
     //HttpContext.Current.Response.AddHeader("Access-Control-Allow-Origin", "*"); 
     if (HttpContext.Current.Request.HttpMethod == "OPTIONS") 
     { 
      HttpContext.Current.Response.AddHeader("Cache-Control", "no-cache"); 
      HttpContext.Current.Response.AddHeader("Access-Control-Allow-Methods", "GET, POST"); 
      HttpContext.Current.Response.AddHeader("Access-Control-Allow-Headers", "Content-Type, Accept"); 
      HttpContext.Current.Response.AddHeader("Access-Control-Max-Age", "1728000"); 
      HttpContext.Current.Response.End(); 
     } 
    } 

Answer 3

ファイルのWeb APIのコードの下に追加した後、私はCORSが私のウェブサービス上で実行して取得しようとしたとして、404エラーや500エラーを見せていた同様のセットアップを持っている作品。私の修正では、基本的にHussainのソリューションを使用していましたが、私の修正を取り除くと、ただ1つの応答ラインしか必要ではなく、元のWebハンドラをweb.configに保つことができました。応答ハンドラをコードに変換します。

private void ApplicationOnBeginRequest(object sender, EventArgs eventArgs) 
     { 
... 
      if (context.Request.HttpMethod == "OPTIONS") 
       response.End(); 
     } 

と私のweb.configファイルでこれらのハンドラ：

基本的に、私の修正は私のApplicationOnBeginRequestハンドラでこのONE MAJOR FIXが含ま

<system.webServer> 
    <!--Other handlers/modules ...--> 
    <httpProtocol> 
     <customHeaders> 
      <clear /> 
      <add name="Access-Control-Allow-Origin" value="*" /> 
      <add name="Access-Control-Allow-Credentials" value="true" /> 
      <add name="Access-Control-Allow-Headers" value="Content-Type,Accept" /> 
      <add name="Access-Control-Allow-Methods" value="GET,POST,PUT,DELETE,OPTIONS" /> 
     </customHeaders> 
    </httpProtocol> 
    </system.webServer> 

は申し訳ありませんが、私はこれを送信できませんでしたフセインの答えに対するコメントとして注記する。

Answer 4

これは私のために働いた。

<httpProtocol> 
     <customHeaders> 

    <add name="Access-Control-Allow-Origin" value="*"/> 
    <add name="Access-Control-Allow-Methods" value="GET,PUT,POST,DELETE,OPTIONS"/> 
    <add name="Access-Control-Allow-Headers" value="Content-Type"/> 
     </customHeaders> 
    </httpProtocol> 

のWeb.configでGlobal.asaxの

protected void Application_BeginRequest(Object sender, EventArgs e) 
{ 
    //HttpContext.Current.Response.AddHeader("Access-Control-Allow-Origin", "*"); 
    if (HttpContext.Current.Request.HttpMethod == "OPTIONS") 
    { 
     HttpContext.Current.Response.AddHeader("Cache-Control", "no-cache"); 
     HttpContext.Current.Response.AddHeader("Access-Control-Allow-Methods", "GET, POST"); 
     HttpContext.Current.Response.AddHeader("Access-Control-Allow-Headers", "Content-Type, Accept"); 
     HttpContext.Current.Response.AddHeader("Access-Control-Max-Age", "1728000"); 
     HttpContext.Current.Response.End(); 
    } 
} 

で

再構築とちょっとプレスト。

Answer 5

aspコアの場合、このコードは設定手順のStartup.csでこのコードを使用してください。私は、バージョン2.0のために使用されるが、私はそれが古いで動作するはずだと思うあまりに

app.UseCors(builder => { 
       builder.AllowAnyOrigin().AllowAnyMethod().AllowAnyHeader(); 
      });