本地安排上HTTPS的最佳途径~

抛弃http的API们

这年头没有https都没法开发软件了,web标准上近几年的api们清一色地要求https,否则就罢工!它们包括但不限于:

  • Notification:系统通知

  • Geolocation:地理信息

  • Storage:存储/缓存

  • PWA:渐进式Web应用

  • Payment Request:支付

  • Clipboard:剪贴板

  • ServiceWorker:守护线程

  • MediaDevices:媒体设备

  • Crypto:密码学工具

  • Generic Sensor:传感器

  • Bluetooth:蓝牙接口

  • Authentication:认证

  • WebXR:虚拟现实

  • Presentation:屏幕共享

https://developer.mozilla.org/en-US/docs/Web/Security/Secure_Contexts/features_restricted_to_secure_contexts

信息来源

这些api都不能在http下正常使用,尤其以chrome的要求最为严格,必须保证入口文档和异步资源都是https时才能使用以上的API,否则会出现下面的提示。

可是开发时,本地部署https并没有那么容易,想让浏览器承认网站的安全性没有想象中那么简单,尤其是访问本地服务器的时候,chrome总是出现红色的感叹号,多年来尝试过以下的方法都失败了:

  • 用假证书自然不行

  • 给localhost或ip地址颁发自签名证书被系统拒绝了

  • 修改hosts文件并安装证书,浏览器不认(chromium有自带的证书管理器)

  • 调chrome的首选项(chrome://flags/)倒是可以但非常麻烦

有没有既简单又稳当,符合一般人思维习惯的办法呢,网上总是没有明确的答案,直到前几天玩VisualSVN Server的时候终于发现了标准的做法。


本地服务器的4种地址


IP地址
域名
本地
127.0.0.1
localhost
网络 网卡IP
主机名

通过以上4种地址都可以访问本地服务器,有的机器还可以通过0.0.0.0来访问,这种地址不被广泛接受,更多的是作为匹配所有ip的保留地址。每台电脑自带的dns服务都会把localhost解析到127.0.0.1,然后指向本机,就是说,127.0.0.1对应的域名是localhost。

如果电脑联网的话,还可以通过网卡ip来访问本地,比如192.168.0.1,那它对应的域名是什么呢?不用查dns缓存,只要打开你的电脑名片就能看到了,比如Windows电脑在【控制面板/系统和安全/系统】中可以查看名片:

(我不是来秀内存的)

其中的计算机名就是你的主机域名,能够解析成你的网卡ip,以我的电脑为例,随便开一个http服务,浏览器中可以直接访问 http://desktop-oakgfsr/ 了。

如何上https呢?自然不能用假证书了,但也没必要花钱去找CA颁发真证书。等等,既不用真证书也不用假证书???误会了,我们用真证书,只不过是用openssl自签名的证书,方便起见,我们不用openssl做实验了,在网上随便找一个在线ssl证书生成器就好了。

按照要求输入域名以后,生成器很快就帮你制作好证书和私钥:

  • desktop-oakgfsr.cert:自签名证书

  • desktop-oakgfsr.key:证书的私钥


安装自签名证书

如果你对https的原理不是很明白的话,推荐看这篇文章:《HTTPS与P=NP问题卍解》,里面把https原理嚼碎了送到你嘴里。接下来要让操作系统或浏览器信任这个证书:双击打开证书,点击安装。

证书导入位置选择【受信任的根证书颁发机构】即可。

打开【管理用户证书】就能看到刚安装的证书了:

当然也可以选择在这里导入证书,效果是一样的。最后我们用这个证书和刚刚的私钥开一个本地web服务器,监听443端口,浏览器访问 https://desktop-oakgfsr/ ,就成功了。

如果发现在chrome上没有立刻生效,可能需要重启浏览器,甚至重新登录Google账号才行。自此,一众Web最新API都能使用啦。

<完>

猜你喜欢

转载自blog.csdn.net/github_38885296/article/details/108722453
今日推荐