Giới thiệuCho phép người dùng đăng nhập vào ứng dụng của bạn là một trong những tính năng phổ biến nhất mà bạn sẽ thêm vào các ứng dụng web của mình. Bạn có thể thêm xác thực vào ứng dụng bình của mình với gói Flask-Login. Show
Trong hướng dẫn này, bạn sẽ:
Bạn sẽ xây dựng một trang đăng ký và một trang đăng nhập cho phép người dùng đăng nhập và truy cập các trang được bảo vệ. Bạn sẽ sử dụng thông tin từ mô hình 5 và hiển thị nó trên các trang được bảo vệ khi người dùng đăng nhập để mô phỏng cấu hình sẽ như thế nào.Lưu ý: Hướng dẫn này bị giới hạn trong phạm vi và không bao gồm các phiên nâng cao của các phiên. Hơn nữa, việc sửa đổi loại dữ liệu cho khóa chính hoặc các cân nhắc để di chuyển sang các hệ thống cơ sở dữ liệu khác nhau cũng nằm ngoài phạm vi của hướng dẫn giới thiệu này. This tutorial is limited in scope and does not cover advanced persisting of sessions. Furthermore, modifying the data type for the primary key or considerations for migrating to different database systems are also outside of the scope of this introductory tutorial. Mã nguồn cho dự án này có sẵn trên GitHub. Điều kiện tiên quyếtĐể hoàn thành hướng dẫn này, bạn sẽ cần những điều sau đây:
Dưới đây là một sơ đồ để cung cấp cảm giác về cấu trúc tệp của dự án sẽ trông như thế nào khi bạn đã hoàn thành hướng dẫn:
Khi bạn tiến bộ thông qua hướng dẫn, bạn sẽ tạo các thư mục và tệp này. Hướng dẫn này đã được xác minh bằng 7 V3.36.0, 8 V3.9.8, 9 V2.0.2, 0 V0.5.0 và 1 v2.5.1.Bước 1 - Cài đặt góiCó ba gói chính bạn cần cho dự án của mình:
Bạn sẽ sử dụng SQLite để tránh phải cài đặt bất kỳ phụ thuộc bổ sung nào cho cơ sở dữ liệu. Đầu tiên, bắt đầu với việc tạo thư mục dự án:
Tiếp theo, điều hướng đến thư mục dự án:
Bạn sẽ muốn tạo ra một môi trường Python nếu bạn không có. Tùy thuộc vào cách mà Python được cài đặt trên máy của bạn, lệnh của bạn sẽ trông tương tự như:
Cờ 2 dành cho 3. Lệnh này sẽ thực thi mô -đun 4 để tạo môi trường ảo mới có tên 5. Điều này sẽ tạo ra một thư mục mới chứa các thư mục 6, 7 và 8. Và một tệp 9.Tiếp theo, chạy lệnh sau:
Lệnh này sẽ kích hoạt môi trường ảo. Chạy lệnh sau từ môi trường ảo của bạn để cài đặt các gói cần thiết:
Bây giờ bạn đã cài đặt các gói, bạn đã sẵn sàng để tạo tệp ứng dụng chính. Bước 2 - Tạo tệp ứng dụng chínhHãy bắt đầu bằng cách tạo một thư mục 0:
Tệp đầu tiên sẽ là tệp 1 cho dự án:
Ứng dụng này sẽ sử dụng mẫu nhà máy ứng dụng Flask với bản thiết kế. Một kế hoạch chi tiết xử lý các tuyến đường thông thường, bao gồm chỉ mục và trang hồ sơ được bảo vệ. Một kế hoạch chi tiết khác xử lý mọi thứ liên quan đến auth. Trong một ứng dụng thực sự, bạn có thể phá vỡ chức năng theo bất kỳ cách nào bạn muốn, nhưng giải pháp được đề cập ở đây sẽ hoạt động tốt cho hướng dẫn này. Tệp này sẽ có chức năng để tạo ứng dụng, sẽ khởi tạo cơ sở dữ liệu và đăng ký bản thiết kế. Hiện tại, điều này sẽ không làm được gì nhiều, nhưng nó sẽ cần thiết cho phần còn lại của ứng dụng. Bạn sẽ cần khởi tạo sqlalchemy, đặt một số giá trị cấu hình và đăng ký bản thiết kế ở đây: project/__init__.py
Bây giờ bạn có tệp ứng dụng chính, bắt đầu thêm vào các tuyến đường. Bước 3 - Thêm tuyến đườngĐối với các tuyến đường, bạn sẽ sử dụng hai bản thiết kế. Đối với 2, bạn sẽ có một trang chủ ( 3) và một trang hồ sơ ( 4).Đầu tiên, tạo 5:
Sau đó, thêm 2 của bạn:project/main.py 0Đối với 7, bạn sẽ có các tuyến đường để truy xuất cả trang đăng nhập ( 8) và trang đăng ký ( 9). Cuối cùng, bạn sẽ có một tuyến đường đăng xuất ( 0) để đăng xuất một người dùng đang hoạt động.Tiếp theo, tạo 1: 1Sau đó, thêm 7 của bạn:project/auth.py 2Trong thời gian này, xác định 3, 4 và 5 với trả về văn bản. Bạn cũng sẽ có các tuyến đường để xử lý các yêu cầu POST từ 3 và 4. Bạn sẽ xem lại mã này sau và cập nhật nó với chức năng mong muốn.Trong một thiết bị đầu cuối, bạn có thể đặt các giá trị 8 và 9: 3Biến môi trường 8 hướng dẫn Bình về cách tải ứng dụng. Bạn sẽ muốn điều này chỉ ra vị trí 1. Đối với hướng dẫn này, bạn sẽ chỉ vào thư mục 0.Biến môi trường 9 được bật bằng cách đặt nó thành 4. Điều này sẽ cho phép trình gỡ lỗi sẽ hiển thị các lỗi ứng dụng trong trình duyệt.Đảm bảo rằng bạn đang ở trong thư mục 5 và sau đó chạy dự án: 4Bây giờ, trong một trình duyệt web, bạn có thể điều hướng đến năm URL có thể và xem văn bản được trả về được xác định trong 1 và 5.Ví dụ: truy cập hiển thị 8: 9:Khi bạn đã xác minh rằng các tuyến đường đang hoạt động như mong đợi, bạn có thể tạo các mẫu. Bước 4 - Tạo mẫuTiếp theo, tạo các mẫu được sử dụng trong ứng dụng. Đây là bước đầu tiên trước khi bạn có thể thực hiện chức năng đăng nhập thực tế. Ứng dụng sẽ sử dụng bốn mẫu:
Bạn cũng sẽ có một mẫu cơ sở sẽ có mã chung cho từng trang. Trong trường hợp này, mẫu cơ sở sẽ có các liên kết điều hướng và bố cục chung của trang. Đầu tiên, hãy tạo thư mục 0 trong thư mục 0: 5Sau đó, tạo 2: 6Tiếp theo, thêm mã sau vào tệp 2:project/templates/base.html 7Mã này sẽ tạo một loạt các liên kết menu đến mỗi trang của ứng dụng. Nó cũng thiết lập một khối cho 4 có thể được ghi đè bởi các mẫu trẻ em.Tiếp theo, tạo 5: 8Thêm mã sau vào tệp mới được tạo để thêm nội dung vào trang: project/templates/index.html 9Mã này sẽ tạo một trang chỉ mục cơ bản với một tiêu đề và phụ đề. Tiếp theo, tạo 6: 0Mã này tạo ra một trang đăng nhập với các trường cho email và mật khẩu. Ngoài ra còn có một hộp kiểm để ghi nhớ một phiên đã đăng nhập.Email and Password. There is also a checkbox to “remember” a logged in session. project/templates/login.html 1Tiếp theo, tạo 7: 2Thêm mã sau để tạo trang đăng ký với các trường cho 8, 9 và 00:project/templates/signup.html 3Tiếp theo, tạo 01: 4Thêm mã này để tạo một trang với một tiêu đề được mã hóa cứng để chào đón Anthony:Anthony: project/templates/profile.html 5Bạn sẽ xem lại mã này sau này để tự động chào bất kỳ người dùng nào. Khi bạn đã thêm các mẫu, bạn có thể cập nhật các câu lệnh trả về trong mỗi tuyến đường để trả về các mẫu thay vì văn bản. Tiếp theo, cập nhật 5 bằng cách sửa đổi dòng nhập và các tuyến đường cho 03 và 04:project/main.py 6Bây giờ bạn sẽ cập nhật 1 bằng cách sửa đổi dòng nhập và các tuyến đường cho 3 và 4:project/auth.py 7Khi bạn đã thực hiện những thay đổi này, đây là trang đăng ký trông như thế nào nếu bạn điều hướng đến 9:Bạn có thể điều hướng đến các trang cho 3, 8 và 4.Để 0 một mình ngay bây giờ vì nó sẽ không hiển thị một mẫu sau.Bước 5 - Tạo mô hình người dùngMô hình người dùng thể hiện ý nghĩa của ứng dụng để có người dùng. Hướng dẫn này sẽ yêu cầu các trường cho một địa chỉ 8, 00 và 9. Trong các ứng dụng trong tương lai, bạn có thể quyết định bạn muốn có nhiều thông tin được lưu trữ cho mỗi người dùng. Bạn có thể thêm những thứ như sinh nhật, hình ảnh hồ sơ, địa điểm hoặc bất kỳ tùy chọn người dùng nào.Các mô hình được tạo trong Flask-Sqlalchemy được thể hiện bằng các lớp sau đó dịch sang các bảng trong cơ sở dữ liệu. Các thuộc tính của các lớp đó sau đó biến thành các cột cho các bảng đó. Tạo mô hình 5: 8Xác định mô hình 5:project/models.py 9Mã này xác định 5 với các cột cho một 19, 8, 00 và 9.Bây giờ bạn đã tạo ra một mô hình 5, bạn có thể chuyển sang cấu hình cơ sở dữ liệu của mình.Bước 6 - Định cấu hình cơ sở dữ liệuBạn sẽ sử dụng cơ sở dữ liệu SQLite. Bạn có thể tự mình tạo cơ sở dữ liệu SQLite, nhưng hãy để Lôi có Flask-Sqlalchemy làm điều đó cho bạn. Bạn đã có đường dẫn của cơ sở dữ liệu được chỉ định trong tệp 1, vì vậy bạn sẽ cần phải nói với Flask-Sqlalchemy để tạo cơ sở dữ liệu trong Python REPLE.Đảm bảo rằng bạn vẫn còn trong môi trường ảo và trong thư mục 5.Nếu bạn dừng ứng dụng của mình và mở một Python, bạn có thể tạo cơ sở dữ liệu bằng phương thức 26 trên đối tượng 27: 0Lưu ý: Nếu sử dụng thông dịch viên Python là mới đối với bạn, bạn có thể tham khảo tài liệu chính thức. If using the Python interpreter is new to you, you can consult the official documentation. Bây giờ bạn sẽ thấy một tệp 28 trong thư mục dự án của bạn. Cơ sở dữ liệu này sẽ có bảng người dùng trong đó.
Bước 7 - Thiết lập chức năng ủy quyềnĐối với chức năng đăng ký, bạn sẽ lấy dữ liệu mà người dùng gửi đến biểu mẫu và thêm nó vào cơ sở dữ liệu. Bạn sẽ cần đảm bảo người dùng có cùng địa chỉ email chưa tồn tại trong cơ sở dữ liệu. Nếu nó không tồn tại, thì bạn cần đảm bảo rằng bạn băm mật khẩu trước khi đặt nó vào cơ sở dữ liệu. Lưu ý: Lưu trữ mật khẩu trong Plaintext được coi là một thực hành bảo mật kém. Nói chung, bạn sẽ muốn một thuật toán băm phức tạp và muối để giữ mật khẩu an toàn. Storing passwords in plaintext is considered a poor security practice. You will generally want a complex hashing algorithm and salt to keep passwords secure. Hãy bắt đầu bằng cách thêm chức năng thứ hai để xử lý dữ liệu mẫu bài. Thu thập dữ liệu được truyền từ người dùng. Cập nhật 1 bằng cách sửa đổi dòng nhập và triển khai 30:project/auth.py 1Tạo chức năng và thêm một chuyển hướng. Điều này sẽ cung cấp trải nghiệm người dùng về đăng ký thành công và được chuyển đến trang đăng nhập. Bây giờ, hãy để thêm phần còn lại của mã cần thiết để đăng ký người dùng. Sử dụng đối tượng yêu cầu để lấy dữ liệu biểu mẫu. Tiếp tục cập nhật 1 bằng cách thêm nhập khẩu và triển khai 30:auth.py 2Mã này sẽ kiểm tra xem người dùng có cùng địa chỉ email có tồn tại trong cơ sở dữ liệu không. Bước 8 - Kiểm tra phương pháp đăng kýBây giờ bạn đã hoàn thành phương thức đăng ký, bạn sẽ có thể tạo một người dùng mới. Hãy để thử nghiệm biểu mẫu để tạo người dùng. Có hai cách bạn có thể xác minh nếu đăng ký thành công:
Hãy để thêm mã để cho người dùng biết email đã tồn tại và hướng chúng vào trang đăng nhập. Bằng cách gọi hàm 33, bạn có thể gửi tin nhắn đến yêu cầu tiếp theo, trong trường hợp này, là chuyển hướng. Trang mà người dùng được chuyển hướng sau đó sẽ có quyền truy cập vào thông báo đó trong mẫu.Đầu tiên, thêm 33 trước khi bạn chuyển hướng đến trang đăng ký.project/auth.py 3Để có được thông báo flash trong mẫu, bạn có thể thêm mã này trước biểu mẫu. project/templates/signup.html 4Mã này sẽ hiển thị thông báo 35 nếu địa chỉ email đã có trong cơ sở dữ liệu.Tại thời điểm này, bạn có thể chạy ứng dụng và cố gắng đăng ký với một địa chỉ email đã tồn tại. Bước 9 - Thêm phương thức đăng nhậpPhương thức đăng nhập tương tự như hàm đăng ký. Trong trường hợp này, bạn sẽ so sánh địa chỉ 8 được nhập để xem nó có trong cơ sở dữ liệu không. Nếu vậy, bạn sẽ kiểm tra 00 người dùng được cung cấp bằng cách băm 00 mà người dùng truyền vào và so sánh nó với băm 00 trong cơ sở dữ liệu. Bạn sẽ biết người dùng đã nhập đúng 00 khi cả hai khớp nối 00s.Khi người dùng đã vượt qua kiểm tra mật khẩu, bạn sẽ biết rằng họ có thông tin đăng nhập chính xác và bạn có thể đăng nhập chúng bằng cách sử dụng Flask-Login. Bằng cách gọi 42, Flask-Login sẽ tạo một phiên cho người dùng đó sẽ tồn tại khi người dùng ở lại đăng nhập, điều này sẽ cho phép người dùng xem các trang được bảo vệ.Bạn có thể bắt đầu với một tuyến đường mới để xử lý dữ liệu được gửi với POST. Và chuyển hướng đến trang hồ sơ khi người dùng đăng nhập thành công: project/auth.py 5Bây giờ, bạn cần xác minh xem người dùng có thông tin đăng nhập chính xác không: project/auth.py 6Hãy để thêm vào khối trong mẫu để người dùng có thể thấy thông báo flash: project/templates/login.html 7Bây giờ bạn có khả năng nói người dùng đã đăng nhập thành công, nhưng không có gì để đăng nhập người dùng. Flask-Login có thể quản lý các phiên người dùng. Bắt đầu bằng cách thêm 43 vào mô hình người dùng của bạn. 43 sẽ thêm các thuộc tính Flask-Login vào mô hình để Flask-Login có thể hoạt động với nó.models.py 8Sau đó, bạn cần chỉ định trình tải người dùng. Trình tải người dùng nói với Flask-Login cách tìm một người dùng cụ thể từ ID được lưu trữ trong cookie phiên của họ. Thêm điều này trong hàm 1 cùng với mã 46 cho Flask-Login:project/__init__.py 9Cuối cùng, thêm chức năng 42 trước khi chuyển hướng đến trang hồ sơ để tạo phiên:project/auth.py 0Với thiết lập Flask-Login, hãy sử dụng tuyến 8. Khi mọi thứ được đưa ra, bạn sẽ thấy trang hồ sơ.Tại thời điểm này, bạn có thể chạy ứng dụng và cố gắng đăng nhập. Bước 10 - Bảo vệ các trangNếu tên của bạn không phải là Anthony, thì bạn sẽ thấy tên của bạn là sai trên trang hồ sơ. Mục tiêu là để hồ sơ hiển thị tên trong cơ sở dữ liệu. Bạn sẽ cần bảo vệ trang và sau đó truy cập dữ liệu của người dùng để nhận 9.Anthony, then you will see that your name is wrong on the profile page. The goal is for the profile to display the name in the database. You will need to
protect the page and then access the user’s data to get the 9.Để bảo vệ một trang khi sử dụng Flask-Login, hãy thêm trình trang trí 50 giữa tuyến đường và chức năng. Điều này sẽ ngăn người dùng không đăng nhập khỏi việc nhìn thấy tuyến đường. Nếu người dùng không đăng nhập, người dùng sẽ được chuyển hướng đến trang đăng nhập, theo cấu hình Flask-Login.Với các tuyến đường được trang trí với bộ trang trí 51, bạn có thể sử dụng đối tượng 52 bên trong hàm. 52 này đại diện cho người dùng từ cơ sở dữ liệu và cung cấp quyền truy cập tất cả các thuộc tính của người dùng đó với ký hiệu DOT. Ví dụ: 54, 55 và 56 và 57 sẽ trả về các giá trị thực tế được lưu trữ trong cơ sở dữ liệu cho người dùng đã đăng nhập.Hãy để sử dụng 9 của 52 và gửi nó đến mẫu:project/main.py 1Sau đó, trong tệp 60, cập nhật trang để hiển thị giá trị 9:project/templates/profile.html 2Khi người dùng truy cập trang hồ sơ, họ sẽ được chào đón bởi 9 của họ.Bây giờ để cập nhật chế độ xem đăng nhập, hãy gọi chức năng 63 trong tuyến đường để đăng xuất:project/auth.py 3Sử dụng trình trang trí 51 vì không có ý nghĩa để đăng xuất một người dùng không đăng nhập để bắt đầu.
Sau khi người dùng đăng xuất và cố gắng xem lại trang hồ sơ, chúng sẽ được trình bày với thông báo lỗi: Điều này là do Flask-Login flash một thông báo khi người dùng không được phép truy cập một trang. Một điều cuối cùng cần làm là đặt các câu lệnh 65 trong các mẫu để chỉ hiển thị các liên kết có liên quan đến người dùng:templates/base.html 4Trước khi người dùng đăng nhập, họ sẽ có tùy chọn đăng nhập hoặc đăng ký. Sau khi họ đã đăng nhập, họ có thể vào hồ sơ của họ hoặc đăng xuất. Với điều đó, bạn đã xây dựng thành công ứng dụng của mình với xác thực. Sự kết luậnTrong hướng dẫn này, bạn đã sử dụng Flask-Login và Flask-Sqlalchemy để xây dựng một hệ thống đăng nhập cho một ứng dụng. Bạn đã đề cập đến cách xác thực người dùng bằng cách đầu tiên tạo mô hình người dùng và lưu trữ thông tin người dùng. Sau đó, bạn phải xác minh mật khẩu của người dùng là chính xác bằng cách băm mật khẩu từ biểu mẫu và so sánh nó với mã được lưu trong cơ sở dữ liệu. Cuối cùng, bạn đã thêm ủy quyền cho ứng dụng bằng cách sử dụng trình trang trí 51 trên trang hồ sơ để chỉ người dùng đăng nhập mới có thể thấy trang đó.Những gì bạn đã tạo trong hướng dẫn này sẽ đủ cho các ứng dụng nhỏ hơn, nhưng nếu bạn muốn có nhiều chức năng hơn ngay từ đầu, bạn có thể muốn xem xét sử dụng thư viện người dùng Flask-user hoặc flask, cả hai đều được xây dựng trên đầu Thư viện Flask-Login. |