المهارات chatkit-widget
📦

chatkit-widget

مخاطر عالية ⚡ يحتوي على سكربتات⚙️ الأوامر الخارجية🌐 الوصول إلى الشبكة🔑 متغيرات البيئة

دمج أدوات ChatKit في Next.js

تحتاج الفرق إلى طريقة سريعة لإضافة دعم دردشة بعلامة تجارية دون إعادة بناء واجهة دردشة. ترشد هذه المهارة إلى إعداد أداة ChatKit، وتخصيص السمات، والموضع، والأحداث، وربط وكيل الخلفية لتطبيقات React وNext.js.

يدعم: Claude Codex Code(CC)
⚠️ 38 ضعيف
1

تنزيل ZIP المهارة

2

رفع في Claude

اذهب إلى Settings → Capabilities → Skills → Upload skill

3

فعّل وابدأ الاستخدام

موارد مهيّأة لـ Agents

استخدم هذه الروابط عندما يحتاج AI Agent أو crawler أو script إلى سياق نظيف بدلًا من قراءة الصفحة كاملة.

تفاصيل Markdown GET /skills/awais68-chatkit-widget.md manifest موقَّع GET /api/skills/awais68-chatkit-widget/manifest lockfile موقَّع GET /api/skills/awais68-chatkit-widget/lockfile

اختبرها

جارٍ استخدام "chatkit-widget". أضف أداة دردشة إلى تخطيط App Router الخاص بي.

النتيجة المتوقعة:

خطة دمج موجزة تتضمن مكوّن الأداة، وموضعها في التخطيط، ومتغيرات البيئة، وخطوات التحقق.

جارٍ استخدام "chatkit-widget". اجعل الأداة متوافقة مع بوابة مدرستنا.

النتيجة المتوقعة:

  • إعدادات سمة لألوان المدرسة.
  • نص ترحيبي محدث للطلاب وأولياء الأمور.
  • إرشادات موضعية للجوال للشاشات الصغيرة.

جارٍ استخدام "chatkit-widget". راجع وكيل ChatKit هذا قبل النشر.

النتيجة المتوقعة:

قائمة تحقق أمنية تغطي المصادقة، والإجراءات العلوية الثابتة، والتعامل مع الأسرار، وحدود المعدلات، وحدود التسجيل.

التدقيق الأمني

مخاطر عالية
v7 • 6/28/2026

Static analysis found many high-severity patterns, but most weak-crypto, shell-backtick, and reconnaissance alerts are false positives caused by regex use and Markdown examples. No prompt injection or confirmed malicious intent was found, but the sample API proxy can expose a server bearer token through an unauthenticated forwarding route, so publication should wait for a safer implementation.

2
الملفات التي تم فحصها
804
الأسطر التي تم تحليلها
11
النتائج
7
إجمالي عمليات التدقيق

مشكلات عالية المخاطر (1)

SKILL.md:397-430
Secret-Bearing API Proxy Lacks Authentication
The backend proxy example reads a server-side ChatKit secret and forwards client-supplied endpoint, method, and payload values to the ChatKit API. The sample does not show authentication, role checks, rate limiting, or strict operation mapping before attaching the bearer token, so a deployed copy could let unauthorized users spend or abuse the server credential.
مشكلات متوسطة المخاطر (2)
SKILL.md:98SKILL.md:204-215
Remote Widget Script Loaded Without Integrity Controls
The client example builds a script URL from configuration and appends it to the page without an integrity check or a strict host allowlist. This is a common widget pattern, but it increases supply-chain risk if the endpoint is changed or compromised.
SKILL.md:400-424
User-Controlled Proxy Method Is Too Broad
The proxy accepts the HTTP method from the request body and only checks whether the endpoint starts with an allowed prefix. A safer pattern would map named server actions to fixed upstream methods and paths.
مشكلات منخفضة المخاطر (4)
scripts/verify.py:34-48SKILL.md:3-7SKILL.md:681-687
Weak Cryptography Alerts Are False Positives
The reported weak cryptographic algorithm matches in scripts/verify.py are regex parsing and string validation, not hashing, encryption, or signature verification. Similar hits in SKILL.md are Markdown text, colors, JSX paths, or plain examples rather than cryptographic APIs.
SKILL.md:18-21SKILL.md:25-40SKILL.md:658-662SKILL.md:699-721
Shell Backtick Alerts Are Markdown Formatting
The Ruby or shell backtick detections occur inside Markdown inline-code spans, tables, and fenced examples. They are documentation formatting, not executed backtick commands.
SKILL.md:94-98SKILL.md:137-147SKILL.md:397-398
Environment Variable Examples Are Mostly Legitimate Configuration
The environment variable detections are primarily documentation for public ChatKit identifiers, a server secret, and API base URL configuration. This is expected for a widget integration skill, although the server secret becomes risky in the proxy pattern described above.
scripts/verify.py:41-54SKILL.md:416-424
System Reconnaissance Alerts Are Benign Validation Output
The system reconnaissance detections point to validation and error output rather than host inspection or data collection. No evidence found of commands that enumerate the system, network, users, or files beyond checking SKILL.md and scripts/verify.py existence.

