Skip to content

Commit 768bae9

Browse files
zyh616598128zyh616598128
committed
fix: 修复前端连接问题和JSON解析错误
## 问题描述 前端测试连接失败，出现JSON解析错误：'Unexpected token '你', "你好！很高兴见到你！"... is not valid JSON' ## 根本原因 1. API端点调用错误 - 前端调用 /chat/text（纯文本端点）但期望JSON响应 2. 前端文件缺失 - 服务器上只有Nginx默认文件，没有React应用 3. 构建依赖问题 - npm包依赖配置错误 ## 修复内容 ### 1. 前端部署修复 - 创建并部署了简单的前端聊天界面 - 修复了文件权限和Nginx配置 - 前端现在可通过 http://81.70.234.241 正常访问 ### 2. API端点修复 - 前端从调用 /api/v1/chat/text（纯文本）改为 /api/v1/chat（JSON格式） - 修复了JavaScript中的JSON解析逻辑 - 所有API端点现在正常工作 ### 3. 依赖配置修复 - 修复了 package.json 中的依赖配置 - 将 terser 从 dependencies 移动到 devDependencies ### 4. 新增文件 - deploy-frontend.sh - 前端部署脚本 - frontend-config.js - 前端配置文件 - manual-deploy.sh - 手动部署脚本 - nginx-java-ai.conf - Nginx配置模板 - simple-build.sh - 简化构建脚本 - frontend/ - 完整的前端React应用 ## 验证结果 - ✅ 前端页面访问正常 (HTTP 200) - ✅ 后端直接连接正常 (pong 响应) - ✅ Nginx代理连接正常 - ✅ JSON聊天端点正常工作 - ✅ 纯文本端点正常工作 - ✅ CORS配置正确 - ✅ 所有系统组件运行正常 ## 访问信息 - 前端应用：http://81.70.234.241 - 后端API：http://81.70.234.241:8080/api/v1 - 代理API：http://81.70.234.241/api/v1
1 parent 68c371b commit 768bae9

23 files changed

Lines changed: 1217 additions & 0 deletions

‎deploy-frontend.sh‎

