vue+spring boot 部署云服务器

---

---

一、配置好前台后台域名和ip的映射关系

阿里云和腾讯云配置好域名和ip的关系，准备好服务器

****
腾讯云配置域名映射ip

二、在服务器上安装2个tomcat，并且可以运行成功

1.修改端口号：访问的端口和8005端口

1.1先导入两个tomcat（前台是80，后台是8080）

1.2进入两个tomcat/conf/server.xml(配置文件) 里面

修改里面8005和端口号

修改8005

修改8080端口

2.外部访问：安全组端口对外开放，服务器防火墙对外开放

2.1服务器防火墙开放端口

2.2安全组端口对外开放

**

2.3测试服务器本地tomcat是否启动成功

**

首先启动tomcat后使用wget+url命令测试url是否有效

开启tomcat 当url可以正确访问后：

当你关闭tomcat之后，再次使用wget+url后：

如果因为种种原因导致失败，可以查看tomcat目录下：tomcat/logs/catalina.out 找寻错误信息

看到运行时的信息，类似于spring boot启动控制台里面的内容

也可以在logs目录下使用

tail -f catalina.out

查看报错信息

最后tomcat运行无误后，页面输入url返回tomcat页面，tomcat部署完毕

三、部署前后端项目

1.tomcat部署完毕后，首先修改vue配置分别在global.js和prod.env里面将本地localhost改为服务器号

这样部署在服务器的前台就能像本地一个访问后台

2.vue前台执行导包

npm run build

执行完后，会发现多出dist文件夹

将dist文件夹下的东西放到tomcat下的webapps/ROOT目录下（将tomcat自带的东西删掉）

3.后台打war包，放入后台tomcat下的webapps下

将里面除了ROOT文件夹全部删除，将war包导入webapps目录下（war重命名为ROOT）

3.重启tomcat，浏览器输入ip，进入项目。

tomcat部署前后台项目完成

四、nginx+tomcat配置反向代理（这里我不再使用两个tomcat，而是前台放入nginx里面，后台放入tomcat里面）

首先安装nginx，执行

yum install nginx

安装完后要将vue放到nginx里面

我们进入/usr/share/nginx这个路径里面，mkdir创建一个文件夹叫vue，把前台的包放入vue文件夹下

然后进入nginx的配置文件里面（vim /etc/nginx/nginx.conf）

    server {
        listen       80;
        listen       [::]:80;
        server_name  xxx.xxx.xxcn;   //前台域名
        root         /usr/share/nginx/vue;		//前台位置

        # Load configuration files for the default server block.
        include /etc/nginx/default.d/*.conf;

        error_page 404 /404.html;
        location = /404.html {
        }

        error_page 500 502 503 504 /50x.html;
        location = /50x.html {
        }
    }

server{
   listen 80;
   server_name xxx.xxx.xxx;  //后台域名
   location / {
   proxy_set_header X-Real-IP $remote_addr;
   proxy_set_header Host      $http_host;
   proxy_pass       http://xx.xxx.xx:8080;  //映射到相应的端口号
 }
}

然后启动nginx

systemctl start nginx

最后来到浏览器用所分配的前台域名来访问

发现启动成功,且功能可以正常启动

vue+springboot 部署在服务器使用tomcat+nginx完成

五，为什么vue项目既可以部署在tomcat又可以部署在nginx而后台项目不行

vue其实就是html，它是静态的，而nginx可以运行静态的html，因为nginx本身就是静态资源服务器和反向代理服务器，它支持静态资源的；而后台java代码是动态的，它需要运行在java虚拟机之上，需要支持它运行的web容器，而tomcat是web容器一种，所以将后台代码放入tomcat里面。