使用Nginx +Tomcat 前后端分离部署Vue.js +Java Web

最新推荐文章于 2024-01-25 16:43:12 发布

原创

最新推荐文章于 2024-01-25 16:43:12 发布 · 9.2k 阅读

标签

#nginx #vue.js #tomcat

收录于

本文介绍了如何在Nginx上部署Vue.js前端和Tomcat上部署Java Web后端，实现前后端分离。重点处理了登录验证、请求跨域和文件上传等问题。通过在Nginx中配置路由转发，解决Vue.js的History模式与后端API的交互，并利用Filter处理跨域请求。同时，文章提到了在实际部署中可能遇到的文件上传超时和大小限制等挑战。

项目结构

nginx 部署Vue.js前端
Tomcat 部署Java Web

部署思路

vue.js 源码rpm build 后放nginx服务所在机器，配置好nginx静态网站路径
Tomcat 部署对应的Java ee web应用后端
nginx进行前端访问后端时的路由转发，替代在vue.js开发时dev模式的nodejs转发作用

需要处理的问题

登录验证

后端为Java应用，所以后端采用HttpComponents Client模拟登录的方式

在前端发起的登录请求逻辑里进行模拟登录，之后将JSESSIONID cookie设置到前端登录后的响应response中

客户端浏览器拥有这个seesion id，再次访问后端服务的时候就能验证通过了

   final String login = "这里放实际登录请求地址";
        final HttpUriRequest post = RequestBuilder.post(login).addParameter("username", vo.getUserName()).addParameter("password", vo.getPassword()).addParameter("checkCode", "11").build();
        try (final CloseableHttpClient client = HttpClients.custom().build()) {
            CloseableHttpResponse mockResp = clien