node.js - 如何为以下设置安装 SSL(React 前端 + Nodejs 后端 + 自定义域 Heroku)
问题描述
关于我的设置的一般信息
目前,我正在使用react和一个为该 Web 应用程序提供数据的nodejs API 构建一个 Web 应用程序。这两个应用程序都托管在heroku.com上,并且彼此独立运行。我从不同的托管服务提供商处购买了一个自定义域,并使用heroku 自定义域选项将 DNS 指向我的网站。
关于我的设置的技术细节
- NodeJS 服务器:Express
- NodeJS 版本:v10.15.0
- 反应版本:v16.2.0
- 自定义域:www.tabbs.nl
- Heroku 域:tabbs-web-app.herokuapp.com
我遇到的问题
我一直在研究很多文档和教程,以便为 react/NodeJS 设置 SSL,但找不到一个关于如何为我的设置设置 SSL/安全性的不错的教程。
我已经阅读的教程:
- Node + Express + Lets Encrypt
- 如何在 nodejs 中使用 SSL/TLS
- 堆栈溢出帖子,可能还有很多我现在忘记的。
我想达到什么目标?
我想要实现的目标是在 React Web 应用程序(前端)和 NodeJS API(后端)之间建立一个安全连接,以便它们之间的所有数据都是加密和安全的。此外,我希望我的自定义域(由与 Heroku 不同的托管服务提供商购买)是安全的并强制使用 https。
如有任何问题或其他信息,请随时提问!
解决方案
您是否尝试过在节点中使用 https 模块?
你可以这样做:
var express = require('express');
var https = require('https');
var http = require('http');
var app = express();
http.createServer(app).listen(80);
https.createServer(options, app).listen(443);
express() 返回的应用程序实际上是一个 JavaScript 函数,旨在作为回调传递给 Node 的 HTTP 服务器以处理请求。这使得为您的应用程序的 HTTP 和 HTTPS 版本提供相同的代码库变得很容易,因为应用程序不会从这些版本继承(它只是一个回调。
如果您使用的是 create react app,请打开终端并输入“npm run build”。这将创建一个包含所有静态文件的构建文件夹。
现在回到您的节点后端服务并添加以下内容:
var express = require('express');
var path = require('path');
var https = require('https');
var http = require('http');
var app = express();
const options = {
key: fs.readFileSync("/srv/www/keys/my-site-key.pem"),
cert: fs.readFileSync("/srv/www/keys/chain.pem")
};
http.createServer(app).listen(80);
https.createServer(options, app).listen(443);
app.use(express.static(path.join(__dirname, 'build')));
app.get('/', function(req, res) {
res.sendFile(path.join(__dirname, 'build', 'index.html'));
});
如果您使用反应路由器来处理您的网络应用程序的路由,那么您将修改 GET 请求,如下所示:
var express = require('express');
const path = require('path');
var https = require('https');
var http = require('http');
var app = express();
const options = {
key: fs.readFileSync("/srv/www/keys/my-site-key.pem"),
cert: fs.readFileSync("/srv/www/keys/chain.pem")
};
http.createServer(app).listen(80);
https.createServer(options, app).listen(443);
app.use(express.static(path.join(__dirname, 'build')));
app.get('/*', function(req, res) {
res.sendFile(path.join(__dirname, 'build', 'index.html'));
});
推荐阅读
- ios - NSEntityDescription.entity crashes app (SIGABRT)
- javascript - 使用 jQuery 将 HTML 属性设置为 JSON 对象
- python - Python 按列分组并在另一列中计数字符串
- c# - C# 中的加扰字符串操作
- python - 我如何允许用户输入添加到字典
- javascript - 轮盘赌,选择图像
- python - Python:如何最好地处理开发同时使用它的库和应用程序?
- xml - infopath xml 上的尾随空值
- string - 用字符串更改的不同值替换字符串中的值
- javascript - 我正在使用 javascript 在模式中创建一个表单,但它不适用于 ajax