تحويل الموقع إلى مساعد ذكاء اصطناعي: ChatGPT API باستخدام JavaScript

تعلم Python بسهولة دون إرهاق نظري. حل مهام عملية مع التحقق التلقائي واكتب الكود مباشرة في المتصفح.

لماذا يحتاج موقعك إلى عقل؟ ChatGPT API + JavaScript

\n\n

تخيل: المستخدم يدخل إلى موقعك، وهناك ليس مجرد صفحة ثابتة، بل مساعد حي. يكتب كوداً، يترجم نصاً، يولد أفكاراً أو ببساطة يحافظ على حوار. يبدو وكأنه خيال علمي؟ لكن في الحقيقة، الأمر لا يتجاوز بضعة أسطر من JavaScript وطلب API واحد إلى ChatGPT.

\n\n

في هذا المقال، سنشرح كيفية ربط ChatGPT API باستخدام JavaScript - من تسجيل المفتاح إلى إنشاء روبوت محادثة كامل. ستتعلم كيفية إرسال الطلبات، معالجة الأخطاء، والاستفادة القصوى من الشبكة العصبية. هيا بنا!

\n\n

ما هو ChatGPT API ولماذا تحتاجه

\n\n

OpenAI API هو جسر بين الكود الخاص بك ونموذج لغوي ضخم (GPT-4, GPT-3.5). ترسل نصاً (استعلاماً Prompt)، ويعيد النموذج رداً مولّداً. الأمر بسيط، لكن الإمكانيات لا حدود لها.

\n\n

باستخدام JavaScript، يكون الدمج مريحاً بشكل خاص: يمكنك استخدام fetch في المتصفح أو axios / node-fetch على الخادم (Node.js). لا حاجة لمكتبات معقدة - فقط HTTP و JSON.

\n\n

أين يمكن أن يفيد ذلك في موقع تعليمي مثل PythonLib:

مساعد تفاعلي - يجيب على أسئلة حول Python.
مولّد كود - يكتب أمثلة بناءً على طلب المستخدم.
فحص الواجبات المنزلية - يحلل كود الطالب.
روبوت محادثة للدعم الفني - يرد على مدار الساعة.

\n\n

الخطوة 1. الحصول على مفتاح API من OpenAI

\n\n

لا يمكن الاستغناء عن المفتاح. ادخل إلى platform.openai.com، سجل وانتقل إلى قسم API Keys. اضغط على Create new secret key - انسخه فوراً. احتفظ بالمفتاح بسرية، لا تضعه في كود العميل!

\n\n

للتجربة، يكفي الرصيد المجاني (عادةً $5-18). لكن تذكر: الطلبات إلى النموذج تكلف مالاً، وإن كانت قليلة.

\n\n

الخطوة 2. أبسط طلب باستخدام JavaScript (Node.js)

\n\n

أسرع طريقة للتجربة هي كتابة سكريبت باستخدام Node.js. قم بتثبيت node-fetch (أو استخدم fetch المدمج في Node 18+).

\n\n

// chatgpt.js\nimport fetch from 'node-fetch';\n\nconst API_KEY = 'مفتاحك_السري';\nconst API_URL = 'https://api.openai.com/v1/chat/completions';\n\nasync function askChatGPT(prompt) {\n  const response = await fetch(API_URL, {\n    method: 'POST',\n    headers: {\n      'Content-Type': 'application/json',\n      'Authorization': `Bearer ${API_KEY}`\n    },\n    body: JSON.stringify({\n      model: 'gpt-3.5-turbo', // أو gpt-4\n      messages: [\n        { role: 'user', content: prompt }\n      ],\n      temperature: 0.7,\n      max_tokens: 500\n    })\n  });\n\n  const data = await response.json();\n  return data.choices[0].message.content;\n}\n\n// الاستخدام\nconst answer = await askChatGPT('اكتب دالة بلغة Python لفرز قائمة');\nconsole.log(answer);

\n\n

قم بتشغيل node chatgpt.js - وسترد عليك الشبكة العصبية بكود. سحر!

\n\n

تحليل بنية الطلب

في جسم الطلب، نرسل:

model - أي إصدار من GPT (gpt-3.5-turbo أسرع وأرخص، gpt-4 أذكى).
messages - مصفوفة من الرسائل. يمكن إضافة system (تعليمات للنموذج)، assistant (سياق) و user.
temperature - إبداعية الرد (0 - حقائق صارمة، 1 - إبداع).
max_tokens - أقصى طول للرد بالتوكنات (1 توكن ≈ 0.75 كلمة).

\n\n