先說一下主要流程, 首先要根據域名生成兩個秘鑰文件,包含一個公鑰一個私鑰,部署項目的服務器上需要配置這兩個證書文件。然后客戶端電腦上還需要安裝一個自制CA,也就是用來校驗證書的頒發機構(因為這套證書使我們自己頒發給自己的,需要自己來校驗自己,嗯,就是自導自演-_-)。以上文件均通過mkcert這個工具生成,有了這些就ok了。
一、安裝 mkcert
由於我本地是使用windows安裝的, 沒有測試linux,但是我認為linux安裝應該會更簡單,這里就不放linux的安裝方法了。mkcert提供macos、linux、windows的安裝方法。
windows安裝可以用兩種方法,從mkcert官方提供的安裝文件(地址)安裝,另一種可以用windows上的一個包管理工具(choco)安裝,類似linux那樣。
另、安裝choco:使用管理員身份打開cmd,執行
@"%SystemRoot%\System32\WindowsPowerShell\v1.0\powershell.exe" -NoProfile -InputFormat None -ExecutionPolicy Bypass -Command "iex ((New-Object System.Net.WebClient).DownloadString('https://chocolatey.org/install.ps1'))" && SET "PATH=%PATH%;%ALLUSERSPROFILE%\chocolatey\bin"
然后執行
choco install mkcert -y
如果沒有問題應該就已經安裝成功了。參考 windows安裝 choco。
二、使用mkcert安裝頒發機構以及證書文件
首先需要先將mkcert的認證機構安裝到電腦中, 執行:
mkcert -install
下一步就是生成證書文件:
mkcert localhost.com 127.0.0.1
mkcert + 需要認證的域名(需要包含所有使用https需要認證的域名,包括后端服務),會生成兩個pem文件。帶-key的就是私鑰。(我出現過使用git的cmd命令行工具執行這個命令沒有反應的現象,如果出現這種情況使用windows自帶的cmd就沒問題了)
文件生成在當前目錄,根據自己的當前目錄找到這兩個文件就可以了。
三、找到CA機構文件,為需要訪問項目的電腦安裝自制校驗機構
直接執行
mkcert -CAROOT
顯示出來的就是本地校驗文件存放的位置,直接粘貼到文件管理器中就能找到
其中有兩個文件,這里只需要紅框中的那個公鑰證書就可以了。把它復制出來, 將后綴名改成crt,於是我們得到了一個可以安裝到其他電腦的CA證書校驗文件。
把它拷貝到其他電腦上,直接雙擊就可以安裝,其中有一步操作需要安裝到指定位置
剩下的一步到底就可以了。彈窗均選是,就可以看到提示導入成功~
以上為windows的安裝過程,mac操作不一樣,需要添加證書為信任,具體操作參考 mac安裝根證書。linux我就沒有研究了,自行百度吧~
四、后端服務生成安裝p12證書文件
目前我們擁有三個文件,分別是兩個pem公鑰私鑰,一個rootCA.crt機構文件。
我們這里是java后端服務,他們需要使用p12的證書文件,將公鑰私鑰合二為一,這里我使用openssl命令生成(git bash自帶):
openssl pkcs12 -export -clcerts -in localhost.com+1.pem -inkey localhost.com+1-key.pem -out server.p12
需要在這兩個文件的目錄里執行。
五、部署使用
現在我們擁有四個文件:兩個pem公鑰私鑰文件,一個rootCA機構文件,一個server.p12證書文件。rootCA是給需要訪問項目的電腦安裝的,p12是給后端服務使用的,正常部署前端服務只需要兩個pem文件即可。
前端本地開發測試啟動服務,本人使用vue開發,用的是vue cli 的腳手架4.3.1的版本,cli使用node啟動本地服務,只需要在 vue.config.js做如下配置:
devServer: { https: true, key: fs.readFileSync('./localhost+6-key.pem'), cert: fs.readFileSync('./localhost+6.pem'), },
需要重啟項目生效!
線上服務配置前端一般使用nginx部署,nginx配置如下:
server { listen 443 ssl; server_name localhost; ssl_certificate localhost+6.pem; ssl_certificate_key localhost+6-key.pem; ssl_session_cache shared:SSL:1m; ssl_session_timeout 5m; ssl_ciphers HIGH:!aNULL:!MD5; ssl_prefer_server_ciphers on; location / { root /home/nginx/ssap/html; index index.html index.htm; try_files $uri $uri/ /index.html; } }
六、總結一下
使用自簽https證書唯一一點不好處就是,一般都在內網使用,因為訪問項目的人需要安裝校驗機構文件。如果項目上線在外網使用,還是需要去購買證書的。不可能讓每一個訪問項目的每一個人都下載安裝你自己的校驗機構文件,對吧~
有問題歡迎評論。
另外,火狐不認這一套自導自演的自簽證書。