Firebase 可调用函数 + CORS

IT技术 javascript firebase google-cloud-functions
2021-03-01 00:05:22

我正在尝试从我的应用程序调用可调用的云函数，但我面临 CORS 问题。 在此处输入图片说明

我无法启用 Cors，因为我无权访问 onCall 函数上的请求和响应。这是我的功能：

exports.UserInvitation = functions.https.onCall((data, context) => {
  const email = data.email


  return new Promise((resolve, reject) => {
    admin.auth().createUser({
      email: email,
      emailVerified: false,
      password: password
    }).then(resolve).catch((err) => {
      console.error(err.code)
      reject(new functions.https.HttpsError(err.code, err.message))
    })
  })
})

这就是我所说的：

functions.httpsCallable('UserInvitation')({ email: this.input.value }).then((data) => {
      console.log('Sent invitation:', data)
})

Firebase 函数 package.json：

{
  "name": "functions",
  "description": "Cloud Functions for Firebase",
  "scripts": {
    "serve": "firebase serve --only functions",
    "shell": "firebase functions:shell",
    "start": "npm run shell",
    "deploy": "firebase deploy --only functions",
    "logs": "firebase functions:log"
  },
  "dependencies": {
    "bluebird": "^3.5.1",
    "firebase-admin": "~5.12.0",
    "firebase-functions": "^1.0.1"
  },
  "private": true
}

WEB SDK Firebase 版本：4.13.1

6个回答

对于来到这里搜索 firebase 可调用函数 cors 错误的其他人，这是我的清单：

  1. 确保已部署该功能。
  2. 确保函数名称正确。我recalculatY在应该打电话的时候打电话recalculateY。由于某种原因出现 cors 错误。
  3. 确保函数代码本身没有抛出错误。使用模拟器来帮助。这并没有引发 cors 错误仍然有助于了解。
  4. 确保您的区域匹配 - 我正在使用europe-west2. 我必须在该区域中部署该功能，并使用该区域调用它。有一段时间，我认为如果函数名称正确，客户端会推断出正确的区域。情况并非如此。

将可调用函数部署到特定区域： 

// This is the file in which you define your callable function.
const functions = require('firebase-functions');
...
exports.yourFunc = functions.region('europe-west2').https.onCall(async (data, context) => {
    ...
})

从客户端调用特定区域中的函数（在本例中为 vuejs Web 应用程序）：

// In my case, this is a vuex store file, but it is safe to assume this is plain old javascript
import firebase from 'firebase/app'
import 'firebase/functions'
...
firebase.app().functions('europe-west2').httpsCallable('yourFunc')

注意：firebase.app().function...vsfirebase.app.function...

2021-04-20 00:05:22
谢谢你。对我来说是#1。我以为我已经部署了它。
2021-04-21 00:05:22
拯救了我的一天。我要编辑一大堆代码。
2021-04-23 00:05:22
这对我来说成功了！通话中没有区域。
2021-04-29 00:05:22
基本清单...你用“确保函数名称正确”救了我
2021-05-05 00:05:22

对于任何在 2020 年 1 月看这篇文章的人..

在 Reddit 上找到了这个答案（https://www.reddit.com/r/reactjs/comments/fsw405/firebase_cloud_functions_cors_policy_error/）

结果是在 2020 年 1 月 15 日，Google 更改了安全设置，所有新功能都不再具有 Cloud Functions Invoker。这意味着所有新创建的函数都将被禁止访问，从而导致 CORS 策略阻止。

这是您修复它的方法，因为它并不那么明显：

https://cloud.google.com/functions/docs/securing/managing-access-iam#allowing_unauthenticated_function_invocation

这真令人气愤——对于这么大的公司来说，关于这个话题的文档到处都是。当它发生时，怎么不是到处都是？谢谢你。
2021-04-19 00:05:22
好主。发现一个多么混乱的错误。谢谢！
2021-04-22 00:05:22
但这将允许所有用户调用此函数我的意思是我已经完成了 CORS 错误消失但现在我可以从邮递员触发该函数而无需任何标题！这是唯一的方法@Kitson
2021-05-06 00:05:22
我正在使用.https.onCall(async (data, context) => { ... })并且上下文可以访问 teh auth user context.auth。然后我使用它来检查权限并为未经身份验证的用户抛出错误。
2021-05-08 00:05:22
谢谢，这对我有用。有趣的花絮是我同时部署了 3 个函数，只有 1 个有这个问题。
2021-05-11 00:05:22

我的某些 Firebase 功能遇到了这个问题，但其他功能没有。我最终通过这样做来修复它：

  1. 在 index.js 中注释掉函数
  2. 运行 Firebase 部署
  3. 在提示符下输入 y 以删除函数
  4. 等待 5 到 10 分钟
  5. 删除函数周围的注释并再次运行 firebase deploy

没有对函数本身进行任何更改，它现在可以在没有任何 CORS 问题的情况下运行。

我尝试了这个线程中的每一件事。但这个对我来说是解决方案。只需删除所有云功能一次。然后重新部署，它又可以工作了！
2021-04-19 00:05:22
我尝试了各种解决方案，是的，解决方案对我来说是一样的，只需删除所有功能并重新部署它们。实际情况是什么.. 我一直在处理这个错误几个小时，想知道是什么以及如何解决这个问题，然后它只是“删除并重试”......感觉太愚蠢了。
2021-04-26 00:05:22
我尝试了所有其他可能的解决方案......没有冒犯，但我认为这永远不会奏效，因为我什至从未尝试过，但是伙计......我可以说这就是问题所在。谢谢 ！
2021-05-01 00:05:22
令人难以置信的是，在花了几个小时在这里尝试所有不同的解决方案之后，我删除了每个功能并再次重新部署它们，突然间，它们开始工作而没有任何 CORS 问题。在那段时间里，我仍然不确定我是否还必须为https.onCall(..)用户经过身份验证的功能执行 @Nikita 的解决方案（因为没有任何东西可以使它们工作）。答案是否定的 - 完全删除并重新部署解决了该问题。
2021-05-08 00:05:22
我做了一些非常相似的事情：使用不同的名称部署完全相同的功能：巨大的成功。翻了个桌子，继续往前走。
2021-05-08 00:05:22

我的问题不在于 CORS，而在于我的错误处理程序。我没有拒绝Promise，而是throw直接在 catch 处理程序中使用。

catch((err) => {
  throw new functions.https.HttpsError('unknown', err.message, err)
})
这对我来说似乎非常奇怪。拒绝你在云函数中返回的Promise，对我来说感觉就像扔东西完全一样......
2021-04-27 00:05:22

可能很多人会在模拟器和 cors 消息中遇到这个问题。

我在谷歌看到的任何讨论中都没有看到我的案例讨论过，我确实看到过很多“无法复制”，也许我的案例会遮住一些光：

就我而言，问题是我没有从 Firebase 模拟器运行托管。

当您通过 npm start 运行您的 React 应用程序时 - 当函数通过 firebase emulators:start 运行时，您将看到 Cors 错误。

所以在测试云函数调用时，而不是使用 npm start，你应该做 npm run build 然后从模拟器访问应用程序......

搜索类似：“托管：本地服务器：http://localhost:5000 ”

一些注意事项 -

  • 您的功能还应该通过以下方式针对模拟器工作

    const functions = firebaseApp.functions('europe-west3');// lets assume thats your region functions.useFunctionsEmulator('http://localhost:5000');

其它你可能感兴趣的问题
上一篇对相对路径使用 require 下一篇scrollIntoView 与 moveToElement