Vue+SpringBoot+Nginx实现部署服务器

一.Nginx安装启动

1.安装

省略

2.启动

1.双击解压的文件夹的.exe文件(有黑框闪过就是成功)

2.cmd进入nginx目录

 cd D:downdownxiazaila
ginxdown
ginx-1.24.0
// 一定要进入解压文件夹的根目录 不然之后的指令可能会报错

3.浏览器访问

http://localhost:8083/
//这个8083是你设置再conf/nginx.conf文件中的serve的listen的端口号
//默认是80

 

4.如果有代码修改

用指令重载代码 再用上述步骤启动

.
ginx.exe -s reload

3.关闭

 ???

参考【http://t.csdnimg.cn/UODrj】 

二.前端Vue打包

1.打包

打开vue项目 控制台运行指令打包

npm run build

2.配置

打包后会生成dist文件夹

 

将生成的dist文件夹里面的文件替换掉Nginx初始html文件夹中的东西

重载启动 

三.后端SpringBoot打包

1.准备工作

1.1 确保项目安装了打包依赖

 <build>
        <plugins>
            <plugin>
                <groupId>org.springframework.boot</groupId>
                <artifactId>spring-boot-maven-plugin</artifactId>
                <version>2.7.14</version>
            </plugin>
        </plugins>
 </build>

注意:这个依赖在pom.xml中出现爆红的原因可能是版本未设置

           应该将版本设置成和spring-boot-starter-parent一样

<parent>
        <groupId>org.springframework.boot</groupId>
        <artifactId>spring-boot-starter-parent</artifactId>
        <version>2.7.14</version>
        <relativePath/> <!-- lookup parent from repository -->
    </parent>

 1.2 确保安装了maven

注意:配置好环境变量后,cmd一定要重启,不然还可能报错

mvn --version 检查maven版本

参考【http://t.csdnimg.cn/Dkxly】

2.正式打包 

终端运行打包命令

mvn package

3.配置

命令提示符 管理员模式运行jar包

java -jar D:Aclevergreenerwugespringboot	argetspringboot-0.0.1-SNAPSHOT.jar
//java -jar 你的jar包地址

nginx.conf 改地址

 server {
        listen       8083;    
        server_name  localhost;

        。。。

        location / {
            root   html;    //前端dist包的地址(nginx根目录下的html文件夹中)
            index  index.html index.htm;
        }

	    location ^~/gateway/ {      
            proxy_pass http://172.19.17.70:8080/;   (后端地址 ip+后端服务端口号)
	        proxy_set_header Host $http_host;
	        proxy_set_header X-Real-IP $remote_addr;
	        proxy_set_header REMOTE-HOST $remote_addr;
	        proxy_set_header X-Forwarded-For $proxy_add_x_forwarded_for;
        }
        
        。。。
}


以这个示例,我当前有一个服务器,ip是192.。。。 
部署成功的条件是:
http://192.。。。:8083/ 
能访问到对应的前端文件
然后前端文件能通过 
http://192.。。。/gateway/
访问后端接口

四.服务器部署(未完待续)

1.数据库部署

1.新建数据库容器

docker run -id --name test_mysql  -p 3306:3306 -e MYSQL_ROOT_PASSWORD=123456 mysql:5.7


//docker run -id --name test_mysql(新建容器名)  -p 3306:3306(数据库端口:要映射的本地端口) -e MYSQL_ROOT_PASSWORD=123456(数据库密码) mysql:5.7 (数据库版本)

2.操作容器

docker start +容器名  //启动容器
docker 删除 +容器名  //启动容器

docker ps -a  //查看容器列表
docker rm +容器名  //删除容器

3.进入容器

docker exec -it  test_mysql  /bin/bash


//docker exec -it  test_mysql(数据库名)  /bin/bash

4.登录数据库

mysql -u root -p

再输密码

123456