jeecg 微服务获取数据字典 jeecg部署到服务器上_Apache

使用 Apache Tomcat 作为 Web 服务器部署 jeecgboot-vue3(V3.4.4) 项目

一、项目构建配置

1、配置 .env.production 文件中发布路径（部署到非根目录时需要修改）和服务接口地址

# 发布路径
VITE_PUBLIC_PATH = /my-app
#后台接口全路径地址(必填)
VITE_GLOB_DOMAIN_URL=http://localhost:8080/jeecg-boot

2、将 history 路由模式改为 hash 路由模式：修改 src/router/index.ts 文件中代码

// app router
export const router = createRouter({
  // history: createWebHistory(import.meta.env.VITE_PUBLIC_PATH),
  history: createWebHashHistory(import.meta.env.VITE_PUBLIC_PATH),
  routes: basicRoutes as unknown as RouteRecordRaw[],
  strict: true,
  scrollBehavior: () => ({ left: 0, top: 0 }),
});

改为 hash 路由模式是由于 history 模式下页面刷新后页面报 404 错误，表面原因，有待进一步研究深层原因。

二、Apache Tomcat

经实践，Apache Tomcat 对请求的代理转发功能有限（无法配置对特定 URIs 请求的转发，如：http://domain:port/api/），无法实现对 Vue/ React/ Angular 前端项目的部署。如果要扩展 Apache Tomcat 的代理转发功能，需要 Apache httpd 的 mod_proxy 模块 支持。

使用 Apache Tomcat 作为服务器部署Vue项目步骤如下：

  1. 准备工作：确保已经安装了 Apache Tomcat，并且知道其安装路径。
  2. 构建 Vue 项目：在项目根目录中执行 npm run build 命令以构建项目。构建完成后，会在项目根目录中生成一个 "dist" 目录，其中包含了所有的静态文件。
  3. 将 "dist" 目录复制到 Apache Tomcat 的 webapps 目录中：例如，如果 Apache Tomcat 安装在 "C:\Tomcat" 中，则可以将 "dist" 目录复制到 "C:\Tomcat\webapps" 中。
  4. 重命名 "dist" 目录：将 "dist" 目录重命名为想要的名称，例如 "my-app"。
  5. 代理转发配置：修改 Apache Tomcat 的配置文件，打开 "C:\Tomcat\conf\server.xml" 文件，并在其中添加以下内容： 
<Connector port="8080" protocol="HTTP/1.1"
          connectionTimeout="20000"
          redirectPort="8443"
          proxyName="localhost"
          proxyPort="<PROXY_PORT>"
          />

其中，"<PROXY_PORT>" 是您的后端 API 服务器所在主机的端口号。

  1. 启动 Apache Tomcat：运行 Apache Tomcat 安装目录中的 "bin/startup.bat" 文件以启动 Apache Tomcat。
  2. 访问 Vue 应用程序：在浏览器中访问 "http://localhost:8080/my-app"（其中 "my-app" 是在第 4 步中命名的名称），应该就可以看到 Vue 应用程序。

注意：以上内容假设使用的是 Tomcat 的默认端口8080。如果使用了其他端口，请相应地更改浏览器访问地址。

二、将 Java 后端和前端同时部署在 Apache Tomcat 上

在 Apache Tomcat 上将 Java 后端和前端分离的系统同时部署，主要分为以下步骤：

  1. 构建后端项目：在后端项目中，我们需要通过使用 Java 技术（如 Spring、Spring Boot）来开发 RESTful API 接口，用于与前端系统进行通信。
  2. 部署后端项目：将后端项目打包为 WAR 包，并将其部署到 Apache Tomcat 上。
  3. 构建前端项目：在前端项目中，我们需要通过使用 JavaScript 技术（如 Vue.js、React）来开发前端界面和相关的逻辑处理。
  4. 部署前端项目：将前端项目的所有静态文件（HTML、CSS、JavaScript 等）打包为一个单独的文件夹，并将该文件夹部署到 Apache Tomcat 的 webapps 目录下。
  5. 设置路由：通过设置 Apache Tomcat 的路由规则，将前端项目中的请求代理到后端项目。

以上步骤是将 Java 后端和前端分离的系统同时部署在 Apache Tomcat 上的基本步骤，根据实际需求，可以进行相应的扩展和调整。