NodeJS / Firebase-Functions / Angular - CORS 策略已阻止从源访问站点：不存在“Access-Control-Allow-Origin”标头答案

【问题标题】：NodeJS / Firebase-Functions / Angular - Access to site from origin has been blocked by CORS policy: No 'Access-Control-Allow-Origin' header is presentNodeJS / Firebase-Functions / Angular - CORS 策略已阻止从源访问站点：不存在“Access-Control-Allow-Origin”标头
【发布时间】：2021-08-18 03:42:41
【问题描述】：

我分别在 Firebase Hosting 和 Firebase Functions 中托管我的 Angular 前端和 Node 后端。但是我在 POST 方法上不断收到 CORS 错误。我已经尝试了 Stackoverflow 和其他网站上几乎所有可用的解决方案。我在下面包含了我的错误响应和代码。

访问 XMLHttpRequest 在 'https://us-central1-#########.cloudfunctions.net/apps/auth/api/feed/update' 来自原点“https://#########.web.app”已被 CORS 阻止政策：没有“Access-Control-Allow-Origin”标头出现在请求的资源。

   const functions = require("firebase-functions");
    const path = require("path");
    const express = require("express");
    const bodyParser = require("body-parser");
    const mongoose = require("mongoose");
    const userRoutes = require("./route/user");
    const feedRoutes = require("./route/feed");
    const cors = require('cors');
    const app = express();
    
    // ESTABLISHING DATABASE CONNECTIONS
    
    mongoose
      .connect(
        "mongodb+srv://#####-###-####-####:" 
        + functions.config().env.mongo_atlas_pw +
        "@###-####-####.antdw.mongodb.net/"
        + functions.config().env.mongo_atlas_db + 
        "?retryWrites=true&w=majority"
        , { useNewUrlParser: true , useUnifiedTopology: true })
      .then(() => {
        console.log("Connected to database!");
      })
      .catch(() => {
        console.log("Connection failed!");
      });
    
    app.use(bodyParser.json());
    app.use(bodyParser.urlencoded({ extended: false }));
    app.use("/images", express.static(path.join(__dirname, "images")));
    app.use("/", express.static(path.join(__dirname, "angular")));
    
    // IF BACKEND AND FRONTEND ARE HOSTED SEPERATELY
    
    //  app.use((req, res, next) => {
    //    res.setHeader('Access-Control-Allow-Origin', '*');
    //    res.setHeader(
    //      "Access-Control-Allow-Headers",
    //      "Origin, X-Requested-With, Content-Type, Access-Control-Allow-Headers, Accept, Authorization"
    //    );
    //    res.setHeader(
    //      "Access-Control-Allow-Methods",
    //      "GET, POST, PATCH, PUT, DELETE, OPTIONS"
    //    );
    //    next();
    // });
    
    var corsOptions = {
      origin: '*',
      allowedHeaders: ['Content-Type', 'Authorization', 'Content-Length', 'X-Requested-With', 'Accept', 'Origin', 'Access-Control-Allow-Headers'],
      methods: ['GET', 'POST', 'DELETE', 'OPTIONS']
    }
    app.options('*',cors());
    app.use(cors(corsOptions));
    
    app.use("/auth/api/user", userRoutes);
    app.use("/auth/api/feed", feedRoutes);
    app.use((req, res, next) => {
      res.sendFile(path.join(__dirname, "angular", "index.html"));
    });
    
    exports.apps = functions.https.onRequest(app);

【问题讨论】：

标签： node.js angular firebase google-cloud-functions

【解决方案1】：

看起来我的 CORS 错误实际上并不是 CORS 错误。在我更改服务器上正文解析器包的参数限制后，我的代码已修复。我还需要在 Angular 前端对我的表单数据提交进行一些重写。

app.use(bodyParser.json({limit: "50mb"}));
app.use(bodyParser.urlencoded({limit: "50mb", extended: true, parameterLimit:50000}));

【讨论】：