vue.js CORS -对预检请求的响应未通过访问控制检查：它不具有HTTP ok状态

wlzqhblo 于 2022-12-27 发布在 Vue.js

关注(0)|答案(3)|浏览(301)

我该怎么做才能让它运行起来？
后端：ASP.Net Web应用程序-API、IIS
前端：Vue
错误：

小提琴手：

web.config:

<httpProtocol>
  <customHeaders>
    <add name="Access-Control-Allow-Origin" value="*" />
    <add name="Access-Control-Allow-Headers" value="x-requested-with, Content-Type, origin, authorization, accept, client-security-token" />
    <add name="Access-Control-Allow-Methods" value="GET, POST, PUT, DELETE, OPTIONS" />
    <add name="Access-Control-Max-Age " value="1000" />
  </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>

迄今为止的结论：

如果我跳过在post请求中发送数据，错误就会消失。
我认为这是因为我不再会打破SOP政策时，张贴数据不存在。
只有在使用某些不安全的标头/方法/内容类型时，才会执行印前检查请求。

请只回答如果你了解这件事（我很抱歉，但在类似的问题看的答复是"试试这个"和"试试那个"，这使得它很难确定根本原因和提高一般的理解）。感谢考虑这个。

vue.js

来源：https://stackoverflow.com/questions/60353486/cors-response-to-preflight-request-doesnt-pass-access-control-check-it-does

3条答案

按热度按时间

7z5jn7bk1#

我在这里找到了一个解决方案The requested resource does not support http method 'OPTIONS'.?
我发现它后，使用fiddler获得更好的错误细节。
按照建议删除这两行将使其在开发环境中工作。但是，当部署到生产环境时，必须再次添加最后一行才能使其工作。
当你想在程序中进行更详细的CORS设置时，是否需要第一个处理程序。请随意改进这个答案。

<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>

在为生产构建真实的的解决方案时，允许所有事情并不是最佳的。

赞(0）回复(0）举报 2022-12-27

33qvvth12#

公认的解决方案对我不起作用。所以这可能会帮助一些人
在Global.asax上向Application_BeginRequest添加以下代码对我很有效：

HttpContext.Current.Response.AddHeader("Access-Control-Allow-Origin", "http://localhost:7777/");

if (HttpContext.Current.Request.HttpMethod == "OPTIONS")
{
    //These headers are handling the "pre-flight" OPTIONS call sent by the browser
    HttpContext.Current.Response.AddHeader("Access-Control-Allow-Methods", "POST, GET");
    HttpContext.Current.Response.AddHeader("Access-Control-Allow-Headers", "content-type");
    HttpContext.Current.Response.End();
}

使用所需的 * url 、方法 * 和 * 标头 *
此外，没有必要更改Web.config中的任何内容

赞(0）回复(0）举报 2022-12-27

but5z9lq3#

如果您使用的是Mozilla，您应该考虑在https://addons.mozilla.org/en-US/firefox/addon/cors-everywhere/上查看“CORS Everywhere”扩展，它可能会解决您的问题。
编辑：好吧，不要这样做，对不起我的无知。

赞(0）回复(0）举报 2022-12-27