部署后 HEROKU 的 CORS 问题

时间:2021-02-05 04:53:28

标签: node.js reactjs heroku cors

所以我的 node.js 服务器连接到我的 React 应用程序,它在本地运行良好。当我将服务器部署到 Heroku 并使用本地 React 应用程序中部署的应用程序的 URL 更改 localhost 时,我收到了这个可爱的 CORS 预检请求错误。我最初认为这是我的环境变量的问题,但似乎并非如此。这里是节点服务器。

    const express = require("express");
const bodyParser = require("body-parser");
const cors = require('cors');
require("dotenv").config();
const app = express();
const port = process.env.PORT || 8000;

app.use(express.static(__dirname + 'public'));

app.use(cors())
app.use(bodyParser.json());
app.use(bodyParser.urlencoded({ extended: false }));

var nodemailer = require("nodemailer");

var transporter = nodemailer.createTransport({
  service: "gmail",
  auth: {
    user: process.env.GM_USER,
    pass: process.env.GM_PASS,
  },
});

app.post("/send", (req, res) => {
  var mailOptions = {
    from: req.body.email,
    to: "test@gmail.com",
    subject: `Hello this is ${req.body.name}`,
    text: `${req.body.message}, 
    From, ${req.body.name}`,
  };

  transporter.sendMail(mailOptions, function (error, info) {
    if (error) {
      console.log(error);
    } else {
      console.log("Email sent: " + info.response)
      .then(res => res.status(200).send(res));
    }
  });
});

// require("./routes/apiRoutes")(app)

app.listen(port, () => {
  console.log(`Server is listening to port ${port}`);
});

我已经看过了,似乎人们也遇到了类似的问题,但我似乎找不到解决方案。如果有人可以提供帮助,那就太棒了。谢谢。

2 个答案:

答案 0 :(得分:0)

您已经处理了 CORS,我遇到了同样的问题,我认为您应该测试您的服务器日志。就我而言,我遇到了其他一些包问题,它给出了 500 错误,并且没有 'Access-Control-Allow-Origin' 标头,CORS 错误。当我解决这个问题时,CORS 也解决了。

或者您可以尝试拦截每个请求并为每个响应设置它。

app.use(function(req, res, next) {
res.header("Access-Control-Allow-Origin", '*');
res.header("Access-Control-Allow-Credentials", true);
res.header('Access-Control-Allow-Methods', 'GET,PUT,POST,DELETE,OPTIONS');
res.header("Access-Control-Allow-Headers", 'Origin,X-Requested-With,Content-Type,Accept,content-type,application/json');
next();
});

答案 1 :(得分:0)

你可以这样使用。

var allowCrossDomain = function(req, res, next) {
    res.header('Access-Control-Allow-Origin', '*');
    res.header('Access-Control-Allow-Methods', 'GET,PUT,POST,DELETE,OPTIONS');
    res.header('Access-Control-Allow-Headers', 'Content-Type, Authorization, Content-Length, X-Requested-With');

    // intercept OPTIONS method
    if ('OPTIONS' == req.method) {
      res.send(200);
    }
    else {
      next();
    }
};

...
app.use(allowCrossDomain);
...