Question

我目前的用例很简单，我只需要对我在本地开发的云功能发出帖子请求。

当我开火时，抓住了

firebase serve

托管部署在 localhost：5000

上

和云功能部署在 localhost：5001

上

这两者来自不同的起源，因为端口不同。因此，当浏览器发送初始预检请求时，它会失败并显示错误消息

Failed to load http://localhost:5001/projectname/region/sendEnquiry: Response to preflight request doesn't pass access control check: No 'Access-Control-Allow-Origin' header is present on the requested resource. Origin 'http://localhost:5000' is therefore not allowed access.

如何在本地设置标题以进行测试？（同样在这里我不是专业人士，我猜我在决定部署生产时会有相同的起源。如果没有，反正我仍然需要解决方案）

感谢。

Answer 1

请注意，服务器和云功能是不同的服务，并且始终位于不同的端口。

CORS实际上是由跨域问题引发的。如果它全部是本地的，则不应该是跨域违规。

您没有向客户提供任何信息，因此我们无法为您提供客户特定的解决方法。但有几个Chrome扩展程序允许您禁用此类本地测试的CORS检查。搜索Chrome商店并找到符合您需求的商店。 https://chrome.google.com/webstore/search/cors?hl=en

Answer 2

使用可调用函数，您需要从应用程序中调用它们，因此，我假设您正在谈论的是从angular的http客户端向localhost函数发出http请求。

firebase中的http函数是基于express的，为了启用cors，您需要使用以下命令安装cors：

npm install --save cors

，然后在您的函数中：

app.use(cors({origin: true}));

现在，如果您到目前为止已完成此操作，则在本地使用Firebase函数时，我注意到还有另一件事是必要的，请将您的url中的localhost更改为127.0.0.1，这样就不必调用：

http://localhost:5001/projectname/region/sendEnquiry

致电

http://127.0.0.1:5001/projectname/region/sendEnquiry

让我知道这是否可行。

Answer 3

Google限制某些通话，但您可以为Firebase项目配置CORS。很难通过非常混乱的文档来找到方法，花了我一段时间才找到正确的方法。

请按照以下步骤操作：

转到console.cloud.google.com
在左上方，选择您的Firebase项目
单击左上角的终端图标（看起来像>_）
在打开的终端中，单击三个点图标，然后选择“上传文件”
上传具有以下内容的名为cors.json的文件：

[
 {
   "origin": ["*"],
   "method": ["GET"],
   "maxAgeSeconds": 3600
 }
]

在终端中，运行以下命令： gsutil cors set cors.json gs://yourbucketname.appspot.com（更改网址）

这允许来自其他来源的任何GET请求。

Answer 4

使用 Firebase Cloud Functions 模拟器进行本地开发时，CORS 会自动处理，因此您无需编写任何代码来处理它。但是，其他问题通常会在浏览器中显示为 CORS 错误，因为 CORS 所需的飞行前 OPTIONS 请求由于某种原因失败。这有多种可能的原因，包括：

该函数不存在（检查名称是否匹配）
该函数抛出一些未正确处理的错误

更多讨论和可能的原因see this thread。

由于CORS限制，无法使用firebase在本地进行测试

4 个答案: