我正尝试在开发模式下从react应用中获取一个无服务器函数，代码如下。
let response = await fetch(url,
{
method: 'POST',
mode: 'cors',
body: "param=" + paramVar,
})
.then(response => response.json());后端函数是Python Cloud函数，代码如下：
def main(request):
# CORS handling
if request.method == 'OPTIONS':
# Allows GET requests from any origin with the Content-Type
# header and caches preflight response for an 3600s
headers = {
'Access-Control-Allow-Origin': '*',
'Access-Control-Allow-Methods': 'GET, POST',
'Access-Control-Allow-Headers': 'Content-Type',
'Access-Control-Max-Age': '3600'
}
return ('', 204, headers)
# Set CORS headers for the main request
headers = {
'Content-Type':'application/json',
'Access-Control-Allow-Origin': '*',
'Access-Control-Allow-Headers': 'Content-Type',
}
# Process request
return (json.dumps(response), 200, headers)但我不断收到以下错误：
Access to fetch at 'url' from origin 'http://localhost:3000' has been blocked by CORS policy: No 'Access-Control-Allow-Origin' header is present on the requested resource. If an opaque response serves your needs, set the request's mode to 'no-cors' to fetch the resource with CORS disabled.当我尝试使用curl执行相同的请求时，我得到了正确的响应。使用curl获得选项给我以下结果：
HTTP/2 204
access-control-allow-headers: Content-Type
access-control-allow-methods: GET, POST
access-control-allow-origin: *
access-control-max-age: 3600
content-type: text/html; charset=utf-8
date: Sun, 16 Aug 2020 01:29:41 GMT任何人都可以帮助我理解为什么我不能在我的前端得到一个响应？'访问控制允许起源'是在标题中出现，所以我真的不明白这个错误的原因是什么。
4条答案
按热度按时间lyr7nygr1#
在后端安装CORS包，然后打开server.js文件或其他文件，然后将其导入到该文件
然后用它
重新加载浏览器，应该这样做!
kx5bkwkv2#
这是我的第一篇文章在堆栈
我看到OP的React，我想我知道他们的意思-因为我自己也遇到了同样的问题。
基本上，当你发送一个请求到'url'，如果那个URL没有回复一个成功的响应，那么它会给你一个'坏响应'，在我的例子中，一个“503”。一个“503”响应仍然是一个响应，但这个响应不会包含访问控制允许起源头，所以浏览器（尽职尽责地）回答说，它不会接受这个-即使它是垃圾反正！
希望对其他人有帮助...干杯
zysjyyx43#
添加内容类型头到你的fetch方法在前端，然后再试一次：
8wtpewkr4#
实际上，后端有一个bug，它只由浏览器添加的一些额外的头文件触发。在这种特殊情况下，服务器返回了一个404错误，该错误不包含我的头文件定义，并将导致CORS策略阻塞。
在我使用devtools跟踪浏览器发送的请求并复制curl请求中的所有头文件后，我才发现了这个bug。在修复了函数逻辑后，问题得到了修复。