google cloud function python CORS error 请求的资源上不存在“Access-Control-Allow-Origin”标头。

Posted 2023-02-27

【中文标题】google cloud function python CORS error 请求的资源上不存在“Access-Control-Allow-Origin”标头。

【英文标题】：google cloud function python CORS error No 'Access-Control-Allow-Origin' header is present on the requested resource.

【发布时间】：2019-04-01 18:52:09

【问题描述】：

我已按照https://cloud.google.com/functions/docs/writing/http#functions_http_cors-python 的说明进行操作

所以我的代码最后有这个

 # Set CORS headers for the preflight request
        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',
                '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',
        

        # END CORS

        return (res, 200, headers)

其中 res 是 JSON

从一个简单的节点应用程序，我通过调用

this.http.post(payloadTarget.url, JSON.stringify(clone)).subscribe(res => 
    console.log('request complete', res);
  ,
  err => 
    console.log('request failed', err);
  );

我在控制台上收到此错误

请求的资源上不存在“Access-Control-Allow-Origin”标头。 Origin 'http://localhost:4200' 因此不允许访问。

当使用 Postman 测试 POST 或 OPTIONS 时，我没有看到错误，但我也没有看到我应该看到的 HEADERS

我确定它很简单，但查看其他类似的问题和答案无法找到任何指向我的问题的东西

【问题讨论】：

我刚刚尝试复制它并且它对我有用，你确定你已经部署了你的函数的最新版本吗？当您使用curl 发送OPTIONS 请求时，您会得到什么？ curl -i -X OPTIONS <your function URL>

嗨@Dustin，我使用gcloud functions deploy functionName --runtime python37 --trigger-http 进行部署，curl 返回HTTP/2 200 content-type: text/html; charset=utf-8 function-execution-id: ms2z3dcwv1tz x-cloud-trace-context: d4b120a314d0d4a2bb8b7f57d0f5baa7;o=1 date: Thu, 01 Nov 2018 07:47:38 GMT server: Google Frontend content-length: 2 alt-svc: quic=":443"; ma=2592000; v="44,43,39,35"

我也遇到了同样的问题。尝试使用curl -i -X OPTIONS <your function URL>，我得到access-control-allow-headers: Content-Type access-control-allow-methods: POST, OPTIONS access-control-allow-origin: * access-control-max-age: 3600 content-type: text/html; charset=utf-8 只是不适用于Chrome。

【参考方案1】：

我认为这里的问题是您在 OPTIONS 回复中遗漏了 POST。使用 CORS，您需要具体说明哪些 http 方法是可接受的。话虽如此，您需要将您的飞行前请求更新为：

    # Set CORS headers for the preflight request
    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',
    

    # END CORS

    return (res, 200, headers)

或者，您可以将值设置为：

'Access-Control-Allow-Methods': '*'

如果您不太关心安全性。

另外，您没有通过 POSTMAN 收到这些错误的原因是由于请求的性质 - 所有现代浏览器都会拦截您的请求并检查来源是否匹配（域、端口、协议等），如果他们没有，向目的地发出飞行前 (OPTIONS) 请求，以确保一切正常。像 POSTMAN 这样的网站和像 Fiddler 这样的软件不是从浏览器启动的，而是在没有任何检查的情况下提交的。

【讨论】：

还是不行，加了 'Access-Control-Allow-Methods': '*' for both

【参考方案2】：

您可以创建一个将 CORS 添加到每个响应的函数。使用 jsonify 将 dict 转换为 JSON。

from flask import jsonify

def addCors(response, code=200):
    headers = 'Access-Control-Allow-Origin': '*'
    return (response, code, headers)

def func_with_cors(request):
    response = jsonify("key1":"value1","key2":"value2")
    return addCors(response)

然后部署 func_with_cors

gcloud 函数部署 func_with_cors --runtime python37 --trigger-http

【参考方案3】：

当我为函数添加注释时会发生这种情况。我添加了 this 注释，因为 Cloud Functions 没有显示 Python 的详细错误日志。当我删除注释时，我的函数返回预期的标题。