JeecgBoot 前端部署三层 Nginx 实战配置【免费下载链接】jeecg-boot【低代码v2.0一句话即可生成整个系统】企业级AI低代码平台一键生成前后端代码甚至整个系统。 AI Skills 一句话画流程、设计表单、生成报表、大屏。内置 AI应用平台涵盖AI聊天、知识库、流程编排、MCP插件等兼容主流大模型。引领AI低代码「Skills 生成 → 在线配置 → 代码生成 → 手工合并-AI修改」开发模式解决 Java 项目 90% 重复工作提高效率又不失灵活。项目地址: https://gitcode.com/GitHub_Trending/je/jeecg-bootJeecgBoot 前端部署的核心问题是一份 Nginx 配置怎么写API 代理、history 路由兜底、静态资源交付这篇按层拆解生产里跑通的配置可以直接照抄。第一层请求路由 —— 代理与 404 兜底上线后前后端拆成两个服务浏览器只看到 Nginx 的 80 端口所有流量在这里分流。请求只有两种带/jeecgboot/前缀的走后端其余是页面或静态文件。所以路由层只需要两个 location 块。API 前缀的 Nginx 反向代理代理要解决的不只是转发。后端 context-path 是/jeecg-boot前端统一用/jeecgboot发请求两者差异必须靠 rewrite 补齐proxy_set_header三行负责把真实客户端 IP 传给后端日志和网关限流才拿得到原始地址upstream 写成变量并配合 Docker 内置 DNS 解析器是防后端容器重启换 IP 后 Nginx 还缓存旧地址、直接 502官方jeecgboot-vue3/Dockerfile里就是这么处理的。# Docker 内置 DNS动态解析后端容器地址 resolver 127.0.0.11 valid10s ipv6off; location /jeecgboot/ { set $jeecg_system jeecg-boot-system; rewrite ^/jeecgboot/?(.*)$ /jeecg-boot/$1 break; proxy_pass http://$jeecg_system:8080; proxy_redirect off; proxy_set_header Host jeecg-boot-system; proxy_set_header X-Real-IP $remote_addr; proxy_set_header X-Forwarded-For $proxy_add_x_forwarded_for; }Vue3 history 路由的兜底写法前端路由是 history 模式浏览器里刷新/system/user服务器上并没有这个文件Nginx 不接住就是 404。兜底逻辑是判断文件是否存在不存在就返回index.html交给 Vue Router 解析?s$1把原路径保留在查询串里依赖 query 参数的页面不会读丢值。这是 Vue3 history 路由与 Nginx 兼容的标准解法判据用!-e而不是按扩展名匹配否则新增的静态文件类型容易漏。location / { root /var/www/html/; index index.html index.htm; if (!-e $request_filename) { rewrite ^(.*)$ /index.html?s$1 last; break; } }一个请求在这套配置里只经过一次分叉无论落到哪个分支后续请求都会再经过这两个 location规则是稳定的排查问题只需要看前缀匹配对不对。用 Docker Compose 交付整套配置先构建再镜像构建输出由vite.config.ts控制Dockerfile把 dist 拷进/var/www/htmlNginx 配置同镜像写入宿主机不用单独维护 Nginxcd jeecgboot-vue3 npm run build docker-compose up -d jeecg-vue第二层资源交付 —— 缓存、压缩与预加载路由层决定能不能到交付层决定到得多快。Vite 构建产物的 js/css 文件名都带内容 hash这是后面所有缓存决策的前提也是 JeecgBoot 性能优化的主战场。带 hash 资源长缓存、index.html 不缓存带 hash 的资源文件名随内容变化命中缓存即命中新版本给一年没问题唯一不带 hash 的入口是index.html反而必须禁用缓存否则发版后旧入口指向已删除的资源页面直接白屏收尾部分有对应踩坑。location ~* \.(js|css|png|jpg|jpeg|gif|svg|ico|woff2?)$ { root /var/www/html/; expires 1y; add_header Cache-Control public; } location /index.html { add_header Cache-Control no-cache; }Gzip 压缩参数页面流量大头是 js/css/json 这类文本压缩率通常在 70%~80%一个 500KB 的包落到线上约 120KB。级别取 5 是 CPU 与效果的平衡点打开gzip_vary让缓存层按 Accept-Encoding 区分避免同一文件压缩版与原始版混存造成脏缓存。gzip on; gzip_min_length 1k; gzip_comp_level 5; gzip_vary on; gzip_types text/plain text/css application/json application/javascript text/xml application/xml image/svgxml;首屏预加载什么时候该配常见做法是在index.html里硬编码link relpreload。Vite 项目里这个手法容易翻车资源名带 hash、每次构建都变写死的路径发一次版就 404。而且入口 js 本来就在关键路径上preload 只对非入口资源有意义。建议不手写 preload把首屏体验寄托在前一节的 hash 长缓存上二次访问的收益更实在。第三层连接与安全 —— keepalive、防盗链、HTTPSkeepalive 连接参数一个 SPA 页面会触发几十次 XHR每次都重新建 TCP 连接的手shake开销不划算。空闲 65 秒与 SPA 停留时长匹配单连接请求上限放宽到 1000让一次会话基本复用一条连接同时仍限制单连接的滥用窗口。keepalive_timeout 65; keepalive_requests 1000;防盗链及什么时候别配对图片类资源按 referer 校验非本域请求直接 403location ~* \.(png|jpg|jpeg|gif|svg)$ { valid_referers none blocked server_names ~*\.yourdomain\.com$; if ($invalid_referer) { return 403; } }⚠️ 只在纯图片资源域名上开。JeecgBoot 支持作为 qiankun 子应用或 iframe 嵌入referer 校验会拦掉父应用的正常流量站点主域与主站共用时建议直接跳过这段。HTTPS 与 HSTS生产环境建议用 Lets Encrypt 申请证书Nginx 监听 443 并强制 80 跳转证书稳定后加Strict-Transport-Security响应头防降级攻击。若前端后端不同域部署记得后端放行跨域凭据而按同域代理方案部署时这类问题天然不存在。部署后最容易翻车的 3 件事后端重启后 502Nginx 缓存了旧容器 IP配置里必须有resolver 127.0.0.11 valid10s官方 Dockerfile 已带自写配置别漏这一行。发版后白屏浏览器里缓存的旧index.html引用了已 404 的 hash 资源index.html 必须no-cache每次发版前确认这条规则生效。API 前缀不一致前端接口前缀在构建期写入与 Nginx location 前缀对不上就全是 404两处统一为/jeecgboot/改完用一个登录请求验证。【免费下载链接】jeecg-boot【低代码v2.0一句话即可生成整个系统】企业级AI低代码平台一键生成前后端代码甚至整个系统。 AI Skills 一句话画流程、设计表单、生成报表、大屏。内置 AI应用平台涵盖AI聊天、知识库、流程编排、MCP插件等兼容主流大模型。引领AI低代码「Skills 生成 → 在线配置 → 代码生成 → 手工合并-AI修改」开发模式解决 Java 项目 90% 重复工作提高效率又不失灵活。项目地址: https://gitcode.com/GitHub_Trending/je/jeecg-boot创作声明：本文部分内容由AI辅助生成（AIGC），仅供参考 
长河君 · 2026/8/31 8:49:32 · 阅读 1.2k JeecgBoot 前端部署：三层 Nginx 实战配置
JeecgBoot 前端部署三层 Nginx 实战配置【免费下载链接】jeecg-boot【低代码v2.0一句话即可生成整个系统】企业级AI低代码平台一键生成前后端代码甚至整个系统。 AI Skills 一句话画流程、设计表单、生成报表、大屏。内置 AI应用平台涵盖AI聊天、知识库、流程编排、MCP插件等兼容主流大模型。引领AI低代码「Skills 生成 → 在线配置 → 代码生成 → 手工合并-AI修改」开发模式解决 Java 项目 90% 重复工作提高效率又不失灵活。项目地址: https://gitcode.com/GitHub_Trending/je/jeecg-bootJeecgBoot 前端部署的核心问题是一份 Nginx 配置怎么写API 代理、history 路由兜底、静态资源交付这篇按层拆解生产里跑通的配置可以直接照抄。第一层请求路由 —— 代理与 404 兜底上线后前后端拆成两个服务浏览器只看到 Nginx 的 80 端口所有流量在这里分流。请求只有两种带/jeecgboot/前缀的走后端其余是页面或静态文件。所以路由层只需要两个 location 块。API 前缀的 Nginx 反向代理代理要解决的不只是转发。后端 context-path 是/jeecg-boot前端统一用/jeecgboot发请求两者差异必须靠 rewrite 补齐proxy_set_header三行负责把真实客户端 IP 传给后端日志和网关限流才拿得到原始地址upstream 写成变量并配合 Docker 内置 DNS 解析器是防后端容器重启换 IP 后 Nginx 还缓存旧地址、直接 502官方jeecgboot-vue3/Dockerfile里就是这么处理的。# Docker 内置 DNS动态解析后端容器地址 resolver 127.0.0.11 valid10s ipv6off; location /jeecgboot/ { set $jeecg_system jeecg-boot-system; rewrite ^/jeecgboot/?(.*)$ /jeecg-boot/$1 break; proxy_pass http://$jeecg_system:8080; proxy_redirect off; proxy_set_header Host jeecg-boot-system; proxy_set_header X-Real-IP $remote_addr; proxy_set_header X-Forwarded-For $proxy_add_x_forwarded_for; }Vue3 history 路由的兜底写法前端路由是 history 模式浏览器里刷新/system/user服务器上并没有这个文件Nginx 不接住就是 404。兜底逻辑是判断文件是否存在不存在就返回index.html交给 Vue Router 解析?s$1把原路径保留在查询串里依赖 query 参数的页面不会读丢值。这是 Vue3 history 路由与 Nginx 兼容的标准解法判据用!-e而不是按扩展名匹配否则新增的静态文件类型容易漏。location / { root /var/www/html/; index index.html index.htm; if (!-e $request_filename) { rewrite ^(.*)$ /index.html?s$1 last; break; } }一个请求在这套配置里只经过一次分叉无论落到哪个分支后续请求都会再经过这两个 location规则是稳定的排查问题只需要看前缀匹配对不对。用 Docker Compose 交付整套配置先构建再镜像构建输出由vite.config.ts控制Dockerfile把 dist 拷进/var/www/htmlNginx 配置同镜像写入宿主机不用单独维护 Nginxcd jeecgboot-vue3 npm run build docker-compose up -d jeecg-vue第二层资源交付 —— 缓存、压缩与预加载路由层决定能不能到交付层决定到得多快。Vite 构建产物的 js/css 文件名都带内容 hash这是后面所有缓存决策的前提也是 JeecgBoot 性能优化的主战场。带 hash 资源长缓存、index.html 不缓存带 hash 的资源文件名随内容变化命中缓存即命中新版本给一年没问题唯一不带 hash 的入口是index.html反而必须禁用缓存否则发版后旧入口指向已删除的资源页面直接白屏收尾部分有对应踩坑。location ~* \.(js|css|png|jpg|jpeg|gif|svg|ico|woff2?)$ { root /var/www/html/; expires 1y; add_header Cache-Control public; } location /index.html { add_header Cache-Control no-cache; }Gzip 压缩参数页面流量大头是 js/css/json 这类文本压缩率通常在 70%~80%一个 500KB 的包落到线上约 120KB。级别取 5 是 CPU 与效果的平衡点打开gzip_vary让缓存层按 Accept-Encoding 区分避免同一文件压缩版与原始版混存造成脏缓存。gzip on; gzip_min_length 1k; gzip_comp_level 5; gzip_vary on; gzip_types text/plain text/css application/json application/javascript text/xml application/xml image/svgxml;首屏预加载什么时候该配常见做法是在index.html里硬编码link relpreload。Vite 项目里这个手法容易翻车资源名带 hash、每次构建都变写死的路径发一次版就 404。而且入口 js 本来就在关键路径上preload 只对非入口资源有意义。建议不手写 preload把首屏体验寄托在前一节的 hash 长缓存上二次访问的收益更实在。第三层连接与安全 —— keepalive、防盗链、HTTPSkeepalive 连接参数一个 SPA 页面会触发几十次 XHR每次都重新建 TCP 连接的手shake开销不划算。空闲 65 秒与 SPA 停留时长匹配单连接请求上限放宽到 1000让一次会话基本复用一条连接同时仍限制单连接的滥用窗口。keepalive_timeout 65; keepalive_requests 1000;防盗链及什么时候别配对图片类资源按 referer 校验非本域请求直接 403location ~* \.(png|jpg|jpeg|gif|svg)$ { valid_referers none blocked server_names ~*\.yourdomain\.com$; if ($invalid_referer) { return 403; } }⚠️ 只在纯图片资源域名上开。JeecgBoot 支持作为 qiankun 子应用或 iframe 嵌入referer 校验会拦掉父应用的正常流量站点主域与主站共用时建议直接跳过这段。HTTPS 与 HSTS生产环境建议用 Lets Encrypt 申请证书Nginx 监听 443 并强制 80 跳转证书稳定后加Strict-Transport-Security响应头防降级攻击。若前端后端不同域部署记得后端放行跨域凭据而按同域代理方案部署时这类问题天然不存在。部署后最容易翻车的 3 件事后端重启后 502Nginx 缓存了旧容器 IP配置里必须有resolver 127.0.0.11 valid10s官方 Dockerfile 已带自写配置别漏这一行。发版后白屏浏览器里缓存的旧index.html引用了已 404 的 hash 资源index.html 必须no-cache每次发版前确认这条规则生效。API 前缀不一致前端接口前缀在构建期写入与 Nginx location 前缀对不上就全是 404两处统一为/jeecgboot/改完用一个登录请求验证。【免费下载链接】jeecg-boot【低代码v2.0一句话即可生成整个系统】企业级AI低代码平台一键生成前后端代码甚至整个系统。 AI Skills 一句话画流程、设计表单、生成报表、大屏。内置 AI应用平台涵盖AI聊天、知识库、流程编排、MCP插件等兼容主流大模型。引领AI低代码「Skills 生成 → 在线配置 → 代码生成 → 手工合并-AI修改」开发模式解决 Java 项目 90% 重复工作提高效率又不失灵活。项目地址: https://gitcode.com/GitHub_Trending/je/jeecg-boot创作声明：本文部分内容由AI辅助生成（AIGC），仅供参考