# 微信小程序连接后端 - 快速配置指南

## 🚀 三步快速配置

### 第一步：启动后端服务

```bash
cd book
mvn spring-boot:run
```

后端服务默认运行在：`http://localhost:8081`

**注意**：当前后端端口是8081，如果修改了请同步修改 `books/utils/config.js` 中的API地址

### 第二步：配置前端API地址

编辑 `books/utils/config.js` 文件：

**开发环境（微信开发者工具）：**
```javascript
return 'http://localhost:8081/api'
```

**真机调试（手机测试）：**
```javascript
// 1. 获取本机IP地址
// Windows: ipconfig
// Mac/Linux: ifconfig

// 2. 修改为你的IP地址（例如：192.168.1.100）
return 'http://192.168.1.100:8081/api'
```

### 第三步：微信开发者工具设置

1. 打开微信开发者工具
2. 点击右上角 **"详情"** 按钮
3. 在 **"本地设置"** 标签页中：
   - ✅ 勾选 **"不校验合法域名、web-view（业务域名）、TLS 版本以及 HTTPS 证书"**

## ✅ 测试登录

### 测试账号

使用以下账号进行测试：

| 用户名 | 密码 | 说明 |
|--------|------|------|
| zhangsan | 123456 | 普通用户 |
| lisi | 123456 | VIP用户 |
| wangwu | 123456 | 普通用户 |

### 测试步骤

1. 在微信开发者工具中打开项目
2. 进入登录页面（`pages/login/login.vue`）
3. 输入用户名：`zhangsan`
4. 输入密码：`123456`
5. 点击"登录"按钮
6. 查看是否成功登录

## 🔧 常见问题快速解决

### ❌ 问题1：网络请求失败

**解决方法**：
- 检查后端服务是否启动（访问 http://localhost:8081 查看）
- 检查 `books/utils/config.js` 中的端口是否正确
- 检查后端 `application.properties` 中的端口配置

### ❌ 问题2：域名校验错误

**解决方法**：
- 确保在微信开发者工具中勾选了"不校验合法域名"
- 检查 `books/manifest.json` 中 `urlCheck` 是否为 `false`

### ❌ 问题3：真机无法连接

**解决方法**：
- 必须使用IP地址，不能使用 `localhost`
- 确保手机和电脑在同一WiFi网络
- 在手机浏览器中测试能否访问：`http://你的IP:8081`

## 📝 文件说明

- `books/utils/config.js` - **API配置文件（需要修改这里）**
- `books/utils/api.js` - API请求封装（已配置好）
- `books/pages/login/login.vue` - 登录页面（已连接后端）
- `books/manifest.json` - 小程序配置（已配置urlCheck）

## 🎯 验证配置

配置完成后，在登录页面输入测试账号，如果看到：
- ✅ "登录成功" 提示 → 配置成功！
- ❌ "登录失败" 提示 → 检查后端服务和控制台错误信息

## 📞 需要帮助？

如果遇到问题，请检查：
1. 后端服务是否正常运行
2. 控制台是否有错误信息
3. 网络请求是否发送成功（在微信开发者工具的Network面板查看）