1.8 KiB
1.8 KiB
CamTalk Desktop — 桌面客户端
基于 Electron 的 CamTalk 桌面应用,解决 HTTP 环境下摄像头和麦克风无法访问的问题。
原理
Electron 以 file:// 协议加载页面,Chromium 将其视为安全上下文,getUserMedia 可直接工作。
快速开始
1. 安装依赖
cd desktop
npm install
2. 启动前端开发服务器
cd ../frontend
npm run dev
3. 启动 Electron(开发模式)
cd desktop
npm run dev
Electron 会连接到 http://localhost:5173(Vite 开发服务器),支持热更新。
4. 启动后端
cd ../backend
go run ./cmd/server
生产构建
# 1. 构建前端
cd ../frontend
npm run build
# 2. 构建 Electron
cd ../desktop
npm run build
# 3. 预览生产版本
npm run preview
配置后端地址
默认连接 ws://localhost:8080/ws。如需修改:
- 方式 1:在 Electron 应用的设置面板中修改(功能开发中)
- 方式 2:直接编辑配置文件
- macOS:
~/Library/Application Support/camtalk-desktop/camtalk-config.json - Linux:
~/.config/camtalk-desktop/camtalk-config.json
- macOS:
项目结构
desktop/
├── main/
│ ├── index.ts # Main Process 入口
│ ├── window.ts # BrowserWindow 管理
│ ├── permissions.ts # 权限自动授予
│ └── config.ts # 配置管理
├── preload/
│ └── index.ts # contextBridge 安全桥接
├── assets/ # 应用图标等资源
└── package.json
注意事项
- 首次运行可能需要授予摄像头和麦克风权限(系统级别)
- 如果连接远程后端,确保网络可访问
webSecurity: false是为了允许 HTTP 资源加载,仅适用于可信环境