المصادقة مع Firebase باستخدام حسابات مستندة إلى كلمة المرور باستخدام JavaScript

يمكنك استخدام Firebase Authentication للسماح للمستخدمين بالمصادقة باستخدام Firebase من خلال عناوين بريدهم الإلكتروني وكلمات المرور، ولإدارة الحسابات المستندة إلى كلمات المرور في تطبيقك.

للحصول على مساعدة من الذكاء الاصطناعي، انسخ الطلب أدناه إلى وكيل الترميز المستنِد إلى الذكاء الاصطناعي (مثل Antigravity وClaude Code وCodex وCursor). يمكنك تخصيص الطلب وتكراره مع الوكيل. يمكنك الانتقال إلى مهارات وكلاء Firebase للحصول على معلومات مفصّلة حول التثبيت.

Help me use Firebase in my app.
1. Make sure that **Firebase agent skills** are installed and updated. For Claude Code, Codex, or Cursor agents, help me install the Firebase plugin. For other agents, run `npx skills add firebase/agent-skills`. Always try to use **Firebase agent skills** for Firebase-related tasks.
2. Help me set up and use Firebase Authentication with email and password authentication in my app.

قبل البدء

  1. أضِف Firebase إلى مشروع JavaScript.
  2. إذا لم يسبق لك ربط تطبيقك بمشروعك على Firebase، يمكنك إجراء ذلك من وحدة تحكّم Firebase.
  3. فعِّل خيار "البريد الإلكتروني/كلمة المرور" كموفّر تسجيل دخول لمشروعك على Firebase:
    1. في وحدة تحكّم Firebase، انتقِل إلى الأمان > المصادقة.
    2. في علامة التبويب طريقة تسجيل الدخول، فعِّل موفّر خدمة تسجيل الدخول البريد الإلكتروني/كلمة المرور.
    3. انقر على حفظ.

إنشاء حساب مستند إلى كلمة مرور

لإنشاء حساب مستخدم جديد باستخدام كلمة مرور، أكمِل الخطوات التالية في صفحة الاشتراك في تطبيقك:

  1. عندما يشترك مستخدم جديد باستخدام نموذج الاشتراك في تطبيقك، عليك إكمال أي خطوات جديدة للتحقّق من صحة الحساب يتطلّبها تطبيقك، مثل التأكّد من كتابة كلمة مرور الحساب الجديد بشكل صحيح واستيفائها لمتطلبات التعقيد.
  2. أنشئ حسابًا جديدًا عن طريق إدخال عنوان البريد الإلكتروني وكلمة المرور الخاصَّين بالمستخدم الجديد إلى createUserWithEmailAndPassword:

    Web

    import { getAuth, createUserWithEmailAndPassword } from "firebase/auth";
    
    const auth = getAuth();
    createUserWithEmailAndPassword(auth, email, password)
      .then((userCredential) => {
        // Signed up 
        const user = userCredential.user;
        // ...
      })
      .catch((error) => {
        const errorCode = error.code;
        const errorMessage = error.message;
        // ..
      });

    Web

    firebase.auth().createUserWithEmailAndPassword(email, password)
      .then((userCredential) => {
        // Signed in 
        var user = userCredential.user;
        // ...
      })
      .catch((error) => {
        var errorCode = error.code;
        var errorMessage = error.message;
        // ..
      });
    إذا تم إنشاء الحساب الجديد، يتم تسجيل دخول المستخدم تلقائيًا. اطّلِع على قسم "الخطوات التالية" أدناه للحصول على تفاصيل المستخدم الذي سجّل الدخول.

    يمكنك أيضًا رصد الأخطاء والتعامل معها في هذا القسم. للاطّلاع على قائمة برموز الخطأ، يمكنك الرجوع إلى مستندات Auth المرجعية.

تسجيل دخول مستخدم باستخدام عنوان بريد إلكتروني وكلمة مرور

تتشابه خطوات تسجيل دخول مستخدم باستخدام كلمة مرور مع خطوات إنشاء حساب جديد. في صفحة تسجيل الدخول إلى تطبيقك، اتّبِع الخطوات التالية:

  1. عندما يسجّل المستخدم الدخول إلى تطبيقك، مرِّر عنوان البريد الإلكتروني وكلمة المرور إلى signInWithEmailAndPassword:

    Web

    import { getAuth, signInWithEmailAndPassword } from "firebase/auth";
    
    const auth = getAuth();
    signInWithEmailAndPassword(auth, email, password)
      .then((userCredential) => {
        // Signed in 
        const user = userCredential.user;
        // ...
      })
      .catch((error) => {
        const errorCode = error.code;
        const errorMessage = error.message;
      });

    Web

    firebase.auth().signInWithEmailAndPassword(email, password)
      .then((userCredential) => {
        // Signed in
        var user = userCredential.user;
        // ...
      })
      .catch((error) => {
        var errorCode = error.code;
        var errorMessage = error.message;
      });
    اطّلِع على قسم "الخطوات التالية" أدناه للحصول على تفاصيل المستخدم الذي سجّل الدخول.

    يمكنك أيضًا رصد الأخطاء والتعامل معها في هذا القسم. للاطّلاع على قائمة برموز الخطأ، يمكنك الرجوع إلى مستندات Auth المرجعية.

يُنصح بما يلي: ضبط سياسة كلمات المرور

يمكنك تحسين أمان الحساب من خلال فرض متطلبات تعقيد كلمات المرور.

