更新
This commit is contained in:
+228
-108
@@ -1,129 +1,249 @@
|
||||
# TUICallKit 4.2.2 快速参考
|
||||
# 快速参考卡片
|
||||
|
||||
## 📦 安装
|
||||
## 常用命令
|
||||
|
||||
### 开发
|
||||
```bash
|
||||
npm install # 安装依赖
|
||||
npm run dev # 启动开发服务器
|
||||
npm run build # 打包生产版本
|
||||
npm run lint # 代码检查
|
||||
npm run type-check # 类型检查
|
||||
```
|
||||
|
||||
### 部署
|
||||
```bash
|
||||
# HTTPS 配置
|
||||
sudo bash setup-https.sh
|
||||
|
||||
# Nginx 操作
|
||||
sudo nginx -t # 测试配置
|
||||
sudo systemctl restart nginx # 重启 Nginx
|
||||
sudo systemctl status nginx # 查看状态
|
||||
|
||||
# 证书管理
|
||||
sudo certbot certificates # 查看证书
|
||||
sudo certbot renew # 续期证书
|
||||
sudo certbot renew --dry-run # 测试续期
|
||||
```
|
||||
|
||||
### 日志查看
|
||||
```bash
|
||||
# Nginx 日志
|
||||
sudo tail -f /var/log/nginx/admin_https_access.log
|
||||
sudo tail -f /var/log/nginx/admin_https_error.log
|
||||
|
||||
# 应用日志
|
||||
tail -f /path/to/your/app.log
|
||||
```
|
||||
|
||||
## 文件位置
|
||||
|
||||
| 文件 | 位置 | 说明 |
|
||||
|------|------|------|
|
||||
| 源代码 | `src/` | Vue 应用源代码 |
|
||||
| 打包输出 | `dist/` | 生产环境文件 |
|
||||
| 配置文件 | `vite.config.ts` | Vite 配置 |
|
||||
| 环境变量 | `.env.production` | 生产环境变量 |
|
||||
| Nginx 配置 | `nginx-production.conf` | Nginx 配置文件 |
|
||||
| SSL 证书 | `/etc/letsencrypt/live/` | SSL 证书位置 |
|
||||
| 静态文件 | `/path/to/server/public/admin/` | 部署位置 |
|
||||
|
||||
## 常见问题速查
|
||||
|
||||
### 页面打不开
|
||||
```bash
|
||||
# 1. 检查 Nginx
|
||||
sudo nginx -t
|
||||
|
||||
# 2. 查看错误日志
|
||||
sudo tail -f /var/log/nginx/error.log
|
||||
|
||||
# 3. 检查文件权限
|
||||
ls -la /path/to/server/public/admin/
|
||||
|
||||
# 4. 清除浏览器缓存
|
||||
Ctrl+Shift+Delete
|
||||
```
|
||||
|
||||
### TUIKit 错误
|
||||
```javascript
|
||||
// 在浏览器控制台运行诊断脚本
|
||||
// 复制 diagnose.js 中的代码
|
||||
```
|
||||
|
||||
### 证书过期
|
||||
```bash
|
||||
# 手动续期
|
||||
sudo certbot renew
|
||||
|
||||
# 检查有效期
|
||||
openssl x509 -in /etc/letsencrypt/live/api.zzzhengyangtang.cn/fullchain.pem -noout -dates
|
||||
```
|
||||
|
||||
### 性能问题
|
||||
```bash
|
||||
# 检查磁盘空间
|
||||
df -h
|
||||
|
||||
# 检查内存
|
||||
free -h
|
||||
|
||||
# 检查 CPU
|
||||
top
|
||||
```
|
||||
|
||||
## 配置检查清单
|
||||
|
||||
- [ ] 域名 DNS 已解析
|
||||
- [ ] SSL 证书已安装
|
||||
- [ ] Nginx 配置已更新
|
||||
- [ ] 静态文件路径正确
|
||||
- [ ] API 代理端口正确
|
||||
- [ ] Nginx 配置测试通过
|
||||
- [ ] Nginx 已重启
|
||||
- [ ] HTTPS 访问正常
|
||||
- [ ] 证书自动续期已配置
|
||||
- [ ] 防火墙已配置
|
||||
|
||||
## 性能优化
|
||||
|
||||
### 启用 Gzip
|
||||
```nginx
|
||||
gzip on;
|
||||
gzip_types text/plain text/css text/javascript application/javascript;
|
||||
gzip_min_length 1000;
|
||||
```
|
||||
|
||||
### 启用缓存
|
||||
```nginx
|
||||
location ~* \.(js|css|png|jpg|jpeg|gif|ico|svg|woff|woff2|ttf|eot)$ {
|
||||
expires 1y;
|
||||
add_header Cache-Control "public, immutable";
|
||||
}
|
||||
```
|
||||
|
||||
### 使用 CDN
|
||||
```typescript
|
||||
// vite.config.ts
|
||||
export default defineConfig({
|
||||
base: 'https://your-cdn.com/admin/',
|
||||
})
|
||||
```
|
||||
|
||||
## 安全检查
|
||||
|
||||
### SSL 测试
|
||||
```bash
|
||||
# 使用 openssl
|
||||
openssl s_client -connect api.zzzhengyangtang.cn:443
|
||||
|
||||
# 使用 curl
|
||||
curl -I https://api.zzzhengyangtang.cn/admin
|
||||
|
||||
# 在线测试
|
||||
https://www.ssllabs.com/ssltest/
|
||||
```
|
||||
|
||||
### 防火墙配置
|
||||
```bash
|
||||
# 允许 HTTPS
|
||||
sudo ufw allow 443/tcp
|
||||
|
||||
# 允许 HTTP(用于重定向)
|
||||
sudo ufw allow 80/tcp
|
||||
|
||||
# 查看规则
|
||||
sudo ufw status
|
||||
```
|
||||
|
||||
## 监控命令
|
||||
|
||||
```bash
|
||||
npm install @trtc/calls-uikit-vue
|
||||
# 实时监控 Nginx 访问
|
||||
sudo tail -f /var/log/nginx/admin_https_access.log | grep -v "\.js\|\.css\|\.png"
|
||||
|
||||
# 监控错误
|
||||
sudo tail -f /var/log/nginx/admin_https_error.log
|
||||
|
||||
# 监控进程
|
||||
watch -n 1 'ps aux | grep nginx'
|
||||
|
||||
# 监控连接
|
||||
sudo netstat -tlnp | grep nginx
|
||||
|
||||
# 监控磁盘
|
||||
watch -n 1 'df -h'
|
||||
|
||||
# 监控内存
|
||||
watch -n 1 'free -h'
|
||||
```
|
||||
|
||||
## 📥 导入
|
||||
## 备份和恢复
|
||||
|
||||
```typescript
|
||||
import { TUICallKitAPI, TUICallKit, TUICallType, STATUS } from '@trtc/calls-uikit-vue'
|
||||
### 备份
|
||||
```bash
|
||||
# 备份 SSL 证书
|
||||
sudo tar -czf ssl-backup.tar.gz /etc/letsencrypt/
|
||||
|
||||
# 备份应用
|
||||
tar -czf app-backup.tar.gz /path/to/your/app/
|
||||
|
||||
# 备份 Nginx 配置
|
||||
sudo tar -czf nginx-backup.tar.gz /etc/nginx/
|
||||
```
|
||||
|
||||
## 🔧 常用 API
|
||||
### 恢复
|
||||
```bash
|
||||
# 恢复 SSL 证书
|
||||
sudo tar -xzf ssl-backup.tar.gz -C /
|
||||
|
||||
### 初始化
|
||||
# 恢复应用
|
||||
tar -xzf app-backup.tar.gz -C /
|
||||
|
||||
```typescript
|
||||
await TUICallKitAPI.init({
|
||||
userID: 'doctor_1',
|
||||
userSig: 'xxx',
|
||||
SDKAppID: 123456
|
||||
})
|
||||
# 恢复 Nginx 配置
|
||||
sudo tar -xzf nginx-backup.tar.gz -C /
|
||||
```
|
||||
|
||||
### 发起通话
|
||||
## 故障排查流程
|
||||
|
||||
```typescript
|
||||
// 一对一通话
|
||||
await TUICallKitAPI.calls({
|
||||
userIDList: ['patient_2'],
|
||||
type: TUICallType.VIDEO_CALL
|
||||
})
|
||||
|
||||
// 多人通话
|
||||
await TUICallKitAPI.calls({
|
||||
userIDList: ['patient_2', 'doctor_3'],
|
||||
type: TUICallType.VIDEO_CALL
|
||||
})
|
||||
```
|
||||
问题出现
|
||||
↓
|
||||
1. 检查浏览器控制台错误
|
||||
↓
|
||||
2. 运行诊断脚本 (diagnose.js)
|
||||
↓
|
||||
3. 检查 Nginx 日志
|
||||
↓
|
||||
4. 检查应用日志
|
||||
↓
|
||||
5. 查看 TROUBLESHOOTING.md
|
||||
↓
|
||||
6. 检查网络连接
|
||||
↓
|
||||
7. 检查防火墙设置
|
||||
↓
|
||||
8. 重启服务
|
||||
↓
|
||||
问题解决
|
||||
```
|
||||
|
||||
### 接听/拒绝
|
||||
## 联系方式
|
||||
|
||||
```typescript
|
||||
// 接听
|
||||
await TUICallKitAPI.accept()
|
||||
- 项目文档:查看 `DEPLOYMENT_README.md`
|
||||
- 故障排查:查看 `TROUBLESHOOTING.md`
|
||||
- 部署指南:查看 `HTTPS_DEPLOYMENT_GUIDE.md`
|
||||
- 解决方案:查看 `SOLUTION_SUMMARY.md`
|
||||
|
||||
// 拒绝
|
||||
await TUICallKitAPI.reject()
|
||||
```
|
||||
## 有用的链接
|
||||
|
||||
### 挂断
|
||||
|
||||
```typescript
|
||||
await TUICallKitAPI.hangup()
|
||||
```
|
||||
|
||||
### 设置回调
|
||||
|
||||
```typescript
|
||||
TUICallKitAPI.setCallback({
|
||||
statusChanged: ({ oldStatus, newStatus }) => {
|
||||
console.log('状态变化:', oldStatus, '->', newStatus)
|
||||
},
|
||||
afterCalling: () => {
|
||||
console.log('通话结束')
|
||||
}
|
||||
})
|
||||
```
|
||||
|
||||
### 浮窗设置
|
||||
|
||||
```typescript
|
||||
TUICallKitAPI.enableFloatWindow(false)
|
||||
```
|
||||
|
||||
## 📊 状态常量
|
||||
|
||||
```typescript
|
||||
STATUS.IDLE // 空闲
|
||||
STATUS.DIALING_C2C // 一对一呼叫中
|
||||
STATUS.DIALING_GROUP // 群组呼叫中
|
||||
STATUS.CALLING_C2C_VIDEO // 一对一视频通话中
|
||||
STATUS.CALLING_C2C_AUDIO // 一对一音频通话中
|
||||
STATUS.CALLING_GROUP_VIDEO // 群组视频通话中
|
||||
STATUS.CALLING_GROUP_AUDIO // 群组音频通话中
|
||||
```
|
||||
|
||||
## 🎨 组件使用
|
||||
|
||||
```vue
|
||||
<template>
|
||||
<TUICallKit
|
||||
style="width: 650px; height: 500px"
|
||||
:allowedFullScreen="false"
|
||||
:allowedMinimized="false"
|
||||
/>
|
||||
</template>
|
||||
|
||||
<script setup>
|
||||
import { TUICallKit } from '@trtc/calls-uikit-vue'
|
||||
</script>
|
||||
```
|
||||
|
||||
## ⚠️ 注意事项
|
||||
|
||||
1. **userId 格式**:必须是字符串,建议格式 `prefix_number`(如 `doctor_1`)
|
||||
2. **SDKAppID**:必须是数字类型,使用 `Number()` 转换
|
||||
3. **HTTPS**:Web 端必须使用 HTTPS(或 localhost)
|
||||
4. **userIDList**:发起通话时使用数组,即使是一对一通话
|
||||
|
||||
## 🔄 从 4.0.12 迁移
|
||||
|
||||
| 项目 | 4.0.12 | 4.2.2 |
|
||||
|------|--------|-------|
|
||||
| 包名 | @tencentcloud/call-uikit-vue | @trtc/calls-uikit-vue |
|
||||
| API | TUICallKitServer | TUICallKitAPI |
|
||||
| 发起通话 | call({ userID, type }) | calls({ userIDList, type }) |
|
||||
|
||||
## 📚 完整文档
|
||||
|
||||
- [官方文档](https://www.tencentcloud.com/document/product/647/50993)
|
||||
- [API 文档](https://web.sdk.qcloud.com/component/trtccalling/doc/web/zh-cn/)
|
||||
- TUIKit 文档:https://cloud.tencent.com/document/product/647
|
||||
- Nginx 文档:https://nginx.org/en/docs/
|
||||
- Let's Encrypt:https://letsencrypt.org/
|
||||
- SSL 测试:https://www.ssllabs.com/ssltest/
|
||||
- WebRTC 兼容性:https://caniuse.com/webrtc
|
||||
|
||||
---
|
||||
|
||||
**版本:** 4.2.2
|
||||
**更新日期:** 2024-03-04
|
||||
**最后更新**: 2024-03-12
|
||||
|
||||
Reference in New Issue
Block a user