网上查了下,倒是有一大推vite开启https的方法,但是大部分是mac的,windows电脑无法成功,所以经过一阵捣鼓,总结了这边文章,希望对你有帮助
使用工具
Mkcert是一个用于生成本地可信开发证书的简单工具,不需要配置。
- 官方文档:github.com/FiloSottile…
- mkcert工具下载链接:github.com/FiloSottile…
只针对windows电脑,其他系统请看官方文档
下载文件
大部分的Pc都是AMD架构
开始安装
下载完成后放到c盘根目录(你可以随便放哪都行),然后cmd(我用的系统自带的)进入文件所在目录,输入安装命令
mkcert-v1.4.4-windows-amd64.exe -install
将CA证书加入本地可信CA,使用此命令,就能帮助我们将mkcert使用的根证书加入了本地可信CA中,以后由该CA签发的证书在本地都是可信的。
执行过程中弹出安全警告,选是
安装完成,如图
查询是否安装成功
mkcert-v1.4.4-windows-amd64.exe
列出CA证书的存放路径
mkcert-v1.4.4-windows-amd64.exe -CAROOT
生成SSL自签证书
以下两个选一个就行
签发本地访问的证书
直接跟多个要签发的域名或ip,比如签发一个仅本机访问的证书(可以通过127.0.0.1和localhost,以及ipv6地址::1访问) mkcert-v1.4.3-windows-amd64.exe localhost 127.0.0.1 ::1
mkcert-v1.4.4-windows-amd64.exe localhost 127.0.0.1 ::1
签发本地IP地址的证书(我用的是IP地址)
mkcert-v1.4.4-windows-amd64.exe 192.168.56.1
生成文件如下(就在当前安装包所在的目录)
其中192.168.2.25.pem为公钥,192.168.2.25-key.pem为私钥
将公钥.pem格式改为.crt格式,然后双击安装证书
使用chrome浏览器进行验证查看是否生效
最后再把刚刚改为.crt格式的文件改回来.pem
vite配置
// 顶部引入 import fs from 'node:fs'
server: {
https: {
cert: fs.readFileSync(path.join(__dirname, './keys/agent.pem')),
key: fs.readFileSync(path.join(__dirname, './keys/agent-key.pem')),
},
host: '0.0.0.0'
},
最好重启下vite,这个时候就可以访问了