Web 接入
嵌入代码
在 </body> 前添加:
html
<script
src="https://widget.webnav.ai/widget/chat-widget.js"
data-base-url="https://yoursite.com"
data-theme="dark"
></script>Content Security Policy(CSP)
如果你的網站設置了 CSP 響應頭,只需在兩個指令裡放行挂件域名:
script-src 'self' https://widget.webnav.ai;
connect-src 'self' https://widget.webnav.ai;挂件的所有資源(腳本、樣式、Markdown 渲染器)都只從 widget.webnav.ai 加載,不依賴任何第三方 CDN。樣式通過 constructed stylesheet(adoptedStyleSheets)注入,按規範不受 style-src 限制。
僅舊瀏覽器需要
若瀏覽器不支持 adoptedStyleSheets(2021 年前的舊版本),挂件會降級為 <link> 樣式表,此時需額外放行:
style-src 'self' https://widget.webnav.ai;現代瀏覽器都走主路徑,無需此條。
氣泡不出現時,請按 故障排查 逐項檢查。
特点
- Shadow DOM 隔离样式,不影响宿主页面
- 支持所有现代浏览器
- 响应式适配桌面和移动端
- 对话历史存储在浏览器 IndexedDB