تحقق من قوة كلمة المرور باستخدام JavaScript والتعبيرات العادية

تحقق من قوة كلمة المرور باستخدام JavaScript والتعبيرات العادية

كنت أقوم ببعض الأبحاث حول العثور على مثال جيد لمدقق قوة كلمة المرور الذي يستخدم جافا سكريبت و التعبيرات العادية (ريجكس). في التطبيق الذي أقوم به في عملي ، نقوم بإعادة نشر للتحقق من قوة كلمة المرور وهذا غير مريح تمامًا لمستخدمينا.

ما هو Regex؟

التعبير العادي هو سلسلة من الأحرف التي تحدد نمط البحث. عادة ، يتم استخدام هذه الأنماط عن طريق خوارزميات البحث عن السلسلة تجد or إيجاد واستبدال عمليات على السلاسل ، أو للتحقق من صحة الإدخال. 

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

لقد بحثت في الويب قليلاً قبل أن أجد مثال لبعض التعبيرات العادية الرائعة التي تبحث عن مجموعة من الطول والأحرف والرموز. Howver ، كان الرمز مفرطًا بعض الشيء بالنسبة لذوقي ومصمم لـ .NET. لذلك قمت بتبسيط الكود ووضعه في JavaScript. هذا يجعله يتحقق من قوة كلمة المرور في الوقت الفعلي على متصفح العميل قبل إعادة نشرها ... ويقدم بعض الملاحظات للمستخدم حول قوة كلمة المرور.

اكتب كلمة السر

مع كل ضغطة على لوحة المفاتيح ، يتم اختبار كلمة المرور مقابل التعبير العادي ثم يتم تقديم الملاحظات للمستخدم في فترة تحتها.




أكتب كلمة المرور

ها هي المدونة

وقت الاستحمام اصبح اكثر متعة التعبيرات العادية قم بعمل رائع لتقليل طول الكود:

  • المزيد من الشخصيات - إذا كان الطول أقل من 8 أحرف.
  • ضعيف - إذا كان الطول أقل من 10 أحرف ولا يحتوي على مجموعة من الرموز والأحرف الكبيرة والنص.
  • متوسط - إذا كان الطول 10 أحرف أو أكثر وكان يحتوي على مجموعة من الرموز والأحرف الكبيرة والنص.
  • قوي - إذا كان الطول 14 حرفًا أو أكثر ويحتوي على مجموعة من الرموز والأحرف الكبيرة والنص.

<script language="javascript">
    function passwordChanged() {
        var strength = document.getElementById('strength');
        var strongRegex = new RegExp("^(?=.{14,})(?=.*[A-Z])(?=.*[a-z])(?=.*[0-9])(?=.*\\W).*$", "g");
        var mediumRegex = new RegExp("^(?=.{10,})(((?=.*[A-Z])(?=.*[a-z]))|((?=.*[A-Z])(?=.*[0-9]))|((?=.*[a-z])(?=.*[0-9]))).*$", "g");
        var enoughRegex = new RegExp("(?=.{8,}).*", "g");
        var pwd = document.getElementById("password");
        if (pwd.value.length == 0) {
            strength.innerHTML = 'Type Password';
        } else if (false == enoughRegex.test(pwd.value)) {
            strength.innerHTML = 'More Characters';
        } else if (strongRegex.test(pwd.value)) {
            strength.innerHTML = '<span style="color:green">Strong!</span>';
        } else if (mediumRegex.test(pwd.value)) {
            strength.innerHTML = '<span style="color:orange">Medium!</span>';
        } else {
            strength.innerHTML = '<span style="color:red">Weak!</span>';
        }
    }
</script>
<input name="password" id="password" type="text" size="15" maxlength="100" onkeyup="return passwordChanged();" />
<span id="strength">Type Password</span>

تشديد طلب كلمة المرور الخاصة بك

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

