OAuth 2.0 وتفويض JWT في JavaScript: دليل كامل للمبتدئين

مقدمة: لماذا OAuth 2.0 و JWT هما معيار التفويض الحديث

في تطوير الويب الحديث، تعتبر المصادقة الآمنة وتفويض المستخدمين من المهام الأساسية. البروتوكولان والتنسيقان الأكثر شيوعًا اللذان يحلان هذه المشكلة هما OAuth 2.0 و JWT (JSON Web Token). على الرغم من استخدامهما معًا في كثير من الأحيان، إلا أنهما شيئان مختلفان: OAuth 2.0 هو بروتوكول تفويض الوصول، بينما JWT هو تنسيق رمز مميز.

في هذه المقالة، سنشرح كيفية عمل OAuth 2.0، وما هو JWT، وكيفية تنفيذهما باستخدام JavaScript (Node.js). المحتوى موجه للمطورين المبتدئين، لذلك سننتقل من النظرية إلى التطبيق مع أمثلة برمجية واضحة.

ما هو OAuth 2.0 وكيف يعمل

OAuth 2.0 (التفويض المفتوح) هو بروتوكول يسمح للتطبيق بالحصول على وصول محدود إلى موارد المستخدم دون نقل اسم المستخدم وكلمة المرور الخاصة به. تخيل أنك تريد تسجيل الدخول إلى موقع عبر Google أو GitHub - هذا هو OAuth 2.0.

الأدوار الرئيسية في OAuth 2.0

• مالك المورد (Resource Owner) — المستخدم الذي يملك البيانات
• العميل (Client) — التطبيق الذي يطلب الوصول
• خادم التفويض (Authorization Server) — الخادم الذي يصدر الرموز المميزة (مثل Google)
• خادم المورد (Resource Server) — الخادم الذي يخزن بيانات المستخدم

تدفق منح رمز التفويض (Authorization Code Grant) (مثال باستخدام Node.js)

أكثر تدفقات OAuth 2.0 شيوعًا وأمانًا هو منح رمز التفويض. دعنا ننظر في تنفيذه باستخدام Express.js.

// تثبيت التبعيات// npm install express axios dotenv

// .envCLIENT_ID=your_client_idCLIENT_SECRET=your_client_secretREDIRECT_URI=http://localhost:3000/callback

const express = require('express');const axios = require('axios');require('dotenv').config();

const app = express();

// الخطوة 1: إعادة توجيه المستخدم إلى صفحة التفويضapp.get('/auth', (req, res) => {    const authUrl = `https://provider.com/oauth/authorize?client_id=${process.env.CLIENT_ID}&redirect_uri=${process.env.REDIRECT_URI}&response_type=code&scope=email`;    res.redirect(authUrl);});

// الخطوة 2: معالجة رد الاتصال مع رمز التفويضapp.get('/callback', async (req, res) => {    const { code } = req.query;

    try {        // استبدال رمز التفويض برمز الوصول        const tokenResponse = await axios.post('https://provider.com/oauth/token', {            client_id: process.env.CLIENT_ID,            client_secret: process.env.CLIENT_SECRET,            code,            redirect_uri: process.env.REDIRECT_URI,            grant_type: 'authorization_code'        });

        const { access_token, refresh_token } = tokenResponse.data;                // حفظ الرموز المميزة (في مشروع حقيقي - في قاعدة البيانات)        req.session.accessToken = access_token;        req.session.refreshToken = refresh_token;

        res.send('تم التفويض بنجاح!');    } catch (error) {        res.status(500).send('خطأ في التفويض');    }});

app.listen(3000, () => console.log('الخادم يعمل على المنفذ 3000'));

JWT (JSON Web Token): الهيكل والإنشاء

JWT هي طريقة مضغوطة ومكتفية ذاتيًا لنقل المعلومات بين الأطراف في شكل كائن JSON. يتكون الرمز المميز من ثلاثة أجزاء مفصولة بنقاط:

• الرأس (Header) — نوع الرمز المميز وخوارزمية التوقيع (مثل HS256)
• الحمولة (Payload) — البيانات (المطالبات) التي نريد نقلها
• التوقيع (Signature) — توقيع يضمن سلامة البيانات

إنشاء JWT في Node.js

للعمل مع JWT، سنستخدم مكتبة jsonwebtoken.

// npm install jsonwebtoken

const jwt = require('jsonwebtoken');

const secretKey = 'مفتاحك_السري