Hướng dẫn đăng nhập và đăng xuất với Alan AI

Mục lục

1. 🌟 Introduce
2. 🌟 Cài đặt chức năng đăng nhập và đăng xuất
3. 🌟 Câu lệnh đăng nhập và đăng xuất
4. 🌟 Sử dụng Alan để thực hiện chức năng đăng nhập và đăng xuất
5. 🌟 Thử nghiệm chức năng
6. 🌟 Chọn thể loại phim
7. 🌟 Tạo ngẫu nhiên thể loại
8. 🌟 Tìm kiếm bất kỳ tiêu đề phim nào
9. 🌟 Thêm một số màn hình ẩn trong ứng dụng
10. 🌟 Kết luận

Cài đặt chức năng đăng nhập và đăng xuất

Để thực hiện chức năng đăng nhập và đăng xuất, chúng ta cần thêm các câu lệnh để đăng nhập và đăng xuất người dùng. Hãy copy và paste những lệnh đã có và chỉnh sửa phù hợp.

Câu lệnh đăng nhập và đăng xuất

Để cho người dùng có thể đăng nhập, chúng ta sẽ thêm lệnh "login" vào danh sách lệnh. Ngoài ra, để làm cho ứng dụng hiểu cả "log in" và "login" đều có cùng ý nghĩa, ta cũng thêm cả Hai vào danh sách lệnh.

Để người dùng có thể đăng xuất, chúng ta thêm lệnh "logout" vào danh sách lệnh. Và tương tự như trên, cả "log out" và "logout" đều có cùng ý nghĩa, ta cũng thêm cả hai vào danh sách lệnh.

Chúng ta cũng sẽ thêm một thông báo trước khi thực hiện đăng nhập và đăng xuất, vì khi thực hiện câu lệnh, chúng ta sẽ được chuyển hướng từ trang Filmpire. Chúng ta có thể copy đoạn mã này và thêm vào trước câu lệnh thực hiện, như sau:

console.log("Đang đăng nhập bạn vào hệ thống...");

console.log("Đang đăng xuất bạn khỏi hệ thống...");

🌟 Sử dụng Alan để thực hiện chức năng đăng nhập và đăng xuất

Bây giờ, để thực hiện chức năng đăng nhập và đăng xuất, chúng ta sẽ xử lý lệnh đã nhận từ Alan. Hãy thêm đoạn mã sau vào hàm xử lý chính (Allen function):

if (command === "login") {
  // Thực hiện đăng nhập
  fetchToken();
} else if (command === "logout") {
  // Thực hiện đăng xuất
  logOut();
}

Chúng ta cũng cần import hàm fetchToken từ utilities vào trong function Allen:

import { fetchToken } from "./utils";

import { fetchToken } from "./utils";
// ...
function Allen() {
  // ...
  if (command === "login") {
    // Thực hiện đăng nhập
    fetchToken();
  } else if (command === "logout") {
    // Thực hiện đăng xuất
    logOut();
  }
  // ...
}

Cuối cùng, chúng ta cần thêm phần đăng xuất vào hàm logOut trong file Allen:

function logOut() {
  localStorage.clear();
  window.location.href = "/";
}

🌟 Thử nghiệm chức năng

Giờ hãy thử nghiệm chức năng đã thêm vào. Đầu tiên, hãy thử đăng xuất bằng cách sử dụng cách thủ công trên trang Filmpire.

Tiếp theo, hãy thử đăng nhập bằng việc sử dụng Alan. Nói "log in" hoặc "login" để thực hiện đăng nhập. Hệ thống sẽ hiển thị một thông báo yêu cầu xác nhận và bạn chỉ cần nhấp vào "approve". Sau đó, bạn sẽ thấy rằng bạn đã được đăng nhập thành công.

Cuối cùng, hãy thử đăng xuất bằng cách nói "log out" hoặc "logout". Hệ thống sẽ thông báo "Đang đăng xuất bạn khỏi hệ thống..." và bạn sẽ thấy rằng bạn đã đăng xuất thành công.

Đó là cách chúng ta đã thêm chức năng đăng nhập và đăng xuất bằng Alan. Trong bài giảng tiếp theo, chúng ta sẽ tập trung vào việc chọn thể loại phim và tìm kiếm bất kỳ tiêu đề phim nào một cách ngẫu nhiên. Chúng ta cũng sẽ thêm một số màn hình ẩn trong ứng dụng."""