Kiểm tra độ mạnh của mật khẩu bằng JavaScript và Biểu thức chính quy

Kiểm tra độ mạnh của mật khẩu bằng JavaScript và Biểu thức chính quy

Tôi đang thực hiện một số nghiên cứu về việc tìm một ví dụ điển hình về công cụ kiểm tra Độ bền mật khẩu sử dụng JavaScriptBiểu thức chính quy (Regex). Trong ứng dụng tại nơi làm việc của tôi, chúng tôi thực hiện một bài đăng lại để xác minh độ mạnh của mật khẩu và nó khá bất tiện cho người dùng của chúng tôi.

Regex là gì?

Biểu thức chính quy là một chuỗi các ký tự xác định một mẫu tìm kiếm. Thông thường, các mẫu như vậy được sử dụng bởi các thuật toán tìm kiếm chuỗi cho tìm or tìm và thay thế hoạt động trên chuỗi hoặc để xác nhận đầu vào. 

Bài viết này chắc chắn không dạy bạn biểu thức chính quy. Chỉ cần biết rằng khả năng sử dụng Biểu thức chính quy sẽ hoàn toàn đơn giản hóa việc phát triển của bạn khi bạn tìm kiếm các mẫu trong văn bản. Điều quan trọng cần lưu ý là hầu hết các ngôn ngữ phát triển đã tối ưu hóa việc sử dụng biểu thức chính quy… vì vậy thay vì phân tích cú pháp và tìm kiếm chuỗi theo từng bước, Regex thường nhanh hơn nhiều ở cả phía máy chủ và phía máy khách.

Tôi đã tìm kiếm trên web khá nhiều trước khi tìm thấy một ví dụ của một số Biểu thức chính quy tuyệt vời tìm kiếm sự kết hợp của độ dài, ký tự và ký hiệu. Tuy nhiên, mã hơi thừa đối với sở thích của tôi và phù hợp với .NET. Vì vậy, tôi đã đơn giản hóa mã và đặt nó trong JavaScript. Điều này làm cho nó xác thực độ mạnh của mật khẩu trong thời gian thực trên trình duyệt của khách hàng trước khi đăng lại… và cung cấp một số phản hồi cho người dùng về độ mạnh của mật khẩu.

Gõ mật khẩu

Với mỗi hành trình của bàn phím, mật khẩu được kiểm tra dựa trên biểu thức chính quy và sau đó phản hồi được cung cấp cho người dùng trong một khoảng thời gian bên dưới nó.




Nhập mật khẩu

Đây là mã

Mô hình Biểu thức chính quy thực hiện một công việc tuyệt vời là giảm thiểu độ dài của mã:

  • Các ký tự khác - Nếu độ dài dưới 8 ký tự.
  • Yếu - Nếu độ dài dưới 10 ký tự và không chứa sự kết hợp của các ký hiệu, chữ hoa, văn bản.
  • Trung bình - Nếu độ dài từ 10 ký tự trở lên và có sự kết hợp của các ký hiệu, chữ hoa, chữ.
  • Mạnh - XNUMX - Nếu độ dài từ 14 ký tự trở lên và có sự kết hợp của các ký hiệu, chữ viết hoa, văn bản.

<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>

Tăng cường yêu cầu mật khẩu của bạn

Điều cần thiết là bạn không chỉ xác thực việc xây dựng mật khẩu trong Javascript của mình. Điều này sẽ cho phép bất kỳ ai có công cụ phát triển trình duyệt bỏ qua tập lệnh và sử dụng bất kỳ mật khẩu nào họ muốn. Bạn LUÔN LUÔN nên sử dụng kiểm tra phía máy chủ để xác thực độ mạnh của mật khẩu trước khi lưu trữ nó trong nền tảng của bạn.

