Node.js Axios-CORS政策问题

Node.js Axios-CORS政策问题,node.js,vue.js,axios,cors,Node.js,Vue.js,Axios,Cors,我试图提出一个简单的axios请求,如下所示(我正在使用Vue.js): 但我得到了以下错误: Access to XMLHttpRequest at 'url' from origin 'http://localhost:8080' has been blocked by CORS policy: Response to preflight request doesn't pass access control check: No 'Access-Control-Allow-Origin' h

我试图提出一个简单的axios请求,如下所示(我正在使用Vue.js):

但我得到了以下错误:

Access to XMLHttpRequest at 'url' from origin 'http://localhost:8080' has been blocked by CORS policy: Response to preflight request doesn't pass access control check: No 'Access-Control-Allow-Origin' header is present on the requested resource.

Error: Network Error
    at createError (createError.js?2d83:16)
    at XMLHttpRequest.handleError (xhr.js?b50d:84)
我已经尝试添加以下标题,但仍然不起作用

headers: {
   "Access-Control-Allow-Origin": "*"
   "mode":"no-cors"
}
但是,如果我尝试通过浏览器发出请求(只需复制和粘贴url),一切都很好


有人知道如何帮助我吗?非常感谢

只是总结一下问题的评论

CORS代表跨来源的资源共享,它检查的是给定的客户机或来源是否有权“查看”另一来源的资源。想想看,你不想让任何人公开访问你所有的API,对吗?使用CORS,您可以指定谁可以访问什么

在您的情况下,这不是在执行axios调用的vue客户端可以修复的问题,您可以通过将请求URL更改为启用CORS的内容来检查这一点,例如:

axios
 .get('https://jsonplaceholder.typicode.com/todos/1'),
 .then(({ data }) => {
    // ...
 })
 .catch(err => console.log(err))
要解决此问题,后端需要在服务器级别或针对您尝试访问的特定url启用CORS。这将取决于实际的后端实现,但大多数语言对此有一个直接的解决方案


这是否适用于浏览器,但不适用于axios请求;这是因为CORS检查的是来自不同来源的请求,与公开URL的请求不同,比如您的客户端。浏览器只是从它自己的源而不是交叉源渲染该资源。阅读这篇文章非常简洁,解释得很好:


总结一下:如果您没有在服务器端启用CORS的API,但仍然希望使用该API,那么您必须为应用程序编写API包装

这可能是node.js express api,它只接收您的请求,然后将请求(使用axios)转发到api。区别在于,在node.js上下文中,您没有CORS的浏览器限制


例如netlify就有这样的蓝图。你也可以在google上找到很多例子。

CORS警告来自服务器而不是客户端,在这种情况下,你的axios调用,你能给我们一些关于你正在使用的后端的更多信息吗,你定义的url应该为你的工作请求启用CORS我的url如下所示:。API站点是这样的:将我们的代码更改为使用此url:,这是一个占位符响应,我相信它应该可以工作,正如之前指出的,CORS问题需要在服务器上而不是客户端上解决,如果您可以控制后端公开启用CORS所需的url,那么node.js?占位符响应可以正常工作。我无法控制后端。但是,如果我尝试通过浏览器发出请求(简单地复制和粘贴url),为什么一切都正常?这是因为CORS检查的是来自不同来源的请求,而不是暴露url的请求,如您的客户端,如果是这种情况,它会检查其他来源是否有权获取资源。浏览器只是从它自己的源而不是交叉源渲染该资源。读这篇文章非常简洁,解释得很好:首先,非常感谢你为我奉献的时间。我尝试使用node.js(始终使用axios)而不是Vue.js(我只是创建了一个javascript文件并用node编译了它)发出请求,一切都很好。怎么可能呢?这可能是一个Vue问题吗?这很有意义,就像创建一个反向代理,在这里您可以绕过浏览器检查和交叉源,并根据您自己的条件公开资源,这个答案对此有一点解释:。@FilippoAmenta如果您看@Jan的答案,他们提到了
,区别在于,在node.js上下文中,您没有CORS的浏览器限制。只有浏览器必须遵循CORS,因为使用Node.js基本上就是创建API,所以CORS问题在这里是无效的。
axios
 .get('https://jsonplaceholder.typicode.com/todos/1'),
 .then(({ data }) => {
    // ...
 })
 .catch(err => console.log(err))