Tomcat如何代理多个前端(Vue)项目?
遇到这样一个有趣的事情,由于行里测试服务器有限,需要在一台测试服务器上同时部署多个项目,前端采用Vue进行开发,由于是多个项目,所以代理这些静态文件直接丢到webapp下肯定不可取,采用Nginx也完全没必要,所以打算利用Tomcat对这些Vue项目进行代理,那具体如何操作呢?我们说一下项目环境,后端暂定2个项目,都是SpringBoot开发,一个项目跟路径为ybt,启用8080端口,一个项目跟路
遇到这样一个有趣的事情,由于行里测试服务器有限,需要在一台测试服务器上同时部署多个项目,前端采用Vue进行开发,由于是多个项目,所以代理这些静态文件直接丢到webapp下肯定不可取,采用Nginx也完全没必要,所以打算利用Tomcat对这些Vue项目进行代理,那具体如何操作呢?
我们说一下项目环境,后端暂定2个项目,都是SpringBoot开发,一个项目跟路径为ybt,启用8080端口,一个项目跟路径为mzt,启用8081端口,Tomcat代理vue项目采用7070端口,那么,前端大致的路由映射为:
<第1个Vue项目>
baseUrl: {
dev: 'http://128.1.136.133:8080/ybt',
pro: 'http://70.0.192.107:8080/ybt'
},
<第2个Vue项目>
baseUrl: {
dev: 'http://128.1.136.133:8081/mzt',
pro: 'http://70.0.192.107:8081/mzt'
},
好了,那现在Tomcat如何代理监听7070端口以实现两个Vue项目都可以在这一台测试服务器上进行访问呢?
假若tomcat安装目录为:/home/web/tomcat/apache-tomcat-8.5.42
第一个Vue项目(编译好的dist目录)放置路径为:/home/web/ybt
第二个Vue项目(编译好的dist目录)放置路径为:/home/web/mzt
接下来,我们打开tomcat的配置文件/home/web/tomcat/apache-tomcat-8.5.42/conf/server.xml,修改默认监听端口8080为7070,如:
<Connector port="7070" protocol="HTTP/1.1"
connectionTimeout="20000"
redirectPort="8443" />
随后,修改host处配置,增加两个<Context />配置如下:
<Host name="localhost" appBase="webapps"
unpackWARs="true" autoDeploy="true">
<!-- SingleSignOn valve, share authentication between web applications
Documentation at: /docs/config/valve.html -->
<!--
<Valve className="org.apache.catalina.authenticator.SingleSignOn" />
-->
<!-- Access log processes all example.
Documentation at: /docs/config/valve.html
Note: The pattern used is equivalent to using pattern="common" -->
<Valve className="org.apache.catalina.valves.AccessLogValve" directory="logs"
prefix="localhost_access_log" suffix=".txt"
pattern="%h %l %u %t "%r" %s %b" />
<Context path="/ybt" docBase="/home/web/ybt/dist" reloadable="true" />
<Context path="/mzt" docBase="/home/web/mzt/dist" reloadable="true" />
</Host>
配置完毕,启动Tomcat,访问如下路径:
128.1.136.133:7070/ybt
128.1.136.133:7070/mzt
这样,两个项目的静态页面都可以访问了,顺便说下Tomcat配置文件的分层,由外向里分别是:Server->Service->Engine->Host->Context:
Context: 一个Context对一个Web应用程序
Host:一个Host用于定义一个虚拟主机
Engine:一组虚拟主机的集合
Service:一组Engine的集合,包括线程池Executor和连接器Connector的定义
更多推荐
所有评论(0)