我在Heroku上有一个应用程序,它是使用create-react-app
创建的。就在今天,我使用Heroku的自动化(-ish)SSL证书进程ExpeditedSSL获得了一个SSL证书,然后文档建议将所有http请求重新路由到https。
我有一个server.js文件和express,我只是尝试运行中间件,然后为我的React应用程序提供服务。
我知道SSL证书是工作的,就像我去https://myapp.com我看到我的Heroku应用程序,但当我去http://myapp.com它不是重定向到https版本的Heroku应用程序。
今天我已经尝试了很多很多的solutions
,从StackOverflow,Google,和其他地方,没有一个解决方案对我有效。我也没有得到任何错误。它就是不工作。
尝试使用https library
:
const https = require("https");
const express = require('express');
const app = express();
app.use(express.static(path.join(__dirname, 'build')));
app.get('/', function (req, res) {
res.sendFile(path.join(__dirname, 'build', 'index.html'));
});
https.createServer(app).listen(3000);
使用heroku-ssl-redirect
的另一个尝试:
var sslRedirect = require('heroku-ssl-redirect');
var express = require('express');
var app = express();
// enable ssl redirect
app.use(sslRedirect(['production'], 301));
app.use(express.static(path.join(__dirname, 'build')));
app.get('*', (req, res, next) => {
if (req.headers['x-forwarded-proto'] != 'https'){
res.redirect('https://' + req.hostname + req.url);
} else {
next();
}
});
app.get('/', function (req, res) {
res.sendFile(path.join(__dirname, 'build', 'index.html'));
});
app.listen(process.env.PORT || 3000);
尝试使用x-forward-proto
:
const express = require('express');
const env = process.env.NODE_ENV || 'development';
const bodyParser = require('body-parser');
const path = require('path');
const app = express();
var forceSsl = function (req, res, next) {
if (req.headers['x-forwarded-proto'] !== 'https') {
return res.redirect(['https://', req.get('Host'), req.url].join(''));
}
return next();
};
if (env === 'production') {
app.use(forceSsl);
}
app.use(express.static(path.join(__dirname, 'build')));
app.get('/', function (req, res) {
res.sendFile(path.join(__dirname, 'build', 'index.html'));
});
app.listen(process.env.PORT || 8080);
我也尝试了一些随机节点安装从各种博客和SO的职位,并没有任何工作。没有任何错误,我有一个很难弄清楚为什么这不工作。
5条答案
按热度按时间vawmfj5a1#
尝试将以下内容添加到index.html文件的头中
我曾经遇到过一个类似的问题,这个问题让我得以解决。将它放在头文件中可以确保脚本在任何捆绑的JavaScript之前运行,但我认为它应该在bundle.js文件之上运行
mnowg1ta2#
以下是更新和安全的解决方案:
由于您使用create-react-app通过Heroku部署react应用程序,并且它是buidlpack(建议,如果您不是:create-react-app-buildpack).所以正如官方文档所说:
Web服务器可以通过静态构建包进行配置。
配置文件
static.json
应在存储库的根目录下提交。如果此文件位于子目录中,则无法识别它如果存储库中不存在默认的
static.json
,则它为:仅限HTTPS
在
static.json
中,通过自动将不安全的请求重定向到**https://**来强制实施安全连接:@misterfoxy的方法有效,但不是正确的方法!
xqnpmsa83#
请尝试使用
express-https-redirect
。安装方式:
然后,您应该能够执行以下操作:
zengzsys4#
尝试将其添加到index.html文件中。将其放在文件头中,以便在其他脚本之前运行
8iwquhpp5#
这个好像对我有用对Heroku做出React
构建包https://github.com/mars/create-react-app-buildpack
root/static.json
https://youtu.be/LAjj_kzqbjw