TypeScript中的Firebase云函数CORS问题

我知道有很多CORS帖子和解决方案，我已经看过很多次了。几个小时后我的CORS问题没有得到解决，我决定在这里发布：）

我的客户角度法 导入并初始化包

...import { AngularFireFunctions } from "@angular/fire/functions";
  constructor(...
    private afn: AngularFireFunctions,
  ) {}

我的firebase云函数（在TypeScript中），index.ts

export const helloWorld = functions.https.onRequest((request, response) => {
    response.set('Access-Control-Allow-Origin', '*');
    // let url = 'https://a1rvv0rk2.stackblitz.io/main/firecp'
    // response.set('Access-Control-Allow-Origin', url);
    response.set('Access-Control-Allow-Credentials', 'true');
    response.set('Access-Control-Allow-Headers', 'Content-Type')

    response.send("Hello from Firebase! " + new Date());
});

我使用了通配符，但我仍然得到CORS错误

在“项目”中获取的访问权限 …cloudfunctions.net/helloWorld“源”项目 ..…stackblitz.io'已被CORS策略阻止：请求标头 中的访问控制允许标头不允许字段授权 飞行前反应。zone.js:1118 后期项目 ..…cloudfunctions.net/helloWorld net:：ERR_失败

如果我能从大师那里得到一些帮助，我真的很感激

更新： 谢谢道格，我成功地导入了CORS！ 这里是我的更新代码，希望它对那些使用TypeScript而不是JavaScript的人有所帮助

导入CORS库

云函数

角度应用程序

---

尝试添加其他允许标头：

  response.set('Access-Control-Allow-Headers','Content-Type')

根据mozzilla文档，这应该是隐含的：

CORS安全列出的请求头、接受、接受语言、内容语言、内容类型始终是允许的，不必在此头中列出。但是，请注意，附加的限制适用于这些头，您可以通过在Access Control Allow headers头中列出这些头来绕过这些头

发件人：

---

仍然可能存在其他锁

请编辑问题，以显示云功能代码的完整最小代码，该代码无法按预期方式工作。您现在看到的是断章取义的几行内容。@DougStevenson，为难看的代码感到抱歉。我用最少的代码进行了更新，因为整个脚本太长，与此处显示无关。：）仅供参考，有一个cors模块可以为您处理所有这些，这要容易得多。我读了这篇文章，但我也在deanwilliammills的文章下面找到了答案，这肯定更容易。我认为它会工作，不是吗？嗨@DougStevenson，再次感谢你的指针，我设法在TypeScript中解决了CORS问题（上面更新的代码）。我可以知道是什么阻止了我的客户端应用程序从云函数输出结果，因为我已经使用了“等待”。另外，我注意到它必须返回'data'对象以避免错误'Response is missing data field'hi@matteo，我添加了您的代码（如更新的代码所示），但仍然得到相同的错误。：）

import * as corsModule from 'cors'
const cors = corsModule(({ origin: true }))

export const helloWorldWithCORS = functions.https.onRequest((request, response) => {
    // ref: https://github.com/firebase/firebase-js-sdk/issues/1338#issuecomment-461234192
    cors(request, response, () => {
        response.status(200).send({data: { success: true, message: 'yeah!' }})
    })
});

 async initCloudFunctions() {
    // let cmd = "helloWorld";
    let cmd = "helloWorldWithCORS";
    const callable = this.afn.httpsCallable(cmd);

    this.data = await callable({name: 'some data'})
    console.log(this.data)
  }

  response.set('Access-Control-Allow-Headers','Content-Type')