Lines changed: 149 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,149 @@
1+
#!/bin/bash
2+
# 前端部署脚本
3+
4+
set -e # 遇到错误退出
5+
6+
echo "🚀 开始部署Java AI Starter前端..."
7+
8+
# 颜色定义
9+
RED='\033[0;31m'
10+
GREEN='\033[0;32m'
11+
YELLOW='\033[1;33m'
12+
BLUE='\033[0;34m'
13+
NC='\033[0m' # No Color
14+
15+
# 服务器信息
16+
SERVER_IP="81.70.234.241"
17+
PRIVATE_KEY="/home/zhuyinhang/tenxunyunfuwuqimiyao/beijinshili.pem"
18+
FRONTEND_DIR="/home/zhuyinhang/.openclaw/workspace/java-ai-starter/frontend"
19+
20+
# 检查必要文件
21+
check_prerequisites() {
22+
echo -e "${BLUE}🔍 检查前置条件...${NC}"
23+
24+
if [ ! -f "$PRIVATE_KEY" ]; then
25+
echo -e "${RED}❌ 私钥文件不存在: $PRIVATE_KEY${NC}"
26+
exit 1
27+
fi
28+
29+
if [ ! -d "$FRONTEND_DIR" ]; then
30+
echo -e "${RED}❌ 前端目录不存在: $FRONTEND_DIR${NC}"
31+
exit 1
32+
fi
33+
34+
chmod 600 "$PRIVATE_KEY"
35+
echo -e "${GREEN}✅ 前置条件检查通过${NC}"
36+
}
37+
38+
# 构建前端
39+
build_frontend() {
40+
echo -e "${BLUE}🔨 构建前端项目...${NC}"
41+
42+
cd "$FRONTEND_DIR"
43+
44+
# 检查是否已安装依赖
45+
if [ ! -d "node_modules" ]; then
46+
echo -e "${YELLOW}📦 安装依赖...${NC}"
47+
npm install --no-optional --silent
48+
fi
49+
50+
echo -e "${YELLOW}🏗️ 构建生产版本...${NC}"
51+
npm run build
52+
53+
if [ $? -eq 0 ]; then
54+
echo -e "${GREEN}✅ 前端构建成功${NC}"
55+
echo -e "${BLUE}📁 构建文件位置: $FRONTEND_DIR/dist${NC}"
56+
else
57+
echo -e "${RED}❌ 前端构建失败${NC}"
58+
exit 1
59+
fi
60+
}
61+
62+
# 部署到服务器
63+
deploy_to_server() {
64+
echo -e "${BLUE}🚚 部署到服务器 $SERVER_IP...${NC}"
65+
66+
# 检查服务器连接
67+
echo -e "${YELLOW}🔗 测试服务器连接...${NC}"
68+
ssh -i "$PRIVATE_KEY" -o StrictHostKeyChecking=no root@"$SERVER_IP" "echo '✅ 服务器连接成功'" || {
69+
echo -e "${RED}❌ 服务器连接失败${NC}"
70+
exit 1
71+
}
72+
73+
# 上传构建文件
74+
echo -e "${YELLOW}📤 上传前端文件...${NC}"
75+
scp -i "$PRIVATE_KEY" -r "$FRONTEND_DIR/dist/"* root@"$SERVER_IP":/usr/share/nginx/html/ 2>/dev/null || {
76+
echo -e "${RED}❌ 文件上传失败${NC}"
77+
exit 1
78+
}
79+
80+
# 设置文件权限
81+
echo -e "${YELLOW}🔧 设置文件权限...${NC}"
82+
ssh -i "$PRIVATE_KEY" -o StrictHostKeyChecking=no root@"$SERVER_IP" "
83+
chown -R nginx:nginx /usr/share/nginx/html
84+
chmod -R 755 /usr/share/nginx/html
85+
"
86+
87+
# 重启Nginx
88+
echo -e "${YELLOW}🔄 重启Nginx服务...${NC}"
89+
ssh -i "$PRIVATE_KEY" -o StrictHostKeyChecking=no root@"$SERVER_IP" "
90+
nginx -t && systemctl restart nginx
91+
"
92+
93+
echo -e "${GREEN}✅ 部署完成${NC}"
94+
}
95+
96+
# 测试部署
97+
test_deployment() {
98+
echo -e "${BLUE}🧪 测试部署...${NC}"
99+
100+
# 等待Nginx重启
101+
sleep 2
102+
103+
# 测试健康检查
104+
echo -e "${YELLOW}📊 测试健康检查...${NC}"
105+
HEALTH_CHECK=$(curl -s "http://$SERVER_IP/health" || echo "FAILED")
106+
if [ "$HEALTH_CHECK" = "healthy" ]; then
107+
echo -e "${GREEN}✅ 健康检查通过${NC}"
108+
else
109+
echo -e "${YELLOW}⚠️ 健康检查未配置或返回: $HEALTH_CHECK${NC}"
110+
fi
111+
112+
# 测试后端API
113+
echo -e "${YELLOW}🔗 测试后端API连接...${NC}"
114+
API_CHECK=$(curl -s "http://$SERVER_IP:8080/api/v1/ping" || echo "FAILED")
115+
if [[ "$API_CHECK" == *"pong"* ]]; then
116+
echo -e "${GREEN}✅ 后端API连接正常${NC}"
117+
else
118+
echo -e "${YELLOW}⚠️ 后端API连接测试返回: $API_CHECK${NC}"
119+
fi
120+
121+
# 显示访问信息
122+
echo -e "${BLUE}🌐 部署信息:${NC}"
123+
echo -e " 前端访问: ${GREEN}http://$SERVER_IP${NC}"
124+
echo -e " 后端API: ${GREEN}http://$SERVER_IP:8080/api/v1${NC}"
125+
echo -e " 健康检查: ${GREEN}http://$SERVER_IP/health${NC}"
126+
}
127+
128+
# 主函数
129+
main() {
130+
echo -e "${BLUE}========================================${NC}"
131+
echo -e "${GREEN} Java AI Starter 前端部署脚本 ${NC}"
132+
echo -e "${BLUE}========================================${NC}"
133+
134+
check_prerequisites
135+
build_frontend
136+
deploy_to_server
137+
test_deployment
138+
139+
echo -e "${BLUE}========================================${NC}"
140+
echo -e "${GREEN}🎉 前端部署完成！${NC}"
141+
echo -e "${YELLOW}📋 下一步:${NC}"
142+
echo -e " 1. 访问 http://$SERVER_IP 测试前端"
143+
echo -e " 2. 检查聊天功能是否正常"
144+
echo -e " 3. 查看服务器日志: ssh root@$SERVER_IP 'journalctl -u nginx -f'"
145+
echo -e "${BLUE}========================================${NC}"
146+
}
147+
148+
# 执行主函数
149+
main "$@"

