mkcert实现本地https

​​1.下载 mkcert​​

从 mkcert GitHub 发布页 下载适用于 Windows 的版本(如 mkcert-v1.4.4-windows-amd64.exe)。

​​安装 mkcert​​

以管理员身份运行命令提示符(CMD),执行以下命令安装并信任本地 CA:

bash 复制代码
mkcert-v1.4.4-windows-amd64.exe -install

这会自动将 mkcert 的根证书添加到系统受信任的 CA 列表中。

​​2. 生成 SSL 证书​​

为你的本地 IP 生成证书:

bash 复制代码
mkcert-v1.4.4-windows-amd64.exe 192.168.31.42 localhost 127.0.0.1 ::1

生成的文件:

bash 复制代码
192.168.31.42+1.pem(证书)
192.168.31.42+1-key.pem(私钥)。

​​3. 配置开发服务器​​

​​Vite 项目(Vue/React)​​

在 vite.config.js 中配置 HTTPS:

bash 复制代码
import { defineConfig } from 'vite'
import fs from 'fs'

export default defineConfig({
  server: {
    https: {
      key: fs.readFileSync('192.168.31.42+1-key.pem'),
      cert: fs.readFileSync('192.168.31.42+1.pem'),
    },
    host: '0.0.0.0', // 允许局域网访问
    port: 5174,
  },
})

重启项目后访问 https://192.168.31.42:5174

​​其他服务器(如 Nginx)​​

修改 Nginx 配置:

bash 复制代码
server {
    listen 443 ssl;
    server_name 192.168.31.42;
    ssl_certificate /path/to/192.168.31.42+1.pem;
    ssl_certificate_key /path/to/192.168.31.42+1-key.pem;
    location / {
        proxy_pass http://localhost:5174;
    }
}

重启 Nginx:

bash 复制代码
nginx -s reload
相关推荐
赖small强38 分钟前
【Linux 网络基础】libwebsockets 技术文档
linux·网络·https·tls·lib·websockets
2501_916007471 小时前
iOS 应用性能测试的工程化流程,构建从指标采集到问题归因的多工具协同测试体系
android·ios·小程序·https·uni-app·iphone·webview
TT哇1 小时前
消息推送机制——WebSocket
java·网络·websocket·网络协议
帧栈2 小时前
开发避坑指南(72):HttpHeaders 的add()方法和set()方法有什么区别?
java·spring·http
00后程序员张4 小时前
iOS 抓不到包怎么办?从 HTTPS 解密、QUIC 排查到 TCP 数据流分析的完整解决方案
android·tcp/ip·ios·小程序·https·uni-app·iphone
gadiaola5 小时前
【计算机网络面试篇】HTTP
java·后端·网络协议·计算机网络·http·面试
罗汉松(山水白河)5 小时前
关于串口与UDP通讯的实验
单片机·嵌入式硬件·网络协议·udp·tcp·串口、
fei_sun7 小时前
【复习】计网每日一题1124---UDP首部检验和计算、检验和特殊含义
网络·网络协议·udp
2***57427 小时前
前端WebSocket案例
网络·websocket·网络协议
木易 士心8 小时前
WebSocket 与 MQTT 在即时通讯中的深度对比与架构选型指南
websocket·网络协议·架构