عوامل الخطر

⚡ يحتوي على سكربتات (2)
scripts/verify.py:1-62 SKILL.md:337-338
⚙️ الأوامر الخارجية (5)
SKILL.md:18-21 SKILL.md:25-40 SKILL.md:137-147 SKILL.md:658-662 SKILL.md:699-721
🌐 الوصول إلى الشبكة (3)
SKILL.md:98 SKILL.md:204-215 SKILL.md:397-424
🔑 متغيرات البيئة (3)
SKILL.md:94-98 SKILL.md:137-147 SKILL.md:397-398

الأنماط المكتشفة

Network Request With Server CredentialCritical Heuristic Combination Is Partly Confirmed But Not Malicious
دقّقه: codex عرض سجل التدقيق →

درجة الجودة

45
الهندسة المعمارية
100
قابلية الصيانة
87
المحتوى
70
المجتمع
2
الأمان
74
الامتثال للمواصفات

ما الذي يمكنك بناؤه

إضافة دردشة دعم إلى بوابة مدرسة

ضع أداة دردشة بعلامة تجارية في تخطيط Next.js ومرر تفاصيل الجلسة لتخصيص الدعم.

التحكم في ظهور الدردشة حسب الدور

اعرض وصولاً مختلفاً للدردشة أو رسائل ترحيب مختلفة للمسؤولين، أو الموظفين، أو الطلاب، أو أولياء الأمور، أو الضيوف.

توثيق معايير دمج الأداة

أنشئ إرشادات إعداد متسقة للتكوين، وتخصيص السمات، والأحداث، وفحوصات النشر.

جرّب هذه الموجّهات

إعداد الأداة الأساسي 
Use the chatkit-widget skill to add a ChatKit widget to my Next.js app. Include the configuration file, component placement, and required environment variables.
تخصيص الأداة للعلامة التجارية 
Use the chatkit-widget skill to customize the chat widget for our brand. Set theme colors, position, welcome text, and mobile behavior.
إضافة وصول قائم على الأدوار 
Use the chatkit-widget skill to show the widget by user role. Include examples for admin, staff, customer, and guest behavior.
تعزيز أمان الوكيل 
Use the chatkit-widget skill to review a ChatKit API proxy for production. Add authentication, strict allowed actions, method restrictions, rate limits, and safe error handling.

أفضل الممارسات

  • احتفظ بالمفاتيح السرية على الخادم ولا تعرض للمتصفح إلا المعرّفات العامة.
  • اربط طلبات العميل بإجراءات ثابتة على جانب الخادم بدلاً من تمرير طرق أو مسارات عشوائية.
  • اختبر موضع الأداة على صفحات الجوال حيث قد تتداخل العناصر الثابتة مع عناصر تحكم مهمة.

تجنب

  • لا تنشر مثال الوكيل دون فحوصات المصادقة والتفويض.
  • لا تحمّل نصوص الأداة من نطاقات غير موثوقة أو يتحكم بها المستخدم.
  • لا تسجل رسائل الدردشة أو معرّفات المستخدمين إلا إذا كانت سياسة الخصوصية لديك تسمح بذلك.

الأسئلة المتكررة

هل تنشئ هذه المهارة خلفية دردشة كاملة؟
لا. يركز على دمج الأداة، والتكوين، والموضع في الواجهة الأمامية. سلوك AI في الخلفية خارج نطاقه.
هل يمكنها العمل مع نظامي التوجيه في Next.js؟
نعم. تتضمن المهارة أمثلة لتخطيطات App Router ودمج تطبيق Pages Router.
هل تُعرض المفاتيح السرية للمتصفح؟
تذكر المهارة أن الأسرار يجب أن تبقى على جانب الخادم، لكن عينة الوكيل الخاصة بها تحتاج إلى ضوابط وصول أقوى قبل الاستخدام في الإنتاج.
هل يمكنني تخصيص مظهر الأداة؟
نعم. تغطي الألوان، ونصف قطر الحدود، والموضع، ونص الترحيب، وتعديلات الوضع الداكن.
هل تدعم وصول الدردشة القائم على الأدوار؟
نعم. تعرض أنماط عرض قائمة على الأدوار ورسائل ترحيب للأدوار الشائعة في البوابات.
هل هذا آمن للنشر كما هو مكتوب؟
لا. يجب تعزيز أمان إرشادات الوكيل قبل النشر في marketplace لأنه يمكنه تمرير الطلبات باستخدام اعتماد خادم.

تفاصيل المطور

المؤلف

Awais68

الترخيص

MIT

المستودع

https://github.com/Awais68/hackathon-2-phase-ii-full-stack-web-app/tree/main/.claude/skills/chatkit-widget

مرجع

main

بنية الملفات

📁 scripts/

📄 verify.py

📄 SKILL.md