技能 chatkit-widget
📦
chatkit-widget
內容修訂 r1 高風險 ⚡ 包含腳本⚙️ 外部命令🌐 網路存取🔑 環境變數
在 React 中整合 ChatKit 小工具
在 React 應用程式中新增聊天小工具，需要謹慎處理用戶端載入、設定與認證資料管理。這項技能提供在 Next.js 和 React 中實作 ChatKit widget 的聚焦模式。
支援: Claude Codex Code(CC)
安裝前請停止並請求確認。
請審查安裝計畫，並在變更檔案前取得使用者明確同意。
使用我的智慧代理安裝
將此請求複製給你的智慧代理，其中包含權威 Skill 頁面和清單。
智能體請求
Review the Skillstore skill "chatkit-widget" from https://skillstore.io/skills/awais68-chatkit-widget.md and its manifest at https://skillstore.io/api/skills/awais68-chatkit-widget/manifest. Verify the artifact. Stop and obtain explicit user consent before installing or changing files.你的智慧代理仍應顯示其計畫，並依安全政策請求必要確認。
Agent 可讀資源
當 AI Agent、爬蟲或腳本需要乾淨脈絡、而不是讀取完整頁面時，請使用這些連結。
測試它
正在使用「chatkit-widget」。 Add a chat widget to a Next.js App Router layout.
預期結果:
一份精簡實作計畫，包含元件位置、版面配置整合點、環境變數與僅限用戶端載入注意事項。
正在使用「chatkit-widget」。 Make the widget available only to teachers and parents.
預期結果:
一種角色型存取方法，會讀取工作階段角色、選擇正確的歡迎訊息，並對不支援的使用者隱藏小工具。
正在使用「chatkit-widget」。 Prepare production guidance for ChatKit setup.
預期結果:
- 對上游 API 呼叫使用僅限伺服器的 secrets。
- 將 proxy 端點與方法限制為已核准的動作。
- 避免記錄訊息本文或私人使用者詳細資料。
安全審計
高風險v9 • 2026/7/6 開啟版本化報告
Most static findings are false positives caused by Markdown code fences, TypeScript template literals, and legitimate configuration examples. No prompt injection was found in the reviewed files. The substantive risks are an overbroad server-side proxy that attaches a secret key to client-directed requests and examples that log chat content.
2
已掃描檔案
804
分析行數
0
複核項目
0
已忽略的誤報
已確認的安全問題 (2)
高
Overbroad API Proxy Uses Server Secret
The sample API route accepts endpoint, method, and payload from the client, then forwards the request with CHATKIT_SECRET. Without authentication, exact route mapping, and per-user authorization, clients could use the server as a privileged ChatKit proxy.
The code shows client-controlled routing fields and a bearer secret attached to the upstream request. The only visible restriction is a startsWith endpoint allowlist, with no authentication check in the route.
中
Chat Message Content Logged
The examples log complete chat message data and user message text. Copying this into production can expose private support conversations through browser logs or analytics debugging.
The cited examples explicitly log outbound chat message objects and message text. Legitimate debugging is possible, but the guidance conflicts with privacy-safe production behavior.
風險因素
⚡ 包含腳本 (1)
⚙️ 外部命令 (43)
SKILL.md:18 SKILL.md:19 SKILL.md:20 SKILL.md:21 SKILL.md:25-40 SKILL.md:40-46 SKILL.md:46-133 SKILL.md:133-137 SKILL.md:137-151 SKILL.md:151-157 SKILL.md:157-206 SKILL.md:206-322 SKILL.md:329-344 SKILL.md:344-348 SKILL.md:348-387 SKILL.md:387-393 SKILL.md:393-424 SKILL.md:424-428 SKILL.md:428-448 SKILL.md:448-454 SKILL.md:454-482 SKILL.md:482-486 SKILL.md:486-506 SKILL.md:506-510 SKILL.md:510-555 SKILL.md:555-559 SKILL.md:559-583 SKILL.md:583-587 SKILL.md:587-642 SKILL.md:642-658 SKILL.md:658-659 SKILL.md:659-660 SKILL.md:660-661 SKILL.md:661-662 SKILL.md:662-668 SKILL.md:668-679 SKILL.md:679-683 SKILL.md:683-695 SKILL.md:695-699 SKILL.md:699-706 SKILL.md:706-717 SKILL.md:717-721 SKILL.md:721-741
🌐 網路存取 (4)
審計單位: codex 檢視審計紀錄 →
分享與引用此報告
分享版本化評估報告、中性徽章、嵌入卡片與引用。Skillstore 只報告證據，不判斷該 Skill 是否安全。
複製報告連結
https://skillstore.io/skills/awais68-chatkit-widget/audits/9?utm_source=security_passport&utm_medium=share&utm_campaign=versioned_reportMarkdown 徽章
[](https://skillstore.io/skills/awais68-chatkit-widget?utm_source=security_passport_badge)HTML 徽章
<a href="https://skillstore.io/skills/awais68-chatkit-widget?utm_source=security_passport_badge"><img src="https://skillstore.io/badges/skills/awais68-chatkit-widget/security.svg" alt="Skillstore security assessment" loading="lazy"></a>嵌入卡片
<iframe src="https://skillstore.io/embed/skills/awais68-chatkit-widget.html" title="Skillstore Security Assessment" sandbox="allow-popups allow-popups-to-escape-sandbox" loading="lazy" referrerpolicy="no-referrer" width="420" height="180"></iframe>學術引用 (APA · BibTeX · CFF)
APA 引用
Awais68. (2026). chatkit-widget security audit report (audit version 9) [Author version unspecified]. Skillstore. https://skillstore.io/skills/awais68-chatkit-widget/audits/9BibTeX 引用
@techreport{awais68-awais68-chatkit-widget-2026,
author = {Awais68},
title = {chatkit-widget security audit report (audit version 9)},
institution = {Skillstore},
year = {2026},
number = {9},
url = {https://skillstore.io/skills/awais68-chatkit-widget/audits/9},
note = {Author version unspecified}
}CITATION.cff
cff-version: 1.2.0
message: "If you use this Skill, cite its author and this versioned security audit report."
title: "chatkit-widget security audit report (audit version 9)"
version: "unspecified"
type: report
authors:
- name: "Awais68"
date-released: "2026-07-06"
url: "https://skillstore.io/skills/awais68-chatkit-widget/audits/9"
identifiers:
- type: other
value: "skillstore:awais68-chatkit-widget:audit:9"
description: "Skillstore immutable audit report identifier"
Skillstore 評分
評分依據 證據置信度: 中 45
架構
85
可維護性
87
內容
70
社群
74
規範符合度
你可以打造什麼
將支援聊天加入入口網站
在學校、服務台或客戶入口網站中嵌入浮動支援小工具，並使用品牌文字與色彩。
依使用者角色控管聊天
根據使用者角色顯示聊天存取權，例如學生、教師、家長、管理員或訪客。
記錄小工具操作
建立簡單的使用指南，為應用程式團隊說明設定、疑難排解與自訂方式。
試試這些提示
新增基本小工具
Use this skill to add a ChatKit widget to my existing Next.js app. Keep the setup minimal and explain each file I need to edit.
自訂小工具品牌化
Use this skill to configure ChatKit widget colors, positioning, welcome text, and mobile behavior for our product brand.
連接已驗證使用者
Use this skill to pass authenticated user role, id, and display name into a ChatKit widget without exposing server secrets.
強化正式環境 Proxy
Use this skill to review my ChatKit proxy design for authentication, endpoint allowlists, method restrictions, payload validation, and secret handling.
最佳實務
- 將公開專案金鑰與僅限伺服器的 secrets 分開保存。
- 在用戶端載入小工具，以避免伺服器渲染問題。
- 在 proxy 請求前使用精確的端點允許清單與驗證。
避免
- 不要在用戶端設定中公開 secret keys。
- 不要從瀏覽器 proxy 任意端點、方法或 payload 值。
- 不要在正式環境分析或 console output 中記錄聊天訊息本文。
常見問題
這項技能支援哪些應用程式？
它支援需要嵌入 ChatKit-style 聊天小工具的 Next.js 與 React 應用程式。
這項技能會建立自訂聊天 UI 嗎？
不會。它專注於整合與設定既有的 ChatKit widget。
我可以將它用於已驗證使用者嗎？
可以。範例展示如何從應用程式工作階段傳入使用者角色、id 與名稱。
這項技能會處理後端 AI 模型設定嗎？
不會。它不會設定 ChatKit 後端或選擇 AI 模型。
這些 proxy 範例適合正式環境使用嗎？
未經審查則不適合。正式環境使用前，請加入驗證、嚴格端點對應、payload 驗證與授權。
哪些 AI 程式設計工具可以使用這項技能？
報告列出對 Claude、Codex 與 Claude Code 的支援。
開發者詳細資訊
作者
Awais68授權
MIT
Skillstore 修訂
r1
版本提示
作者未聲明版本。
引用
c4231f0153ccd2a2ed62274c5a372bf8f2386d3f
維護新鮮度
2026/7/18
使用量
6 次下載 · 180 次瀏覽