在线客服
为 Web 应用可选接入 Tawk.to 聊天气泡
概述
EasyStarter 可以在 Web 应用里加载 Tawk.to 聊天气泡。这是 opt-in：ID 为空时不会请求任何 Tawk 脚本。
Tawk.to 免费档不限制坐席、对话量和历史记录。去掉气泡上的 Powered by tawk.to 需要他们的付费去品牌加购。
环境变量
这些是 公开的 VITE_ 变量，会打进客户端包。不要放进 apps/server/.dev.vars。
| 变量 | 用途 |
|---|---|
VITE_TAWK_PROPERTY_ID | 嵌入代码里的 Property ID |
VITE_TAWK_WIDGET_ID | 嵌入代码里的 Widget ID |
需要同时写到：
apps/web/.env.development：本地开发apps/web/.env.production：本地生产构建（不进 Git）apps/web/wrangler.jsonc的vars：Cloudflare 部署，以及 GitHub 接入的线上打包
两个值都必须填写。缺一个就不会加载小组件。
VITE_* 是 构建时 打进客户端包的。Cloudflare 后台的 Worker 变量默认只作用于运行时；GitHub 线上打包要用 Build variables，或者直接把 ID 写进已提交的 wrangler.jsonc。wrangler.jsonc 里有值时，不必再去后台填一遍。
获取 ID
- 在 tawk.to 注册免费账号。
- 为站点创建一个 property。
- 打开 Administration → Channels → Chat Widget，复制 embed 代码。
- 脚本地址形如
https://embed.tawk.to/{PROPERTY_ID}/{WIDGET_ID}。
VITE_TAWK_PROPERTY_ID=64abc123def4567890abcdef
VITE_TAWK_WIDGET_ID=1hxxxxxxx行为
- 落地页、文档、博客、法律页和仪表盘会显示气泡。
- 认证页（
/auth/sign-in、/auth/sign-up以及带语言前缀的同样路径）会隐藏气泡，避免挡住表单。 - 已登录用户会把
name和email传给 Tawk，方便客服识别。 - 退出登录会重置小组件，避免下一个访客沿用上一个用户身份。
- Native 应用不接入。这是 Web widget。
验证
- 两个 ID 都留空，运行
pnpm dev:web，在 DevTools → Network 中确认没有embed.tawk.to请求。 - 填入两个 ID 并重启 Web，确认落地页右下角出现气泡。
- 打开
/auth/sign-in，确认气泡被隐藏。 - 登录后打开仪表盘，确认 Tawk 收件箱能看到用户邮箱。