34 تعليقات

  1. 1
  2. 2

    شكرا لكم! شكرا لكم! شكرا لكم! لقد كنت أخدع لمدة أسبوعين باستخدام رمز قوة كلمة المرور من مواقع الويب الأخرى وسحب شعري. قصتك قصيرة ، تعمل تمامًا كما أريد والأفضل من ذلك كله ، من السهل على مبتدئ جافا سكريبت تعديلها! كنت أرغب في الحصول على حكم القوة وعدم السماح للنموذج بنشر لتحديث كلمة مرور المستخدم فعليًا ما لم يفي باختبار القوة. كان رمز الأشخاص الآخرين معقدًا جدًا أو لا يعمل بشكل صحيح أو أي شيء آخر. انا احبك! XXXXX

  3. 4

    الحمد لله على الأشخاص الذين يمكنهم بالفعل كتابة جزء من التعليمات البرمجية بشكل صحيح.
    كانت لديها نفس تجربة جانيس.

    هذا يعمل مباشرة خارج الصندوق وهو مثالي للأشخاص مثلي الذين لا يستطيعون كود جافا سكريبت!

  4. 5
  5. 6

    مرحبًا ، بادئ ذي بدء ، شكرًا جزيلاً على جهودك ، لقد حاولت استخدام هذا مع Asp.net ولكن لم ينجح ، فأنا

    بدلاً من الوسم ولم تنجح أي اقتراحات ؟!

  6. 7

    إلى نسرين: الكود الموجود في المربع المميز لا يعمل مع "قص ولصق". اقتباس واحد عابث. ومع ذلك ، فإن كود رابط العرض جيد.

  7. 8

    مرحبًا ، أنا أحب السيناريو الخاص بك! لقد ترجمتها إلى الهولندية ، ونشرتها في المنتدى الخاص بي هنا!

  8. 9
  9. 10
  10. 11

    يظهر "P @ s $ w0rD" بقوة ، على الرغم من أنه سيتم تصدعها سريعًا إلى حد ما بهجوم القواميس ...
    لنشر مثل هذه الميزة في حل احترافي ، أعتقد أنه من المهم دمج هذه الخوارزمية مع فحص القواميس.

  11. 12
  12. 13

    شكرًا على هذا الرمز الصغير ، يمكنني الآن استخدامه لاختبار قوة كلمة المرور الخاصة بي عندما يقوم زواري بإدخال كلمات المرور الخاصة بهم ،

  13. 14
  14. 15
  15. 16
  16. 17
  17. 18
  18. 19

    هل يمكن لأحد أن يقول لماذا لم يعمل لي ..

    لقد قمت بنسخ كل الكود ولصقه في notepad ++ ، لكنه لا يعمل على الإطلاق؟
    الرجاء مساعدتي..

  19. 20
  20. 21
  21. 22
  22. 23
  23. 24

    هذا النوع من "مدقق القوة" يقود الناس إلى طريق خطير للغاية. يقدّر تنوع الأحرف على طول عبارة المرور ، مما يؤدي إلى تصنيف كلمات المرور الأقصر والأكثر تنوعًا على أنها أقوى من كلمات المرور الأطول والأقل تنوعًا. هذه مغالطة ستؤدي إلى وقوع المستخدمين في المشاكل إذا واجهوا تهديدًا خطيرًا بالقرصنة.

    • 25

      انا لا اوافق جوردان! تم وضع المثال ببساطة كمثال على السيناريو. توصيتي للأشخاص باستخدام أداة إدارة كلمات المرور لإنشاء عبارات مرور مستقلة لأي موقع فريد بالنسبة إليه. شكر!

  24. 26
  25. 27
  26. 28
  27. 29
  28. 31

    أنا أقدر لك المشاركة! كنت أتطلع إلى تعزيز قوة كلمة المرور على موقعنا الإلكتروني وعمل هذا بالطريقة التي أردتها. شكرا جزيلا لك!

  29. 33

    أنت مدخر حي! كنت أقوم بتحليل السلاسل إلى اليسار واليمين والوسط واعتقدت أن هناك طريقة أفضل ووجدت قطعة الكود الخاصة بك باستخدام Regex. تمكنت من التعامل معها لموقعي ... ليس لديك فكرة عن مدى فائدة ذلك. شكرا جزيلا دوغلاس !!

ما رأيك؟

يستخدم هذا الموقع نظام Akismet لتقليل الرسائل الضارة. تعرف كيف تتم معالجة بيانات تعليقك.