测试平台部署到Linux系统Docker
|
在本地启了个Node服务器，后端在本地启了个Django服务器，分别使用8080和8000端口。浏览器有个同源策略：域名、端口、协议三者一致才能进行访问，否则会由于跨域访问而被浏览器拦截。图中前后端的端口不一致，出现了跨域，前端是无法直接请求后端的。解决办法是在vue.config.js中配置devServer：是Node开的一个代理服务器，当前端请求后端时，会先发向Node代理服务器，Node代理服务器以相同的参数向真正的后端服务器进行请求，再把响应返回给前端。在本项目中，前端请求仍然是发给http://127.0.0.1:8080，浏览器不会拦截，Node代理服务器会帮你把请求转发给后端8000端口。
Nginx部署 搞懂了本地运行代理转发，再来看看Nginx部署。Nginx本身是个服务器，就像Node服务器一样，也可以看做Apache Tomcat。Vue项目使用npm run build命令把代码构建为dist目录静态文件，放到Nginx服务器中加载出来，结合Docker示意图如下：对/路径来说，Nginx会监听80端口，三：对/api路径来说，Nginx会把请求转发到后端服务器端口，这也叫做反向代理。后端没有什么变化，为了和本地运行看着有点区别，把端口稍微改了下，Docker内部使用80端口。 这里比较关键的是理解Docker teprunner-frontend、Docker teprunner-backend、Linux三者之间的关系。如果不知道Docker，那么应该听说过虚拟机，Docker从概念上理解就像是虚拟机，这三者可以看做是三台主机。Linux的IP是172.16.25.131，80端口映射到了Docker teprunner-frontend的80端口，8099端口映射到了Docker teprunner-backend的80端口，如图中下方双向箭头所示。在Linux上访问http://127.0.0.1，能打开登录页面，但是无法向后端发起请求，因为从80端口直接请求8099端口，跨域了。解决办法是在Docker teprunner-frontend借助Nginx进行反向代理，把请求先发送到Nginx服务器，再转发给Linux的8099端口。
不能在Docker teprunner-frontend中把/api的代理设置为http://127.0.0.1:8099，因为这个Docker容器的8099端口并没有启用，启用的是Linux这台机器上的8099端口，所以需要通过IP来指定。 （编辑：莆田站长网） 【声明】本站内容均来自网络，其相关言论仅代表作者个人观点，不代表本站立场。若无意侵犯到您的权利，请及时与联系站长删除相关内容! |
