当前位置：首页 > news >正文

Web课程设计临时申请SSL证书【Vue+springboot】

news 2025/11/4 17:16:30

一、前端项目（Vue）

1.下载mkcert

发布 · FiloSottile/mkcert --- Releases · FiloSottile/mkcert

我们进入这个github地址下载电脑对应的mkcert，这里我们选择window版的，注意，下载后先不要运行！

2.安装

在你下载的文件夹打开命令行（或者按win键+“X”键，然后按“A”键，然后通过cd指令将命令行操作路径移到下载路径去），输入以下指令

你下载的文件的文件名 -install

你将看到如下界面，选择是即可

如果想要知道是否成功，可以在执行一次，如果，已经成功，则会出现如下情况

3.生成自签证书

同上一命令行界面执行如下指令，后面跟着的是你需要签发的IP，这里我们写localhost和127.0.0.1即可。

你下载的文件的文件名 localhost 127.0.0.1

执行之后，你将在你下载的目录下看到这样两个文件：

4.将文件添加进Vue项目

将这两个文件复制到vue.config.js文件同级目录下，如图

编辑vue.config.js文件如图：

二、后端项目（springboot）

一、下载OpenSSL

Win32/Win64 OpenSSL 安装器 for Windows - Shining Light Productions --- Win32/Win64 OpenSSL Installer for Windows - Shining Light Productions

我们打开网站向下划找到如下界面，下载划红圈的：

二、安装OpenSSL

找一个你能找的到的地方安装，以下这个界面默认选第一个即可，注意，可能最后有一个想要你赞助的界面，这不影响我们使用。

安装之后，我们需要配置环境变量，当然，你也可以不配置，不过之后使用OpenSSL的相关指令可能都需要再安装路径下的bin文件里才能有用。

我们找到安装路径下载的bin文件夹并复制：

我们在桌面右键此电脑，选择属性，然后选择界面中的高级系统设置，然后选择环境变量，然后在下部分系统变量界面中找到Path这条，然后点击编辑，在弹出来的界面中选择新建，将OpenSSL安装路径下的bin文件夹的路径复制到新建处，然后一层一层点确认。

我们需要重新打开命令行，输入以下指令有如下输出就是安装好了。

三、生成PKCS#12 (.p12) 文件

在之前用mkcert生成的文件的目录下执行如下指令，记住你输入的密码：

openssl pkcs12 -export -in localhost+2.pem -inkey localhost+2-key.pem -out keystore.p12 -name "localhost" -CAfile "$(mkcert -CAROOT)/rootCA.pem" -caname "mkcert"

四、为项目配置

我们将生成的keystore.p12复制到后端的resources目录下，如图：

在配置文件添加如下代码：

对于application.yml：

server:ssl:key-store: classpath:keystore.p12key-store-password: 这里是你之前生成keystore.p12输入的密码key-store-type: PKCS12key-alias: localhost

对于application.properties：

server.port=8081
server.ssl.key-store=classpath:keystore.p12
server.ssl.key-store-password=这里是你之前生成keystore.p12输入的密码
server.ssl.key-store-type=PKCS12
server.ssl.key-alias=localhost

这样分别重启前后端就可以了。