Javascript 如何解决React应用程序和Heroku后端之间的CORS（访问控制允许来源）错误

可以找到相关的回购协议。我有一个CORS问题。当我尝试进行API调用时，出现以下错误：

Access to XMLHttpRequest at 'https://farmstocommunities.herokuapp.com/api/stripe/customer' from origin 'https://farmstocommunities.org' has been blocked by CORS policy: No 'Access-Control-Allow-Origin' header is present on the requested resource.

问题是，当我在本地进行API调用（即localhost:5000）时，我没有收到这个错误。仅当我尝试调用Heroku部署的后端时。 这就是我的server.js文件的样子。如您所见，我甚至尝试在传入条带路由器之前直接调用cors中间件，但没有成功

const express = require("express");
const cors = require("cors");
const authRouter = require("../auth/auth-router");
const productRouter = require("../products/product-router");
const customerRouter = require("../customers/customer-router");
const orderRouter = require("../orders/order-router");
const paymentRouter = require("../payment/payment-router");
const stripeRouter = require("../stripe/stripe-router");
const accountRouter = require("../accounts/account-router");
const subscriptionRouter = require("../subscriptions/subscription-router");
const server = express();
server.use(cors());
server.use(express.json());
server.get("/", (req, res) => {
  res.status(200).json({ api: "up" });
});
server.use("/api/auth", authRouter);
server.use("/api/products", productRouter);
server.use("/api/customers", customerRouter);
server.use("/api/orders", orderRouter);
server.use("/api/pay", paymentRouter);
server.use("/api/stripe", cors(), stripeRouter);
server.use("/api/accounts", accountRouter);
server.use("/api/subscriptions", subscriptionRouter);
module.exports = server;

我猜问题出在

server.js

文件中，但这里是

stripe router.js

的代码，以防我需要在那里做些什么：

const express = require("express");
const router = express.Router();
require("dotenv").config();
const stripe = require("stripe")(process.env.STRIPE_SECRET_KEY_LIVE);
router.post("/customer", async (req, res) => {
  let { name, email, stripeId, paymentMethodId, shipping } = req.body;
  let customerInfo = {
    id: stripeId,
    name,
    email,
    shipping,
    payment_method: paymentMethodId,
    invoice_settings: {
      default_payment_method: paymentMethodId,
    },
  };
  stripe.customers.create(customerInfo, (err, customer) => {
    if (!err) {
      res.status(201).json(customer);
      console.log("new Stripe customer", customer);
    } else {
      console.log("Error", err);
      res.status(500).json({ err });
    }
  });
});
router.post("/subscription", (req, res) => {
  let { stripeCustomerId, stripePriceId } = req.body;
  stripe.subscriptions.create(
    {
      customer: stripeCustomerId,
      items: [{ price: stripePriceId }],
      expand: ["latest_invoice.payment_intent"],
    },
    (err, subscription) => {
      if (!err) {
        res.status(201).json(subscription);
      } else {
        console.log(err);
        res.status(500).json({ err });
      }
    }
  );
});
router.post("/donate", async (req, res) => {
  let { amount, id } = req.body;
  try {
    const payment = await stripe.paymentIntents.create({
      amount,
      currency: "USD",
      description: "Donation",
      payment_method: id,
      confirm: true,
    });
    console.log("Payment", payment);
    res.json({ message: "Payment successful!", success: true });
  } catch (error) {
    console.log("Error", error);
    res.json({ message: "Payment failed!", success: false });
  }
});
router.get("/subscription/:subscriptionId", (req, res) => {
  let { subscriptionId } = req.params;
  stripe.subscriptions.retrieve(subscriptionId, (err, subscription) => {
    if (!err) {
      res.status(200).json(subscription);
    } else {
      console.log(err);
      res.status(500).json({ err });
    }
  });
});
module.exports = router;

---

您是否仅在有问题的端点上启用了

cors

？