vue本地项目设置https访问

848 阅读1分钟

我们在本地测试的时候部分API需要https才能实现,所以需要配置本地开发环境的https访问;

  1. 生成本地使用的https证书;
  2. 在vue.config.js中引入证书;

1、 打开项目根目录终端窗口下载证书生成库
npm install -g mkcert

2、 创建证书颁发机构
mkcert create-ca

3、创建证书
mkcert create-cert

4、创建成功后会有4个文件在我们项目根目录

image.png

5、打开项目文件夹双击  ca.crt 安装证书

image.png

image.png

image.png
6、在vue.config.js 文件中配置

const path = require('path')
const fs = require('fs')
 
module.exports = {
  devServer: {
    open: true,
    https: {
      cert: fs.readFileSync(path.join(__dirname, './cert.crt')), // 此处路径为自己项目实际为准
      key: fs.readFileSync(path.join(__dirname, './cert.key'))  // 此处路径为自己项目实际为准
    }
  }
}

7、重新起飞就ok拉