34 Comments

  1. 1
  2. 2

    CẢM ƠN BẠN! CẢM ƠN BẠN! CẢM ƠN BẠN! Tôi đã bị lừa trong 2 tuần với mã độ mạnh mật khẩu chết tiệt từ các trang web khác và giật tóc. Của bạn ngắn gọn, hoạt động giống như tôi muốn và trên hết, dễ dàng cho một người mới làm quen với javascript! Tôi muốn nắm bắt kết quả về độ bền và không để biểu mẫu đăng thực sự cập nhật mật khẩu của người dùng trừ khi nó đáp ứng được bài kiểm tra độ bền. Mã của người khác quá phức tạp hoặc không hoạt động đúng hoặc thứ gì khác. Tôi mến bạn! XXXXX

  3. 4

    cảm ơn chúa vì những người thực sự có thể viết một đoạn mã đúng cách.
    Có kinh nghiệm tương tự như Janis.

    Điều này hoạt động ngay lập tức, hoàn hảo cho những người như tôi, những người không thể viết mã javascript!

  4. 5
  5. 6

    Xin chào, trước hết cảm ơn rất nhiều vì những nỗ lực của bạn, tôi đã cố gắng sử dụng cái này với Asp.net nhưng không hoạt động, tôi đang sử dụng

    thay vì thẻ, và nó không hoạt động, bất kỳ đề xuất nào ?!

  6. 7

    Tới Nisreen: mã trong hộp được tô sáng không hoạt động với hương vị dễ thương. Trích dẫn duy nhất là lộn xộn. Tuy nhiên, mã của liên kết trình diễn là tốt.

  7. 8
  8. 9
  9. 10
  10. 11

    “P @ s $ w0rD” hiển thị ở mức mạnh, mặc dù nó sẽ bị bẻ khóa khá nhanh với một cuộc tấn công hai chiều…
    Để triển khai một tính năng như vậy trên một giải pháp chuyên nghiệp, tôi tin rằng điều quan trọng là phải kết hợp thuật toán này với kiểm tra nhị phân.

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

    ai đó có thể cho biết, tại sao nó không hoạt động của tôi ..

    Tôi đã sao chép tất cả mã và dán nó vào notepad ++, nhưng nó không hoạt động?
    làm ơn giúp tôi..

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

    Loại "máy kiểm tra sức mạnh" này dẫn mọi người xuống một con đường rất nguy hiểm. Nó coi trọng tính đa dạng của ký tự hơn độ dài của cụm mật khẩu, dẫn đến việc đánh giá mật khẩu ngắn hơn, đa dạng hơn là mạnh hơn mật khẩu dài hơn, ít đa dạng hơn. Đó là một sai lầm sẽ khiến người dùng của bạn gặp rắc rối nếu họ từng phải đối mặt với một mối đe dọa tấn công nghiêm trọng.

    • 25

      Tôi không đồng ý, Jordan! Ví dụ đơn giản được đưa ra như một ví dụ về tập lệnh. Khuyến nghị của tôi cho mọi người là sử dụng công cụ quản lý mật khẩu để tạo các cụm mật khẩu độc lập cho bất kỳ trang web nào là duy nhất của nó. Cảm ơn!

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

    Tôi đánh giá cao sự chia sẻ của bạn! Tôi đã tìm cách tăng cường độ mạnh của mật khẩu trên trang web của chúng tôi và cái này đã hoạt động theo cách tôi muốn. Cảm ơn bạn rất nhiều!

  29. 33

    Bạn là một người tiết kiệm trực tiếp! Tôi đã phân tích cú pháp chuỗi trái phải và giữa và nghĩ rằng có một cách tốt hơn và tìm thấy đoạn mã của bạn bằng cách sử dụng Regex. Đã có thể mày mò với nó cho trang web của tôi… Bạn không biết điều này đã giúp ích bao nhiêu. Cảm ơn Douglas rất nhiều !!

Bạn nghĩ gì?

Trang web này sử dụng Akismet để giảm spam. Tìm hiểu cách xử lý dữ liệu nhận xét của bạn.