Giới thiệu

Trong phần 1, chúng ta đã cùng nhau tìm hiểu cách tích hợp tính năng đăng nhập và đăng ký cơ bản vào ứng dụng web thông qua EzyLogin. Tiếp tục từ những kiến thức đã học, phần 2 này sẽ đưa bạn đến một tính năng vô cùng quan trọng: Đăng nhập với Google.

Google hiện đang là một trong những nền tảng lớn nhất với hơn 2 tỷ người dùng hoạt động hàng tháng (theo số liệu Q1/2023). Việc tích hợp tính năng Đăng nhập với Google sẽ không chỉ mở rộng khả năng tiếp cận mà còn cải thiện đáng kể trải nghiệm người dùng cho ứng dụng của bạn. Điều này giúp người dùng đăng nhập một cách nhanh chóng và thuận tiện mà không phải tạo tài khoản mới, qua đó giảm bớt thời gian cũng như rào cản trong việc sử dụng ứng dụng, điều này có thể dẫn đến tỷ lệ chuyển đổi cao hơn.

Chuẩn bị

Để bắt đầu sử dụng EzyLogin, bạn cần cài đặt và cấu hình EzyPlatform trước. Nếu bạn chưa có kinh nghiệm với EzyPlatform, hãy tham khảo bài viết: EzyPlatform - Giới thiệu về nền tảng Lập trình từ người Việt.

I. Kích Hoạt Plugin EzyLogin

Sau khi cài đặt EzyPlatform, bạn sẽ cần kích hoạt plugin EzyLogin để có thể tích hợp chức năng đăng nhập. Hướng dẫn chi tiết có thể tìm thấy trong bài viết EzyLogin Phần 1.

II. Đăng Ký Dịch Vụ Google OAuth

Để tích hợp tính năng đăng nhập bằng Google, bạn cần đăng ký dịch vụ OAuth của họ để Google có thể nhận diện ứng dụng của bạn và quyền truy cập vào thông tin.

1. Tạo Dự Án Trên Google Cloud Console

Truy cập Google Cloud Console và chọn "Chọn dự án" > "Tạo dựng dự án" để tạo một dự án mới, hoặc có thể chọn một dự án hiện tại.

Điền tên cho dự án và nhấn "TẠO".

2. Tạo Màn Hình Đồng Ý OAuth

Chọn "APIs & Services" > "OAuth Consent Screen". Chọn "External" để cho phép bất kỳ người dùng nào có thể sử dụng ứng dụng của bạn và điền các thông tin cần thiết như tên ứng dụng, email hỗ trợ, thông tin chính sách bảo mật, v.v...

3. Tạo Thông Tin Xác Thực (Credentials)

Chọn "Credentials > Tạo Credentials > OAuth client ID" và điền các thông tin cần thiết, bao gồm tên ứng dụng và URL chuyển tiếp mà ứng dụng sẽ nhận thông tin từ Google. Đừng quên lưu Client ID và Client Secret để sử dụng sau này.

Cấu Hình EzyLogin

Sau khi kích hoạt plugin và có thông tin từ Google, bạn cần truy cập vào phần "EzyLogin" trên thanh điều hướng bên trái và cấu hình các thông số cần thiết.

1. Cài Đặt Thông Thường

Tại đây bạn có thể điều chỉnh các cài đặt cho phần đăng nhập và đăng ký.

2. Cài Đặt Google

Bạn sẽ cần nhập Client ID, Client Secret và các thông tin khác từ Google API Console để tính năng đăng nhập Google hoạt động chính xác.

3. Thử Nghiệm Tính Năng Đăng Nhập

Sau khi cài đặt xong, bạn có thể thử nghiệm tính năng đăng nhập với Google bằng cách chọn "Continue with Google Account", sau đó đăng nhập và bạn sẽ được chuyển hướng đến trang chính của ứng dụng.

Tạm Kết

Trong phần này, chúng ta đã tìm hiểu cách tích hợp tính năng đăng nhập với Google vào ứng dụng web thông qua EzyLogin. Việc này không chỉ làm tăng trải nghiệm người dùng mà còn mở rộng vòng tay chào đón người dùng mới. Ở phần tiếp theo, chúng ta sẽ cùng nhau khám phá cách tích hợp tính năng đăng nhập với Facebook. Nếu bạn có bất kỳ câu hỏi hay góp ý nào, hãy chia sẻ với chúng tôi. Hãy tiếp tục theo dõi các bài viết trong series EzyLogin để cập nhật thêm nhiều tính năng hữu ích khác nhé!

• EzyLogin Phần 1: Tích hợp Tính năng Đăng nhập và Đăng ký Cơ bản
• EzyLogin Phần 3
• EzyLogin Phần 4
  source: viblo