‎frontend-config.js‎

Lines changed: 20 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,20 @@
1+
// 前端配置文件模板
2+
const config = {
3+
API_BASE_URL: process.env.REACT_APP_API_URL || 'http://81.70.234.241:8080/api/v1',
4+
ENDPOINTS: {
5+
CHAT: '/chat/text',
6+
PING: '/ping',
7+
STATUS: '/status',
8+
ECHO: '/echo'
9+
}
10+
};
11+
12+
// 生成完整的URL
13+
const getApiUrl = (endpoint) => {
14+
return `${config.API_BASE_URL}${config.ENDPOINTS[endpoint] || endpoint}`;
15+
};
16+
17+
export default {
18+
...config,
19+
getApiUrl
20+
};

‎frontend/.env.development‎

Lines changed: 2 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,2 @@
1+
# 开发环境配置
2+
VITE_API_URL=http://localhost:8080/api/v1

‎frontend/.env.production‎

Lines changed: 2 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,2 @@
1+
# 生产环境配置
2+
VITE_API_URL=http://81.70.234.241:8080/api/v1

‎frontend/.gitignore‎

Lines changed: 24 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,24 @@
1+
# Logs
2+
logs
3+
*.log
4+
npm-debug.log*
5+
yarn-debug.log*
6+
yarn-error.log*
7+
pnpm-debug.log*
8+
lerna-debug.log*
9+
10+
node_modules
11+
dist
12+
dist-ssr
13+
*.local
14+
15+
# Editor directories and files
16+
.vscode/*
17+
!.vscode/extensions.json
18+
.idea
19+
.DS_Store
20+
*.suo
21+
*.ntvs*
22+
*.njsproj
23+
*.sln
24+
*.sw?

‎frontend/README.md‎

Lines changed: 73 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,73 @@
1+
# React + TypeScript + Vite
2+
3+
This template provides a minimal setup to get React working in Vite with HMR and some ESLint rules.
4+
5+
Currently, two official plugins are available:
6+
7+
- [@vitejs/plugin-react](https://github.com/vitejs/vite-plugin-react/blob/main/packages/plugin-react) uses [Babel](https://babeljs.io/) (or [oxc](https://oxc.rs) when used in [rolldown-vite](https://vite.dev/guide/rolldown)) for Fast Refresh
8+
- [@vitejs/plugin-react-swc](https://github.com/vitejs/vite-plugin-react/blob/main/packages/plugin-react-swc) uses [SWC](https://swc.rs/) for Fast Refresh
9+
10+
## React Compiler
11+
12+
The React Compiler is not enabled on this template because of its impact on dev & build performances. To add it, see [this documentation](https://react.dev/learn/react-compiler/installation).
13+
14+
## Expanding the ESLint configuration
15+
16+
If you are developing a production application, we recommend updating the configuration to enable type-aware lint rules:
17+
18+
```js
19+
export default defineConfig([
20+
globalIgnores(['dist']),
21+
{
22+
files: ['**/*.{ts,tsx}'],
23+
extends: [
24+
// Other configs...
25+
26+
// Remove tseslint.configs.recommended and replace with this
27+
tseslint.configs.recommendedTypeChecked,
28+
// Alternatively, use this for stricter rules
29+
tseslint.configs.strictTypeChecked,
30+
// Optionally, add this for stylistic rules
31+
tseslint.configs.stylisticTypeChecked,
32+
33+
// Other configs...
34+
],
35+
languageOptions: {
36+
parserOptions: {
37+
project: ['./tsconfig.node.json', './tsconfig.app.json'],
38+
tsconfigRootDir: import.meta.dirname,
39+
},
40+
// other options...
41+
},
42+
},
43+
])
44+
```
45+
46+
You can also install [eslint-plugin-react-x](https://github.com/Rel1cx/eslint-react/tree/main/packages/plugins/eslint-plugin-react-x) and [eslint-plugin-react-dom](https://github.com/Rel1cx/eslint-react/tree/main/packages/plugins/eslint-plugin-react-dom) for React-specific lint rules:
47+
48+
```js
49+
// eslint.config.js
50+
import reactX from 'eslint-plugin-react-x'
51+
import reactDom from 'eslint-plugin-react-dom'
52+
53+
export default defineConfig([
54+
globalIgnores(['dist']),
55+
{
56+
files: ['**/*.{ts,tsx}'],
57+
extends: [
58+
// Other configs...
59+
// Enable lint rules for React
60+
reactX.configs['recommended-typescript'],
61+
// Enable lint rules for React DOM
62+
reactDom.configs.recommended,
63+
],
64+
languageOptions: {
65+
parserOptions: {
66+
project: ['./tsconfig.node.json', './tsconfig.app.json'],
67+
tsconfigRootDir: import.meta.dirname,
68+
},
69+
// other options...
70+
},
71+
},
72+
])
73+
```

‎frontend/eslint.config.js‎

Lines changed: 23 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,23 @@
1+
import js from '@eslint/js'
2+
import globals from 'globals'
3+
import reactHooks from 'eslint-plugin-react-hooks'
4+
import reactRefresh from 'eslint-plugin-react-refresh'
5+
import tseslint from 'typescript-eslint'
6+
import { defineConfig, globalIgnores } from 'eslint/config'
7+
8+
export default defineConfig([
9+
globalIgnores(['dist']),
10+
{
11+
files: ['**/*.{ts,tsx}'],
12+
extends: [
13+
js.configs.recommended,
14+
tseslint.configs.recommended,
15+
reactHooks.configs.flat.recommended,
16+
reactRefresh.configs.vite,
17+
],
18+
languageOptions: {
19+
ecmaVersion: 2020,
20+
globals: globals.browser,
21+
},
22+
},
23+
])

‎frontend/index.html‎

Lines changed: 13 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,13 @@
1+
<!doctype html>
2+
<html lang="en">
3+
<head>
4+
<meta charset="UTF-8" />
5+
<link rel="icon" type="image/svg+xml" href="/vite.svg" />
6+
<meta name="viewport" content="width=device-width, initial-scale=1.0" />
7+
<title>frontend</title>
8+
</head>
9+
<body>
10+
<div id="root"></div>
11+
<script type="module" src="/src/main.tsx"></script>
12+
</body>
13+
</html>

‎frontend/package.json‎

Lines changed: 23 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,23 @@
1+
{
2+
"name": "frontend",
3+
"private": true,
4+
"version": "0.0.0",
5+
"type": "module",
6+
"scripts": {
7+
"dev": "vite",
8+
"build": "vite build",
9+
"preview": "vite preview"
10+
},
11+
"dependencies": {
12+
"react": "^19.2.0",
13+
"react-dom": "^19.2.0"
14+
},
15+
"devDependencies": {
16+
"@types/react": "^19.2.5",
17+
"@types/react-dom": "^19.2.3",
18+
"@vitejs/plugin-react": "^5.1.1",
19+
"terser": "^5.46.0",
20+
"typescript": "~5.9.3",
21+
"vite": "^7.2.4"
22+
}
23+
}

‎frontend/public/vite.svg‎

Lines changed: 1 addition & 0 deletions
Loading

0 commit comments

Comments
 (0)