CORS 策略阻止了从 *** 从源 *** 获取的访问权限：没有“访问控制允许源”

Question

我有错误

CORS 策略已阻止从源“http://localhost:3000”获取“http://localhost:5000/admin/authenticate”的访问权限：请求的资源上不存在“Access-Control-Allow-Origin”标头。如果不透明的响应满足您的需求，请将请求的模式设置为“no-cors”以获取禁用 CORS 的资源。

我的 ApiManager

function login(username, password) {
    const requestOptions = {
        method: 'POST',
        headers: {    
            'Accept': 'application/json',
            'Content-Type': 'application/json',
            'Access-Control-Allow-Origin': '*' },
        body: JSON.stringify({ username, password })};

    return fetch(`http://localhost:5000/admin/authenticate`, requestOptions)
        .then(handleResponse)
        .then(user => {
            // store user details and jwt token in local storage to keep user logged in between page refreshes
            localStorage.setItem('user', JSON.stringify(user));
            return user;
        }
    );
}

在后端 Asp.Net Core 2.2 (Startup.cs) 我写：

services.AddCors(options =>
{
    options.AddPolicy(
        _corsName,
        builder => { builder.AllowAnyOrigin().AllowAnyMethod().AllowAnyHeader().AllowCredentials(); });}
);

Answer 1

我尝试了 anerco 的答案，但它对我不起作用，我发现了这个 article，它有一个非常相似的解决方案，但添加了 .SetIsOriginAllowed(origin => true) 并删除了 .AllowAnyOrigin()。

所以你应该将此代码添加到启动类中的配置方法中：

app.UseCors(x => x
                    .AllowAnyMethod()
                    .AllowAnyHeader()
                    .SetIsOriginAllowed(origin => true) // allow any origin
                    .AllowCredentials()); // allow credentials

我建议阅读这篇文章以更好地理解所有这些内容，它非常简短且直截了当。

Answer 2

您好，我是这个主题的新手，但因为上周我遇到了这个错误，我尝试启用选项方法，第一部分已解决。 由于策略和安全问题而发生此错误，但现在我建议您获取状态代码，在我的情况下是 405 错误，这意味着现在我们必须更改请求中的标头以允许所有方法和来源（没办法） 但这对我没有帮助。

所以我发现我已经在我的应用程序中为我的 API 启用了 cookie 加密和会话（很重要），因此我禁用了它们并清除了浏览器 cookie。

所以尝试使用这些：

1. 清除您的 cookie 并通过 Mod Header 扩展添加 Access-Control-Allow-Origin': '*' 并再次尝试检查修复。 mod header - your header (client)

2. 尝试使用中间界面来控制你的请求并引导他们进入特殊规则

    app.use((req, res, next) => {
      res.header('Access-Control-Allow-Origin', '*');
      next();
    });

根据本站：https://medium.com/@dtkatz/3-ways-to-fix-the-cors-error-and-how-access-control-allow-origin-works-d97d55946d9

Answer 3

试试这个：

on Startup.cs => Confirgure add:
     app.UseCors(x => x.AllowAnyOrigin().AllowAnyMethod().AllowAnyHeader().AllowCredentials());

Answer 4

如果您的服务器是基于 express.js 的，请将这些行添加到服务器：

app.use(function (req, res, next) {
   res.header("Access-Control-Allow-Origin", "*");
   res.header("Access-Control-Allow-Headers", "Origin, X-Requested-With, Content-Type, Accept");
   next();
})

Answer 5

对于 NODE EXPRESS GRAPHQL RESTAPI 添加此标头中间件以避免 CORS 和任何 POST 或 OPTIONS 错误

app.use((req, res, next) => {
      res.setHeader("Access-Control-Allow-Origin", "*");
      res.setHeader(
        "Access-Control-Allow-Methods",
        "OPTIONS, GET, POST, PUT, PATCH, DELETE"
      );
      res.setHeader("Access-Control-Allow-Headers", "Content-Type, Authorization");
      if (req.method === "OPTIONS") {
        return res.sendStatus(200);
      }
      next();
    });

Answer 6

Chrome 中存在一个影响用户多年的错误，可以在here 找到它。

您可以使用 Chrome 扩展 Allow-Control-Allow-Origin：* 可在此处找到：https://chrome.google.com/webstore/detail/allow-control-allow-origi/nlfbmbojpeacfghkpbjhddihlkkiljbi

您也可以使用http://lacolhost.com/，它像本地主机一样指向 127.0.0.1。