使用 Let's Encrypt 添加 HTTPS 后,我的 Web 应用程序出现 CORS 错误

使用 Let's Encrypt 添加 HTTPS 后,我的 Web 应用程序出现 CORS 错误

这是我的申请:https://cfslpro.com/student_portal/ 前端由 AngularJS 完成,后端由 Node.JS 完成。托管在 Apache 服务器中。(Digital ocean Linux 16.04)

您可以尝试登录,用户名:chanu,密码是 123456。在使用 Let's Encrypt 添加 SSL 之前,此应用程序运行良好。现在我收到此错误:

跨源请求被阻止:同源策略不允许读取远程资源https://165.227.121.28:7000/api/user_manage/login. (原因:CORS 请求未成功)。

但是你可以在浏览器上运行这个没有 HTTPS 的 URL,并且它可以正常工作:

http://165.227.121.28:7000/api/user_manage/login

现在我将向您展示我的 Node.Js 服务器代码中的一些重要部分:

这就是我添加 CORS 插件的方式。

var cors = require('cors');
var app = express();
app.use(cors());

以下是我创建 HTTP 服务器的方式:

app.listen(config.port, function (err) {
    if (err) {
        console.log(err);
   } else {
        console.log("localhost:7000");
    }
});

我正在这里创建一个 HTTP 普通服务器。

这就是我从前端调用登录端点的方式。

https://165.227.121.28:7000/api/user_manage/login

如果我不使用 HTTPS 使用它,我会收到错误,content blocked因为我无法从 HTTPS 环境调用 HTTP 请求。这就是我收到 CORS 错误的地方。

这是我的/etc/apache2/sites-available/cfslpro.com.conf文件:

<VirtualHost *:80>

        <Directory /var/www/cfslpro.com/public_html>
                Options Indexes FollowSymLinks MultiViews

        </Directory>

        ServerAdmin webmaster@localhost
        ServerName cfslpro.com
        ServerAlias www.cfslpro.com
        DocumentRoot /var/www/cfslpro.com/public_html

        ProxyRequests on
        ProxyPass http://165.227.121.28:7000/api/user_manage/login https://localhost:7000/api/user_manage/login

        # Available loglevels: trace8, ..., trace1, debug, info, notice, warn,
        # error, crit, alert, emerg.
        # It is also possible to configure the loglevel for particular
        # modules, e.g.
        #LogLevel info ssl:warn

        ErrorLog ${APACHE_LOG_DIR}/error.log
        CustomLog ${APACHE_LOG_DIR}/access.log combined

</VirtualHost>

我认为我的反向代理配置是错误的。我对这种代理配置还不熟悉,我遵循了一些在线示例。我也遵循了这个示例:http://www.codingtricks.biz/run-nodejs-application-apache/

这是我的.htaccess 文件:

<IfModule mod_rewrite.c>
  Header add Access-Control-Allow-Origin "*"
  Header add Access-Control-Allow-Methods: "GET,POST,OPTIONS,DELETE,PUT"
  Header add Access-Control-Allow-Headers: "Content-Type"
</IfModule>

老实说,我现在很困惑。遵循了许多指南并尝试修复此 CORS 错误。为什么这个 CORS 会给我们这么多错误和问题?请大家帮帮我。我正在尝试修复和学习。请不要反对。我甚至可以提供服务器凭据来修复此问题。我花了整整一周的时间,现在无事可做。请帮帮我。

答案1

使用节点https模块并从你的实时站点的 Lets Encrypt 证书目录中指向/复制你的证书

if (process.env.PROJ_ENV && process.env.PROJ_ENV == "PROD") {
  /**
   *  Execute SSL on Production
   */
  let sslOptions = {
    key: fs.readFileSync("./ssl/key.pem"),
    cert: fs.readFileSync("./ssl/cert.pem")
  };
  https.createServer(sslOptions, app).listen(port, host, () => {
    console.log(`Server running successfully on ${host}:${port}`);
  });
} else {
  app.listen(port, host, () => {
    console.log(`Server running successfully on ${host}:${port}`);
  });
}

相关内容