一、准备工作
本次实操使用的是国内完全免费开源的在线客服工具——LiveHelperChat，它无需任何服务器也能临时测试，正式部署用免费的云开发环境也能稳定运行。
1. 临时测试环境准备（快速验证功能）
- 一台能上网的电脑
- 任意主流浏览器（Chrome、Edge、Firefox优先）
2. 正式部署环境准备（长期稳定使用）
- 任意支持Node.js 14+的云开发平台，推荐使用Vercel（无需信用卡，注册即用，每月有足够额度）
- 已实名认证的GitHub账号（用于一键克隆LiveHelperChat的部署模板）
- 你自己的任意网站（哪怕是个人博客、静态页都可以）
二、临时3分钟功能验证
先别急着部署，用官方提供的临时沙盒快速试手，确认功能符合需求再继续。
具体操作步骤
- 打开浏览器访问：https://demo.livehelperchat.com/site_admin
- 输入临时登录账号：demo，密码：demo123，点击登录
- 切换到访客模式测试接待：新打开一个浏览器标签页，访问https://demo.livehelperchat.com，在右下角找到客服弹窗，点击发送消息
- 回到管理后台标签页，查看左下角的在线聊天列表，点击刚发来的访客消息即可回复
三、正式免费部署（Vercel一键版）
正式部署后，客服管理后台和接待入口都会变成你自己的专属地址，还能自定义外观、绑定微信/钉钉等IM工具（可选）。
1. 一键克隆部署模板
- 打开浏览器访问LiveHelperChat的Vercel一键部署模板：https://vercel.com/new/clone?repository-url=https%3A%2F%2Fgithub.com%2FLiveHelperChat%2Flivehelperchat-vercel&env=APP_KEY,LHC_REST_API_KEY,LHC_REST_API_EXPIRE
- 如果是第一次用Vercel，会自动跳转GitHub授权，点击Authorize Vercel完成授权
- 授权成功后，填写以下3个必填环境变量（其他留空即可）：
- APP_KEY：打开浏览器访问https://randomkeygen.com/，复制1Password Strong Password里的任意16-32位随机字符串
- LHC_REST_API_KEY：复制刚才生成的APP_KEY即可，或者再生成一个新的也行
- LHC_REST_API_EXPIRE：直接填写数字86400（表示API密钥24小时过期，安全起见）
- 点击右下角的Deploy按钮，等待约2-5分钟部署完成
- 部署成功后，页面会显示一个绿色的Congratulations!提示，下面的Visit按钮旁边的链接就是你的专属客服系统地址，复制保存下来
四、专属客服系统的基础配置
配置完成后，你就能把客服弹窗嵌入自己的网站了。
1. 首次登录管理后台并修改密码
- 在刚才复制的专属客服地址后面加上/site_admin，比如专属地址是https://my-livechat.vercel.app，就访问https://my-livechat.vercel.app/site_admin
- 初始账号：admin，初始密码：admin123，点击登录
- 登录后会强制修改密码，输入原密码admin123，设置至少8位包含大小写字母和数字的新密码，点击保存
2. 生成网站嵌入代码
- 点击管理后台左侧菜单栏的设置 → 嵌入代码 → 实时聊天
- 在嵌入代码生成器页面，无需修改任何默认配置，直接点击底部的复制嵌入代码按钮，保存代码到本地记事本
3. 把客服弹窗嵌入自己的网站
分3种常见网站类型讲解嵌入方法，任选一种即可：
① 静态HTML网站
- 用记事本或VS Code打开你的网站HTML文件
- 把刚才复制的嵌入代码，粘贴到HTML文件的
