部署后 HEROKU 出现 CORS 问题

Posted 2023-03-04

【中文标题】部署后 HEROKU 出现 CORS 问题

【英文标题】：CORS issue with HEROKU after deploying

【发布时间】：2021-05-09 11:15:58

【问题描述】：

所以我的 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: "[e-mail]",
    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`);
);

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

【参考方案1】：

你可以这样使用。

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);
...

【参考方案2】：

您已经在处理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();
);

【讨论】：

感谢您的回复！我尝试拦截每个请求，但这似乎没有做任何可悲的事情。 API 仍然可以在本地运行，但不能在 Heroku 上运行。