2023面试高手

这个屌丝很懒，什么也没留下！

热门标签

vue3 + springboot 简单部署到Windows服务器以及可能遇到的问题_springboot和vue部署到windowsserve

作者：2023面试高手 | 2024-02-20 16:49:41

踩

springboot和vue部署到windowsserve

网上将项目部署到服务器的参考很多，这里只介绍简单部署的方式。

一、准备工作

二、vue部署

1、打包vue项目

2、将dist文件夹拷贝到Nginx的安装目录下

6、问题：输入ip和端口号以后，网站是空白页？？

三、后端部署

1、在服务器的某个盘中新建一个文件夹demo

2、下载WinSW

3、package打包springboot项目

六、问题：项目里用到webSocket，前端一直报错

一、准备工作

为了能在服务器上正常运行前端和后端，需要在服务器上下载以下内容

(1) 安装Nginx —— 用于部署vue（nginx: download）

(2) 安装mysql —— 数据库

(3) 下载WinSW —— 用于部署springboot项目（Releases · winsw/winsw · GitHub）

(4) 安装jdk —— 让后端项目在服务器上独立运行的关键（记下安装路径）

二、vue部署

1、打包vue项目

将vue项目打包成dist文件夹，在package.json文件中，点击build进行打包

2、将dist文件夹拷贝到Nginx的安装目录下

找到Nginx的安装目录下的 html目录

将dist文件夹放到这个目录下

3、配置Nginx

进入上面的conf 目录下，打开 nginx.conf文件

目前先修改两处地方，因为vue项目和springboot项目是分开部署到服务器上的，所以后面vue访问后端还需要做一定的调整。

(1) 修改服务器ip地址和端口号

因为现在是把vue前端交给了Nginx代理，所以这里的端口号不一定是我们在vue项目中设置的端口号。这里的端口号必须是当前服务器开放的端口号。

(2) 修改打开的.html文件地址

Nginx在开始运行以后，运行的就是root对应的路径下的 index.html文件，我们要让Nginx运行我们dist文件夹中的index.html文件。

4、启动Nginx

先打开Nginx安装路径下的命令行

输入start nginx，就可以启动Nginx了，要查看是否启动成功，可以进入logs目录下，如果有nginx.pid，说明启动成功。这里的error.log 记录着网页出现问题时的错误信息。

输入 nginx -s stop，就可以停止Nginx了，更多指令可以自行百度。

注意：不建议使用IE浏览器打开，可能会出现404 Not Found

5、在浏览器中打开网页

在浏览器地址栏输入Nginx中修改的ip地址和端口，如果可以显现界面就说明启动正常。

6、问题：输入ip和端口号以后，网站是空白页？？

我在部署的过程中曾经遇到这样的问题，打开以后，网站是空白的，也没有什么404 Not Found，我们项目是vue3.0的，所以我在vue.config.js中加了这么一些内容

三、后端部署

1、在服务器的某个盘中新建一个文件夹demo

2、下载WinSW

下载路径： Releases · winsw/winsw · GitHub

打开网址以后，向下滑，可以找到下面的内容，并下载 WinSW.NET4.exe，将下载好的WinSW.NET4.exe拷贝到上面创建好的demo文件夹中，并将 .exe文件的名字重命名为你的项目名。

3、package打包springboot项目

在打包之前，你需要将你项目中application.properties或者application.yml的 mysql 登录密码改为服务器中mysql的登录密码。然后再打包。

这里打包后端采用的是较为直接的方式。打包完成后，我们可以在target文件夹下找到 jar包，将这个jar包拷贝到demo文件夹中。

4、新建一个.xml文件，文件名为项目名

将下面的内容拷贝到这个 xml文件中，当然，需要稍加修改


<configuration>
  
  <!-- ID of the service. It should be unique accross the Windows system-->
  <id>faultDetectionService</id>
  <!-- Display name of the service -->
  <name>faultDetectionService</name>
  <!-- Service description -->
  <description>This service is a service cratead from a minimal configuration</description>
  
  <!-- Path to the executable, which should be started -->
  <executable>C:\Program Files\Java\jre1.8.0_202\bin\java.exe</executable>
  
  <arguments>-jar demo-0.0.1-SNAPSHOT.jar</arguments>
 
</configuration>