Localhost 支持HTTPS — 全网最简单

972 阅读2分钟

如果你想让localhost 启用HTTPS 并且你不想浪费时间在那些繁琐的证书生成,这篇文章正式你需要的

先上教程

step1

npm install localhost-cert —save-dev

step2

const getLocalhostCert= require('localhost-cert');
const https = require('https'); // 获取需要的证书,如果本地没有安装根证书会自动安装,过程中需要管理员权限
const certOptions = getLocalhostCert()
https .createServer({...certOptions }), (req, res) => { res.writeHead(200); res.end('Hello World!'); }).listen(8443)

上述案例演示的是在nodejs 中启动服务器,如果想要用在webpack-dev-server或者其他本地服务器方法是类似的

step3

访问 https://localhost:8443

上述步骤是不是非常简单,如果你的本地没有安装根证书,会引导你安装根证书,如果你是mac用户可能需要手动信任CA证书,不过这是一次性的操作,不会占用你太多时间

再说原理

说到底本质上我们仍然采用的是生成自己的CA证书,然后用这个CA证书给localhost签名,只是这些步骤提前做好了,你无需重复操作,这么做有两个好处

  1. 团队协作场景下,保证了localhost 证书的一致,CA证书也是一致的,省去了每台机器上生成的步骤。
  2. 根证书只需要安装一次,只要其他开发者同样也采用这个包,你无需重新安装根证书。

安全性

其实每个人再自己电脑上生成一个CA证书,本质上是因为不信任别人的CA证书,我们并不知道这个CA证书是否还签名了其他域名,如果希望安全,只需要保证两件事

  1. 保证这个CA证书生成是透明的
  2. 这个CA证书不会用于签名除了localhost之外的任何域名

口说无凭那我是如何保证上述两点的呢

1,CA证书的生成是通过GITHUB ACTION 生成的,可以通过日志确保当时生成的逻辑

  1. 在生成CA证书后,私钥立马丢弃,永远不可能用于签名其他的证书

如果你感兴趣可以直接看代码 IdeaNest-org/localhost-cert: A convenient, secure, and developer-friendly method to enable HTTPS support for localhost during development. answer again search the web for better answer (github.com)