رموز JWT في TypeScript: دليل شامل للعمل مع JSON Web Tokens

رموز JWT في TypeScript: دليل شامل

JSON Web Token (JWT) هو معيار مفتوح (RFC 7519) لإنشاء رموز وصول تعتمد على تنسيق JSON. يُستخدم JWT على نطاق واسع للمصادقة وتبادل المعلومات بين العميل والخادم. في هذه المقالة، سنشرح بالتفصيل كيفية العمل مع رموز JWT في TypeScript باستخدام المكتبات الشائعة وأفضل الممارسات.

ما هو JWT؟

يتكون JWT من ثلاثة أجزاء مفصولة بنقاط:

• Header (الرأس) — يحتوي على معلومات حول نوع الرمز وخوارزمية التوقيع
• Payload (الحمولة) — يحتوي على البيانات (المطالبات)، مثل معرف المستخدم والدور وتاريخ انتهاء الصلاحية
• Signature (التوقيع) — يتم إنشاؤه من الرأس والحمولة والمفتاح السري

شكل JWT النموذجي:

eyJhbGciOiJIUzI1NiIsInR5cCI6IkpXVCJ9.eyJzdWIiOiIxMjM0NTY3ODkwIiwibmFtZSI6IkpvaG4gRG9lIiwiaWF0IjoxNTE2MjM5MDIyfQ.SflKxwRJSMeKKF2QT4fwpMeJf36POk6yJV_adQssw5c

تثبيت المكتبات للعمل مع JWT في TypeScript

للعمل مع JWT في TypeScript، سنستخدم مكتبة jsonwebtoken مع الأنواع @types/jsonwebtoken.

npm install jsonwebtokennpm install --save-dev @types/jsonwebtoken

إنشاء رمز JWT في TypeScript

لننظر إلى مثال لإنشاء رمز JWT مع حمولة محددة النوع:

import jwt from 'jsonwebtoken';

// تعريف واجهة للحمولةinterface TokenPayload {    userId: string;    email: string;    role: 'user' | 'admin';}

// المفتاح السري (في المشروع الحقيقي، قم بتخزينه في .env)const JWT_SECRET = 'your-super-secret-key';

// إنشاء الرمزfunction generateToken(payload: TokenPayload): string {    return jwt.sign(payload, JWT_SECRET, {        expiresIn: '1h', // الرمز صالح لمدة ساعة واحدة        issuer: 'pythonlib.ru',        subject: payload.userId    });}

// مثال على الاستخدامconst userPayload: TokenPayload = {    userId: '12345',    email: 'user@example.com',    role: 'user'};

const token = generateToken(userPayload);console.log('الرمز المُنشأ:', token);

التحقق من JWT وفك تشفيره

للتحقق من صحة الرمز واستخراج البيانات، استخدم الكود التالي:

import jwt, { JwtPayload, VerifyErrors } from 'jsonwebtoken';

interface DecodedToken extends JwtPayload {    userId: string;    email: string;    role: 'user' | 'admin';}

function verifyToken(token: string): DecodedToken | null {    try {        const decoded = jwt.verify(token, JWT_SECRET) as DecodedToken;        return decoded;    } catch (error) {        if (error instanceof jwt.TokenExpiredError) {            console.error('انتهت صلاحية الرمز');        } else if (error instanceof jwt.JsonWebTokenError) {            console.error('رمز غير صالح');        } else {            console.error('خطأ في التحقق:', error);        }        return null;    }}

// التحقق من الرمزconst decoded = verifyToken(token);if (decoded) {    console.log('بيانات الرمز:', decoded);    console.log('دور المستخدم:', decoded.role);}

Middleware لـ Express.js مع TypeScript

دمج التحقق من JWT في Express middleware مع تحديد الأنواع الكامل:

import { Request, Response, NextFunction } from 'express';import jwt from 'jsonwebtoken';

// توسيع واجهة Request لتخزين بيانات المستخدمinterface AuthRequest extends Request {    user?: {        userId: string;        email: string;        role: 'user' | 'admin';    };}

function authMiddleware(req: AuthRequest, res: Response, next: NextFunction): void {    const authHeader = req.headers.authorization;

    if (!authHeader || !authHeader.startsWith('Bearer ')) {        res.status(401).json({ message: 'To'