1. 本地生成证书
# 进入我的项目并在 build 下新建 cert 目录
cd ./your-projuct/build && mkdir cert
# 进入 cert 目录
cd cert
# 应用 openssl 生成私钥
openssl genrsa -out private.key 1024
# 应用下面生成的私钥生成证书 其中的 Common Name 输出后端接口的 host
openssl req -new -key private.key -out csr.key
# 生成证书签名文件
openssl x509 -req -days 3650 -in csr.key -signkey private.key -out file.crt
(在第四步生成的私钥生成证书时,其中的 Common Name 配置输出后端接口的 host)
2. 批改本地启动我的项目的配置文件
app.js 或者 ./build/dev-server.js,这里截取局部改变代码
const opn = require('opn');
const path = require('path');
const express = require('express');
const webpack = require('webpack');
const proxyMiddleware = require('http-proxy-middleware’);
const webpackConfig = require('./webpack.dev.conf');
const app = express();
const compiler = webpack(webpackConfig);
.
.
.
// 新增局部
const fs = require('fs');
const https = require('https’);
const privateKey = fs.readFileSync(path.join(__dirname, './cert/private.key'),'utf8');
const certificate = fs.readFileSync(path.join(__dirname, './cert/file.crt'),'utf8');
const credentials = {key: privateKey, cert: certificate};
const server = https.createServer(credentials, app);
server.listen(port);
3. 重启我的项目
3.1 问题:Chrome 浏览器无奈解决芜杂凭据,无法访问 https localhost url
解决 :点击页面任意处,间接应用键盘输入 thisisunsafe 后回车即可失常拜访
3.2 问题:无法访问后端接口,报错 DEPTH_ZERO_SELF_SIGNED_CERT
解决 :须要在 proxyTable 的每个对象中减少 secure:false
// 每个对象中减少 secure:false
const proxyHost = 'https://www.your-domain.com';
const proxyTable = {
'/YOURKEYWORD': {
target: proxyHost,
changeOrigin: true,
secure: false
}