Files
CamTalk/desktop/README.md
2026-06-14 18:10:58 +08:00

1.8 KiB
Raw Blame History

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:5173Vite 开发服务器),支持热更新。

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

项目结构

desktop/
├── main/
│   ├── index.ts       # Main Process 入口
│   ├── window.ts      # BrowserWindow 管理
│   ├── permissions.ts # 权限自动授予
│   └── config.ts      # 配置管理
├── preload/
│   └── index.ts       # contextBridge 安全桥接
├── assets/            # 应用图标等资源
└── package.json

注意事项

  • 首次运行可能需要授予摄像头和麦克风权限(系统级别)
  • 如果连接远程后端,确保网络可访问
  • webSecurity: false 是为了允许 HTTP 资源加载,仅适用于可信环境