mkcert 配置本地开发环境的https

现在浏览器对安全的限制越来越严格,有些功能必须要在https安全环境下才能访问,比如在移动端浏览器上使用 navigator.mediaDevices.getUserMedia() 调用摄像头,否则 navigator.mediaDevices 对象会是 undefined 。

当然生产环境购买申请 ssl证书就可以实现 https了,但是本地开发环境是没法申请证书的,而且一般的自签名证书已经不好使了,并且操作也稍显麻烦。

Google 的开源项目mkcert可以一条命令生成浏览器信任的本地证书,支持自定义域名如 example.test 、localhost 也支持 IP 127.0.0.1 、192.168.1.100 等。。。

(其实是两条。。。)

$ mkcert -install  #生成根证书,并将其加入到系统信任证书中

$ mkcert test.com "*.test.com" localhost 127.0.0.1 192.168.0.110 ::1   #可以一次加入多个主机名(域名、IP等)

其实跟之前的自签名证书主要的区别是多了前面根证书的步骤。

这样就舒服多了,也没有安全提醒了:


项目地址:https://github.com/FiloSottile/mkcert


PS:vscode liveserver插件的https配置方法:

"liveServer.settings.https": {

    "enable": true,

    "cert": "/Users/dubox/dev/docker/work/github/https/test.com+5.pem",

    "key": "/Users/dubox/dev/docker/work/github/https/test.com+5-key.pem",

    "passphrase": ""

  }

發表評論
所有評論
還沒有人評論,想成為第一個評論的人麼? 請在上方評論欄輸入並且點擊發布.
相關文章