xiangyixiangqin/SignalR快速启动指南.md

SignalR 快速启动指南

5 分钟快速测试 SignalR 实时通讯功能

---

🚀 快速启动步骤

步骤 1: 启动后端服务

# 进入后端目录
cd server/src/XiangYi.AppApi

# 运行服务
dotnet run

预期输出:

info: Microsoft.Hosting.Lifetime[14]
      Now listening on: http://localhost:5000
info: Microsoft.Hosting.Lifetime[0]
      Application started. Press Ctrl+C to shut down.

---

步骤 2: 配置小程序

打开 miniapp/config/index.js，确认配置：

const CURRENT_ENV = 'development'  // 使用开发环境

const ENV = {
  development: {
    API_BASE_URL: 'http://localhost:5000/api/app',
    // ...
  }
}

---

步骤 3: 启动小程序

1. 打开 HBuilderX 或微信开发者工具
2. 导入 miniapp 目录
3. 点击"运行" → "运行到浏览器" 或 "运行到微信开发者工具"

---

步骤 4: 登录测试账号

准备 2 个测试账号:

• 账号 A: 手机号 13800138001
• 账号 B: 手机号 13800138002

登录步骤:

1. 打开小程序
2. 输入手机号
3. 输入验证码（开发环境可能是固定的，如 123456）
4. 登录成功

---

步骤 5: 测试实时消息

5.1 打开聊天页面

账号 A:

1. 进入"消息"页面
2. 点击与账号 B 的会话（如果没有，先发起聊天）

账号 B:

1. 同样进入与账号 A 的聊天页面

5.2 发送消息

账号 A:

1. 在输入框输入："你好"
2. 点击"发送"

账号 B:

• 立即看到账号 A 发送的消息（无需刷新）
• 消息显示在聊天列表底部

✅ 如果看到实时消息，说明 SignalR 工作正常！

---

步骤 6: 测试交换功能

账号 A:

1. 点击"交换微信"按钮

账号 B:

• 立即看到交换微信请求卡片
• 点击"同意"按钮

账号 A:

• 立即看到交换结果
• 显示账号 B 的微信号

✅ 如果看到实时交换响应，说明 SignalR 完全正常！

---

🔍 查看日志

后端日志

# 查看后端控制台输出
# 应该看到类似以下日志：

info: XiangYi.AppApi.Hubs.ChatHub[0]
      用户连接: UserId=1, ConnectionId=abc123
info: XiangYi.AppApi.Controllers.ChatController[0]
      消息已通过SignalR推送: MessageId=123, ReceiverId=2

前端日志

打开浏览器控制台（F12），应该看到：

[SignalR] 正在连接: ws://localhost:5000/hubs/chat
[SignalR] WebSocket 连接已打开
[SignalR] 握手成功
[Chat] SignalR 连接成功
[SignalR] 已加入会话: 123
[Chat] 收到新消息: { messageId: 123, content: "你好", ... }

---

❌ 常见问题

问题 1: 连接失败

错误信息: [SignalR] WebSocket 创建失败

解决方案:

1. 确认后端服务已启动
2. 检查 API_BASE_URL 配置是否正确
3. 检查是否已登录（Token 是否有效）

# 检查后端服务
curl http://localhost:5000/api/app/config/system

# 应该返回 JSON 数据

---

问题 2: 收不到消息

可能原因: SignalR 未连接或事件监听未注册

解决方案:

1. 查看控制台是否有 [Chat] SignalR 连接成功 日志
2. 确认已进入聊天页面（会自动连接）
3. 刷新页面重试

---

问题 3: Token 过期

错误信息: 401 Unauthorized

解决方案:

1. 重新登录
2. 检查 Token 是否正确存储

// 在控制台执行
console.log(uni.getStorageSync('token'))
// 应该返回 JWT Token

---

📊 验证清单

完成以下测试，确认 SignalR 功能正常：

• 后端服务启动成功
• 小程序启动成功
• 账号 A 登录成功
• 账号 B 登录成功
• SignalR 连接成功（查看日志）
• 账号 A 发送消息，账号 B 实时收到
• 账号 B 发送消息，账号 A 实时收到
• 账号 A 发起交换请求，账号 B 实时收到
• 账号 B 响应交换，账号 A 实时收到结果
• 断开网络后自动重连

---

🎉 成功标志

如果你看到以下现象，说明 SignalR 已成功运行：

1. ✅ 控制台显示 [Chat] SignalR 连接成功
2. ✅ 发送消息后，对方无需刷新立即看到
3. ✅ 交换请求和响应实时推送
4. ✅ 断开网络后自动重连

---

📝 下一步

SignalR 功能已经完整实现，你可以：

1. 进行完整测试 - 参考 miniapp/SignalR测试指南.md
2. 部署到生产环境 - 参考 server/SignalR生产环境配置.md
3. 添加更多功能 - 如图片发送、语音消息等

---

💡 提示

• 开发环境使用 ws://（WebSocket）
• 生产环境必须使用 wss://（WebSocket Secure）
• 确保防火墙允许 WebSocket 连接
• 建议使用 Chrome 浏览器进行测试（F12 查看日志）

---

📞 技术支持

如果遇到问题，请检查：

1. 后端日志 - server/src/XiangYi.AppApi/bin/Debug/net8.0/logs/
2. 前端日志 - 浏览器控制台（F12）
3. 网络请求 - 浏览器 Network 面板

常用调试命令:

# 查看后端进程
ps aux | grep dotnet

# 查看端口占用
netstat -tlnp | grep 5000

# 测试 API 连接
curl http://localhost:5000/api/app/config/system

# 测试 WebSocket 连接（需要安装 wscat）
npm install -g wscat
wscat -c ws://localhost:5000/hubs/chat

---

祝你测试顺利！🎊