لضبط سياسة كلمات المرور لمشروعك، افتح قسم سياسة كلمات المرور في علامة التبويب الأمان > المصادقة > الإعدادات في وحدة تحكّم Firebase:

إعدادات المصادقة

تتيح سياسات كلمات المرور Firebase Authentication متطلبات كلمات المرور التالية:

  • يجب إدخال حرف صغير

  • يجب إدخال حرف كبير

  • يجب إدخال رمز رقمي

  • يجب إدخال حرف غير أبجدي رقمي

    تستوفي الأحرف التالية متطلّبات الأحرف غير الأبجدية الرقمية: ^ $ * . [ ] { } ( ) ? " ! @ # % & / \ , > < ' : ; | _ ~

  • الحد الأدنى لطول كلمة المرور (يتراوح من 6 إلى 30 حرفًا، والقيمة التلقائية هي 6)

  • الحد الأقصى لطول كلمة المرور (الحد الأقصى للطول هو 4,096 حرفًا)

يمكنك تفعيل فرض سياسة كلمات المرور في وضعَين:

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

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

يُطلب من المستخدمين الجدد دائمًا اختيار كلمة مرور تتوافق مع سياستك.

إذا كان لديك مستخدمون نشطون، ننصحك بعدم تفعيل خيار "فرض الترقية عند تسجيل الدخول" إلا إذا كنت تنوي حظر وصول المستخدمين الذين لا تتوافق كلمات مرورهم مع سياستك. بدلاً من ذلك، استخدِم وضع الإشعار الذي يتيح للمستخدمين تسجيل الدخول باستخدام كلمات المرور الحالية وإبلاغهم بالمتطلبات التي لا تستوفيها كلمات المرور.

التحقّق من صحة كلمة المرور على جهاز العميل

import { getAuth, validatePassword } from "firebase/auth";
const status = await validatePassword(getAuth(), passwordFromUser);
if (!status.isValid) {
  // Password could not be validated. Use the status to show what
  // requirements are met and which are missing.

  // If a criterion is undefined, it is not required by policy. If the
  // criterion is defined but false, it is required but not fulfilled by
  // the given password. For example:
  const needsLowerCase = status.containsLowercaseLetter !== true;
}

ننصحك بتفعيل ميزة "الحماية من تعداد عناوين البريد الإلكتروني"

تُظهر بعض طرق Firebase Authentication التي تتلقّى عناوين البريد الإلكتروني كمعلَمات أخطاءً محدّدة إذا كان عنوان البريد الإلكتروني غير مسجّل عندما يجب أن يكون مسجّلاً (على سبيل المثال، عند تسجيل الدخول باستخدام عنوان بريد إلكتروني وكلمة مرور)، أو مسجّلاً عندما يجب أن يكون غير مستخدَم (على سبيل المثال، عند تغيير عنوان البريد الإلكتروني لمستخدم). على الرغم من أنّ هذه الطريقة قد تكون مفيدة في اقتراح حلول محدّدة للمستخدمين، إلا أنّ الجهات المسيئة قد تستغلّها أيضًا للتعرّف على عناوين البريد الإلكتروني التي سجّلها المستخدمون.

للحدّ من هذا الخطر، ننصحك بالتأكّد من تفعيل الحماية من تعداد عناوين البريد الإلكتروني لمشروعك. يمكنك التحقّق من هذا الإعداد في وحدة تحكّم Firebase: انتقِل إلى علامة التبويب الأمان > المصادقة > الإعدادات، ثم انقر على إجراءات المستخدم.

يُرجى العِلم أنّ تفعيل هذه الميزة يغيّر سلوك إعداد تقارير الأخطاء في Firebase Authentication، لذا تأكَّد من أنّ تطبيقك لا يعتمد على الأخطاء الأكثر تحديدًا.

الخطوات التالية

بعد أن يسجّل المستخدم الدخول للمرة الأولى، يتم إنشاء حساب مستخدم جديد وربطه ببيانات الاعتماد، أي اسم المستخدم وكلمة المرور أو رقم الهاتف أو معلومات مقدّم خدمة المصادقة التي سجّل المستخدم الدخول بها. يتم تخزين هذا الحساب الجديد كجزء من مشروع Firebase، ويمكن استخدامه لتحديد هوية المستخدم على مستوى كل تطبيق في مشروعك، بغض النظر عن طريقة تسجيل الدخول.

  • في تطبيقاتك، الطريقة المقترَحة لمعرفة حالة المصادقة للمستخدم هي ضبط مراقب على العنصر Auth. يمكنك بعد ذلك الحصول على معلومات الملف الشخصي الأساسية للمستخدم من الكائن User. راجِع مقالة إدارة المستخدمين.

  • في Firebase Realtime Database وCloud Storage قواعد الأمان، يمكنك الحصول على معرّف المستخدِم الفريد للمستخدِم الذي سجّل الدخول من المتغيّر auth، واستخدامه للتحكّم في البيانات التي يمكن للمستخدِم الوصول إليها.

يمكنك السماح للمستخدمين بتسجيل الدخول إلى تطبيقك باستخدام موفّري مصادقة متعدّدين من خلال ربط بيانات اعتماد موفّر المصادقة بحساب مستخدم حالي.

لتسجيل خروج مستخدم، اتّصِل بالرقم signOut:

Web

import { getAuth, signOut } from "firebase/auth";

const auth = getAuth();
signOut(auth).then(() => {
  // Sign-out successful.
}).catch((error) => {
  // An error happened.
});

Web

firebase.auth().signOut().then(() => {
  // Sign-out successful.
}).catch((error) => {
  // An error happened.
});