117 lines
3.3 KiB
Markdown
117 lines
3.3 KiB
Markdown
# Tomcat 部署配置说明
|
||
|
||
## 问题原因
|
||
Vue Router 使用 history 模式，刷新页面时 Tomcat 会尝试查找对应的物理路径，导致 404 错误。
|
||
|
||
## 解决方案
|
||
|
||
### 方案一：配置 Tomcat rewrite 规则（推荐）
|
||
|
||
1. **下载 rewrite.jar**
|
||
- 下载 Tomcat rewrite 模块：https://tomcat.apache.org/download-90.cgi
|
||
- 将 `rewrite.jar` 放到 `$CATALINA_HOME/lib` 目录
|
||
|
||
2. **创建 WEB-INF/rewrite.config**
|
||
在 `wdk/WEB-INF/` 目录下创建 `rewrite.config` 文件，内容如下：
|
||
```
|
||
# 所有非文件请求都转发到 index.html
|
||
RewriteCond %{REQUEST_FILENAME} !-f
|
||
RewriteCond %{REQUEST_FILENAME} !-d
|
||
RewriteRule ^.*$ /wdk/index.html [L]
|
||
```
|
||
|
||
3. **修改 WEB-INF/web.xml**
|
||
在 `wdk/WEB-INF/web.xml` 中添加 rewrite 过滤器：
|
||
```xml
|
||
<?xml version="1.0" encoding="UTF-8"?>
|
||
<web-app xmlns="http://xmlns.jcp.org/xml/ns/javaee"
|
||
xmlns:xsi="http://www.w3.org/2001/XMLSchema-instance"
|
||
xsi:schemaLocation="http://xmlns.jcp.org/xml/ns/javaee
|
||
http://xmlns.jcp.org/xml/ns/javaee/web-app_4_0.xsd"
|
||
version="4.0">
|
||
|
||
<display-name>Yun3v2 Application</display-name>
|
||
|
||
<!-- Rewrite Filter -->
|
||
<filter>
|
||
<filter-name>rewriteFilter</filter-name>
|
||
<filter-class>org.apache.rewrite.RewriteFilter</filter-class>
|
||
</filter>
|
||
<filter-mapping>
|
||
<filter-name>rewriteFilter</filter-name>
|
||
<url-pattern>/*</url-pattern>
|
||
</filter-mapping>
|
||
|
||
<!-- Welcome File -->
|
||
<welcome-file-list>
|
||
<welcome-file>index.html</welcome-file>
|
||
</welcome-file-list>
|
||
</web-app>
|
||
```
|
||
|
||
### 方案二：使用 hash 模式（简单但 URL 不美观）
|
||
|
||
修改 `src/router/index.js`：
|
||
```javascript
|
||
import { createRouter, createWebHashHistory } from 'vue-router'
|
||
|
||
const router = createRouter({
|
||
history: createWebHashHistory(), // 使用 hash 模式
|
||
routes
|
||
})
|
||
```
|
||
|
||
这样 URL 会变成：`http://localhost:8080/wdk/#/home`
|
||
|
||
### 方案三：配置 Tomcat 全局 error-page
|
||
|
||
在 `wdk/WEB-INF/web.xml` 中添加：
|
||
```xml
|
||
<?xml version="1.0" encoding="UTF-8"?>
|
||
<web-app xmlns="http://xmlns.jcp.org/xml/ns/javaee"
|
||
xmlns:xsi="http://www.w3.org/2001/XMLSchema-instance"
|
||
xsi:schemaLocation="http://xmlns.jcp.org/xml/ns/javaee
|
||
http://xmlns.jcp.org/xml/ns/javaee/web-app_4_0.xsd"
|
||
version="4.0">
|
||
|
||
<display-name>Yun3v2 Application</display-name>
|
||
|
||
<!-- 404 错误页面重定向到 index.html -->
|
||
<error-page>
|
||
<error-code>404</error-code>
|
||
<location>/index.html</location>
|
||
</error-page>
|
||
|
||
<!-- Welcome File -->
|
||
<welcome-file-list>
|
||
<welcome-file>index.html</welcome-file>
|
||
</welcome-file-list>
|
||
</web-app>
|
||
```
|
||
|
||
## 部署步骤
|
||
|
||
1. **重新构建项目**
|
||
```bash
|
||
npm run build
|
||
```
|
||
|
||
2. **复制文件到 Tomcat**
|
||
```
|
||
dist/ → tomcat/webapps/wdk/
|
||
```
|
||
|
||
3. **创建 WEB-INF 目录和配置文件**
|
||
```
|
||
tomcat/webapps/wdk/WEB-INF/
|
||
├── web.xml
|
||
└── rewrite.config (如果使用方案一)
|
||
```
|
||
|
||
4. **重启 Tomcat**
|
||
|
||
## 推荐方案
|
||
- **生产环境**：使用方案一（rewrite 规则）
|
||
- **快速测试**：使用方案三（error-page）
|
||
- **内网简单部署**：使用方案二（hash 模式）
|