Cho mình hỏi cài cái đăng nhập google như này thế nào

Đây là chức năng đăng nhập vào Viblo bằng Google Accounts thông qua một dịch vụ được gọi là Google One Tap Sign-in (miễn phí). Giúp tự động hiển thị một hộp thoại chứa các tài khoản Google đã đăng nhập trên browser. Người dùng chỉ cần chọn tài khoản là có thể đăng ký/đăng nhập được luôn bằng tài khoản Google.

Để làm điều này, bạn cần làm hai việc:

1. Embed thêm đoạn code của Google One Tap để nó hiển thị cái hộp thoại chọn tài khoản như hình của bạn. Đoạn code này được Google generate cho mình chèn vào website nhé.
2. Viết thêm một cái API callback trên backend server, để sau khi người dùng chọn tài khoản và Google xác thực thành công thì nó sẽ callback về đó. Ở đây sẽ đặt logic xử lý tạo mới tài khoản hay cấp quyền đăng nhập cho Viblo user.

Hướng dẫn chi tiết cũng còn nhiều bước, bạn làm theo doc của Google tại đây nhé:

• https://developers.google.com/identity/gsi/web/guides/features
• https://developers.google.com/identity/gsi/web/guides/get-google-api-clientid

P/S: Phần chức năng này cũng khá hay, ví dụ nếu bạn nhấn Cancel thì lâu lâu sau Google nó mới lại hiển thị lại cái hộp thoại đăng nhập như trong hình. Cũng có các hook để mình tùy biến thêm, ví dụ như trên Viblo, sau khi nhấn Cancel thì một cái popup nhỏ phía dưới màn hình sẽ hiển thị lên. Khi Google One Tap đang hiển thị thì cái popup đấy được ẩn đi.