在 Firebase Cloud 功能中启用 Cors [英] Enable Cors in Firebase Cloud Function
问题描述
我已经编写了一些云函数并部署了它们,现在我正在尝试使用我的 Angular 应用程序访问这些 API,但我收到了这个错误
I have written some cloud functions and deployed them now i am trying to hit those APIs using my Angular application but i am getting this error
CORS 策略已阻止从源http://localhost:4200"访问xxxxxxxxxxxxxxxxxxxxxxxx"处的 XMLHttpRequest:对预检请求的响应未通过访问控制检查:请求的资源上不存在Access-Control-Allow-Origin"标头.
Access to XMLHttpRequest at 'xxxxxxxxxxxxxxxxxxxxxxxx' from origin 'http://localhost:4200' has been blocked by CORS policy: Response to preflight request doesn't pass access control check: No 'Access-Control-Allow-Origin' header is present on the requested resource.
我知道我必须在我的云功能中启用 cors,但我以前从未这样做过,所以如果你们能告诉我该怎么做,那就太好了?我确实检查了 this 线程,但我对我在哪里有点困惑需要初始化cors,我是否也需要安装它的依赖项,我需要在我的云功能中在哪里启用它?这是我的云功能
I know i have to enable cors in my cloud function but i have never done that before so would be awesome if you guys could tell me how to do that? I did checked this thread but i am a little bit confused as to where i need to initialize the cors and do i need to install its dependency too and where do i need to enable it in my cloud function? Here is my cloud function
const functions = require('firebase-functions');
const admin = require("firebase-admin");
const bodyParser = require("body-parser");
admin.initializeApp();
const db = admin.firestore();
const usersCollection = db.collection("users");
exports.addUser = functions.https.onRequest((req, res) => {
if (req.body.username != null && req.body.firstname != null && req.body.lastname != null && req.body.addr1 != null && req.body.addr2 != null || req.body.username != undefined && req.body.firstname != undefined && req.body.lastname != undefined && req.body.addr1 != undefined && req.body.addr2 != undefined ) {
let docId = Math.floor(Math.random() * (99999 - 00000));
let newUser = {
"username": req.body.name,
"firstname": req.body.firstname,
"lastname": req.body.lastname,
"addr1": req.body.addr1,
"addr2": req.body.addr2,
}
usersCollection.add(newUser).then(snapshot => {
res.send(200, {
"message": "User was successfully created"
})
});
} else {
res.send(400, {
"message": "All fields are required"
})
}
});
推荐答案
有两种方法可以解决这个问题
There are two ways to solve this
- 使用外部库处理
OPTIONS
调用
- 手动处理
OPTIONS
调用
从headers
获取请求方法
检查方法是否为OPTIONS
使用 200
状态码解析 API.
Resolve the API with 200
status code.
exports.addUser = functions.https.onRequest((req, res) => {
res.set('Access-Control-Allow-Origin', '*');
res.set('Access-Control-Allow-Methods', 'GET, PUT, POST, OPTIONS');
res.set('Access-Control-Allow-Headers', '*');
if (req.method === 'OPTIONS') {
res.end();
}
else{
if (req.body.username != null && req.body.firstname != null && req.body.lastname != null && req.body.addr1 != null && req.body.addr2 != null || req.body.username != undefined && req.body.firstname != undefined && req.body.lastname != undefined && req.body.addr1 != undefined && req.body.addr2 != undefined ) {
let docId = Math.floor(Math.random() * (99999 - 00000));
let newUser = {
"username": req.body.name,
"firstname": req.body.firstname,
"lastname": req.body.lastname,
"addr1": req.body.addr1,
"addr2": req.body.addr2,
}
usersCollection.add(newUser).then(snapshot => {
res.send(200, {
"message": "User was successfully created"
})
});
} else {
res.send(400, {
"message": "All fields are required"
})
}
}
});
这篇关于在 Firebase Cloud 功能中启用 Cors的文章就介绍到这了,希望我们推荐的答案对大家有所帮助,也希望大家多多支持IT屋!