Dori 聊天部件
由React和Chakra UI所建的现代化,反应快的聊天部件,旨在无缝地融入任何网站. 该部件提供一种具有电子商务能力的AI动力聊天体验,适合客户支持和销售援助.
* 特性
- AI 权力聊天:具有自然语言处理的智能对话能力
- 电子商务一体化:产品建议、购物车和离职流动
- 响应设计: 对所有设备起作用的移动第一方法
- 波斯语/法西语支助: 有波斯语UI元素的完全RTL支持
- 可自定义: 易于自定义颜色、品牌和行为
- 阴影DOM: 与网站不相冲突的孤立风格
- 类型脚本: 以类型脚本构建,以获得更好的发展经验
* 安装
快速启动
将此 HTML 结构添加到您的页面 :
<div id="dori-react-widget-host"></div>
<script
id="dori-react-widget"
data-sharing-id="your-sharing-id"
src="https://cdn.jsdelivr.net/npm/dori-chat-widget@latest/dist/widget.js"
></script>
🎨自定义
样式
部件在保持自己的身份的同时会自动适应您网站的设计. 您可以自定义 :
- 颜色: 主色和口音颜色
- 标记: 日志和公司信息
- 信件: 欢迎文本和默认回复
- 行为: 聊天流和互动模式
发展
地方发展
- 清除仓库 :
git clone <repository-url>
cd my-app
- 安装依赖性 :
npm install
- 启动开发服务器 :
npm run dev
- 打开浏览器
http://localhost:3000
生产大楼
npm run build
这将创建一个 dist 带有已制作的部件文件的文件夹.
国家防范机制@dori-ai/dori-side-widget(中文(简体) )
使用这些脚本发布带分行安全标记的有范围包:
# From dev branch -> publishes tag "dev" with auto dev timestamp version
npm run publish:dev:scoped
# From main branch -> publishes tag "latest" with package.json version
npm run publish:prod:scoped
干线检查 :
npm run publish:dev:dry
npm run publish:prod:dry
从 CI( npm 信任的出版)
.github/workflows/publish.yml 在干净的跑道上运行同样的脚本
以每个运行的 OIDC 令牌而不是 npm 令牌认证,所以没有
秘密住在笔记本电脑上:
gh workflow run publish.yml -f channel=dev --ref dev -R DoriService/dori-side-widget
gh workflow run publish.yml -f channel=prod --ref main -R DoriService/dori-side-widget
Prod 运行对齐 package.json 和登记册上最高的版本,
凸起补丁,发布 @latest 并将撞回 main。拉动
之后在当地的prod发布 或下一次碰撞。 这个
npmjs.com上可信-publisher条目在工作流程文件名上键入;
重命名 publish.yml 中断 CI 发布直至更新.
CI 释放没有 npm 出处: npm 只接受来源捆绑 一个公共源存储器, 而这个repo是私人的.
开发与生产
- 发展数字 :
npm run dev- 使用直接DOM渲染来方便调试 - 生产数字 :
npm run build- 以阴影 DOM 隔离创建优化捆绑
组件
核心特征
- 欢迎屏幕: 以动画标志进行初步问候
- 聊天接口: 与消息历史的全功能聊天
- 产品建议: AI驱动的产品建议
- 购物卡:综合电子商务功能
- 响应设计: 在所有设备上无缝工作
技术架构
- 反应 19: 有现代钩子和特征的最新反应
- 查克拉乌伊: 一致、无障碍组件库
- 类型脚本: 全面类型的安全和更好的发展经验
- 阴影DOM: 孤立型和DOM结构
- 维特: 快速构建工具与开发服务器
QQ 浏览器支持
- Chrome 88+ (英语)
- Firefox 85+ (英语)
- 萨法里14+
- 边缘88+
分析跟踪
部件自动跟踪 :
- 对话会
- 用户互动
- 产品建议
- 换算指标
所有数据都与您的 data-sharing-id 为了方便的分析.
安全隐私
- 孤立的环境: 部件在阴影 DOM 为安全运行
- 无相交脚本: 安全通信协议
- 数据隐私:用户数据按照隐私标准处理
- GDPR 比较器: 铭记隐私条例
绩效
- 轻巧: 快速装入的优化捆绑大小
- 懒惰装入: 仅在需要时才装入组件
- 高效渲染: 反应19个优化平稳性能
- CDN 交付: 通过jsDelivr快速全球发行
++ 辅助
关于技术支持或问题:
- 在仓库中打开一个问题
- 联系支持 支持@dori.com
- 检查文档以获取共同解决方案
许可证
这个项目根据麻省理工学院的许可证获得许可.
捐款
我们欢迎捐款! 请随意:
- 提交错误报告
- 请求新功能
- 提供代码改进
- 改进文件编制
++ 更新
部件在使用时自动更新 @latest 标签。 对于特定版本的部署,使用:
<div id="dori-react-widget-host"></div>
<script
id="dori-react-widget"
data-sharing-id="your-id"
src="https://cdn.jsdelivr.net/npm/[email protected]/dist/widget.js"
></script>
Dori 聊天部件 - 使客户支持更聪明 更参与.