Docs99

Appearance

Return to top
On this page

本地端開發機 https

說明

某些時候使用第三方服務，基於安全性會要求必須是 https 才允許 「請求」，這樣就可以使用到這個方法。

流程

1️⃣ 安裝套件

bash
brew install mkcert
brew install nss # if you use Firefox

2️⃣ 產生憑證

mkcert [你想要的網址]

bash
mkcert -install 
mkcert localhost # 假設你要產生 localhost 憑證

這時會產生以 localhost 為域名的憑證，會在專案最外層產生：

  • localhost-key.pem
  • localhost.pem

3️⃣ 專案開發機設置

在 vue.config.js 內新增方法，如下：(意思就是將為 server 內的兩個檔案視為憑證)

js
const path = require('path')
const fs = require('fs')

module.exports = {
  devServer: {
    overlay: {
      warnings: true,
      errors: true,
    },

    https: {
      key:
        process.env.NODE_ENV === 'development'
          ? fs.readFileSync(`${__dirname}/localhost-key.pem`)
          : '',
      cert:
        process.env.NODE_ENV === 'development'
          ? fs.readFileSync(`${__dirname}/localhost.pem`)
          : '',
    },
  },
}

Reference