مقدمة سريعة إلى OAuth باستخدام Passport.js

ما هو بروتوكول OAuth؟

OAuth (التفويض المفتوح) هو بروتوكول تفويض. يمكن لتطبيق طرف ثالث استخدامه للوصول إلى بيانات المستخدم من موقع (مثل Google أو Twitter) دون الكشف عن كلمة المرور الخاصة بهم. تقدم مواقع مثل Quora و Medium و AirBnb والعديد من المواقع الأخرى المصادقة باستخدام OAuth.

يجعل OAuth حياتنا أكثر بساطة من خلال التخلص من الحاجة إلى تذكر كلمة المرور لكل حساب تقوم بإنشائه على أي موقع تقريبًا. عليك فقط تذكر كلمة مرور الحساب الرئيسية لموفر OAuth الخاص بك.

ما هو Passport.js؟

Passport عبارة عن برنامج وسيط يقوم بتنفيذ المصادقة على تطبيقات الويب المستندة إلى Express. يوفر أكثر من 500+ استراتيجية. ما هي هذه الاستراتيجيات؟ يتم استخدام الاستراتيجيات لمصادقة الطلبات. كل استراتيجية لها حزمة npm خاصة بها (مثل جواز السفر-تويتر ، جواز السفر-جوجل-أوث 20). يجب تكوين الإستراتيجية قبل الاستخدام.

لماذا تستخدم Passport.js؟

فيما يلي ستة أسباب توضح لماذا يجب عليك استخدام Passport:

  • إنه خفيف الوزن
  • شكلي بسهولة
  • يدعم الجلسات المستمرة
  • يقدم OAuth
  • يوفر وحدات منفصلة لكل استراتيجية
  • يمنحك القدرة على تنفيذ استراتيجيات مخصصة

دعونا نبني شيئا

للبدء ، نحتاج إلى تثبيت جواز السفر من NPM:

npm install passport 

سنقوم ببناء تطبيق بسيط يمنح المستخدم الوصول إلى مسار سري فقط إذا قاموا بتسجيل الدخول. سأستخدم إستراتيجية جواز السفر google-oauth20 في هذا البرنامج التعليمي. لا تتردد في استخدام أي إستراتيجية أخرى تفضلها ، ولكن تأكد من مراجعة المستندات لمعرفة كيفية تكوينها.

قبل المتابعة ، نحتاج إلى معرف العميل وسر العميل. للحصول على واحد ، توجه إلى //console.developers.google.com وأنشئ مشروعًا جديدًا. ثم انتقل إلى تمكين واجهات برمجة التطبيقات والخدمات وتمكين واجهة برمجة تطبيقات Google+. حدد API وانقر فوق إنشاء بيانات الاعتماد.

املأ النموذج واستخدم نفس عنوان URL لمعاودة الاتصال في كل من النموذج والملف. تأكد من قراءة التعليقات على الكود لمعرفة كيف يتناسب كل شيء معًا.

app.js

// Required dependencies const express = require('express'); const app = express(); const passport = require('passport'); const GoogleStrategy = require('passport-google-oauth20'); const cookieSession = require('cookie-session'); // cookieSession config app.use(cookieSession({ maxAge: 24 * 60 * 60 * 1000, // One day in milliseconds keys: ['randomstringhere'] })); app.use(passport.initialize()); // Used to initialize passport app.use(passport.session()); // Used to persist login sessions // Strategy config passport.use(new GoogleStrategy({ clientID: 'YOUR_CLIENTID_HERE', clientSecret: 'YOUR_CLIENT_SECRET_HERE', callbackURL: '//localhost:8000/auth/google/callback' }, (accessToken, refreshToken, profile, done) => { done(null, profile); // passes the profile data to serializeUser } )); // Used to stuff a piece of information into a cookie passport.serializeUser((user, done) => { done(null, user); }); // Used to decode the received cookie and persist session passport.deserializeUser((user, done) => { done(null, user); }); // Middleware to check if the user is authenticated function isUserAuthenticated(req, res, next) { if (req.user) { next(); } else { res.send('You must login!'); } } // Routes app.get('/', (req, res) => { res.render('index.ejs'); }); // passport.authenticate middleware is used here to authenticate the request app.get('/auth/google', passport.authenticate('google', { scope: ['profile'] // Used to specify the required data })); // The middleware receives the data from Google and runs the function on Strategy config app.get('/auth/google/callback', passport.authenticate('google'), (req, res) => { res.redirect('/secret'); }); // Secret route app.get('/secret', isUserAuthenticated, (req, res) => { res.send('You have reached the secret route'); }); // Logout route app.get('/logout', (req, res) => { req.logout(); res.redirect('/'); }); app.listen(8000, () => { console.log('Server Started!'); }); 

الفهرس ejs


    
  • Login
  • Secret
  • Logout

كما ترى ، لقد أنشأنا /secretمسارًا ، وامنحنا حق الوصول إليه فقط إذا تمت مصادقة المستخدم. للتحقق من مصادقة المستخدم ، قمنا بإنشاء برمجية وسيطة تتحقق مما إذا كان الطلب يحتوي على كائن المستخدم. أخيرًا ، لتسجيل الخروج ، استخدمنا req.logout()الطريقة التي يوفرها جواز السفر لمسح الجلسة.

فيما يلي بعض الموارد لمعرفة المزيد عن جواز السفر

الوثائق الرسمية لـ Passport.js

مصادقة بسيطة وغير مزعجة لـ Node.js www.passportjs.org

استنتاج

لقد رأينا استراتيجية واحدة فقط هنا. هناك أكثر من 500+. أوصي بشدة بالاطلاع على الوثائق الرسمية لـ Passport ومعرفة ما يقدمونه أيضًا. شكرا لك على وقتك لقراءة هذا. لا تتردد في التواصل معي على LinkedIn و Twitter و GitHub. أتمنى لك الحظ الجيد!

المقال السابق

مقدمة سريعة للتصميم متعدد الأبعاد باستخدام Materialize

ما هو التصميم متعدد الأبعاد؟ medium.freecodecamp.org