本地起vite 项目开启https支持

背景

做一个视频聊天工具，需要用浏览器打开摄像头和麦克风。chrome 要求打开摄像头和麦克风，需要开启https支持。

下载 mkcert

# 第一步，安装 mkcert
brew install mkcert

# 第二步，将 mkcert 添加到本地根CA
mkcert -install

# 第三步，生成签名和证书
# 当前目录下会多出两个文件，可以在项目根目录下运行
mkcert localhost

第四步

添加vite配置文件，没有这个文件的话自己创建

import { defineConfig } from 'vite'
import mkcert from 'vite-plugin-mkcert'

// https://vitejs.dev/config/
export default defineConfig({
  server: {
    https: {
      key: './localhost-key.pem', // {{ edit_2 }}
      cert: './localhost.pem', // {{ edit_3 }}
    },
  },
  // plugins: [mkcert()],
});

其他

修改 dev script，使项目局域网内可访问

# 也可以生成你本地证书的ip
mkcert 10.3.0.38