Dịch vụ nhận dạng của Google đang di chuyển sang API FedCM. Làm theo hướng dẫn di chuyển để xem xét những thay đổi có thể xảy ra và tránh tác động tiêu cực đến việc người dùng đăng nhập vào trang web của bạn.

Trang này được dịch bởi Cloud Translation API.

Thiết lập

Trước khi thêm tính năng Đăng nhập bằng Google, Một lần nhấn hoặc Tự động đăng nhập vào trang web, hãy thiết lập cấu hình OAuth và tuỳ ý thiết lập Chính sách bảo mật nội dung của trang web.

Lấy mã ứng dụng khách Google API

Để bật tính năng Đăng nhập bằng Google trên trang web, trước tiên, bạn cần thiết lập mã ứng dụng khách Google API. Để thực hiện điều này, vui lòng hoàn thành các bước sau:

Mở của .
Tạo hoặc chọn dự án . Nếu bạn đã có một dự án cho nút Đăng nhập bằng Google hoặc Google One Tap, hãy sử dụng dự án hiện có và mã ứng dụng web. Khi tạo ứng dụng chính thức, bạn có thể cần nhiều dự án. Hãy lặp lại các bước còn lại của phần này cho từng dự án mà bạn quản lý.
Nhấp vào Tạo ứng dụng và chọn Ứng dụng web trong phần Loại ứng dụng để tạo mã ứng dụng mới. Để sử dụng mã ứng dụng khách hiện có, hãy chọn một trong các loại Ứng dụng web.
Thêm URI của trang web vào Nguồn gốc JavaScript được uỷ quyền. URI chỉ bao gồm giao thức và tên máy chủ đủ điều kiện. Ví dụ: https://www.example.com.

Lưu ý quan trọng: Đối với hoạt động kiểm thử hoặc phát triển cục bộ, hãy thêm cả http://localhost và http://localhost:<port_number>
Lưu ý quan trọng: Google One Tap chỉ có thể hiển thị trong các miền HTTPS.
Nếu muốn, bạn có thể trả về thông tin xác thực bằng cách chuyển hướng đến một điểm cuối mà bạn lưu trữ thay vì thông qua lệnh gọi lại JavaScript. Nếu vậy, hãy thêm URI chuyển hướng vào URI chuyển hướng được uỷ quyền. URI chuyển hướng bao gồm giao thức, tên máy chủ đủ điều kiện và đường dẫn, đồng thời phải tuân thủ Quy tắc xác thực URI chuyển hướng. Ví dụ: https://www.example.com/auth-receiver

Định cấu hình màn hình xin phép bằng OAuth

Cả tính năng Đăng nhập bằng Google và xác thực Một lần nhấn đều có màn hình yêu cầu sự đồng ý để cho người dùng biết ứng dụng đang yêu cầu quyền truy cập vào dữ liệu của họ, loại dữ liệu mà họ được yêu cầu và các điều khoản áp dụng.

Mở của phần Google Auth Platform (Nền tảng xác thực của Google) trong.
Nếu bạn nhận được lời nhắc, hãy chọn dự án bạn vừa tạo.
Trên , hãy điền thông tin vào biểu mẫu rồi nhấp vào nút "Lưu".
1. Tên ứng dụng: Tên của ứng dụng yêu cầu sự đồng ý. Tên phải phản ánh chính xác ứng dụng của bạn và nhất quán với tên ứng dụng mà người dùng nhìn thấy ở nơi khác.
2. Biểu trưng ứng dụng: Hình ảnh này xuất hiện trên màn hình đồng ý để giúp người dùng nhận ra ứng dụng của bạn. Biểu trưng xuất hiện trên màn hình đồng ý Đăng nhập bằng Google và trên phần cài đặt tài khoản, nhưng không xuất hiện trên hộp thoại Một lần nhấn.
3. Email hỗ trợ: Xuất hiện trên màn hình yêu cầu đồng ý để hỗ trợ người dùng và để quản trị viên G Suite đánh giá quyền truy cập vào ứng dụng của bạn cho người dùng của họ. Địa chỉ email này sẽ hiển thị cho người dùng trên màn hình đồng ý Đăng nhập bằng Google khi người dùng nhấp vào tên ứng dụng.
4. Miền được uỷ quyền: Để bảo vệ bạn và người dùng, Google chỉ cho phép các ứng dụng xác thực bằng OAuth sử dụng Miền được uỷ quyền. Đường liên kết của ứng dụng phải được lưu trữ trên Miền được uỷ quyền. Tìm hiểu thêm.
5. Đường liên kết đến trang chủ của ứng dụng: Xuất hiện trên màn hình yêu cầu đồng ý Đăng nhập bằng Google và thông tin từ chối trách nhiệm tuân thủ GDPR bằng tính năng Một lần nhấn bên dưới nút "Tiếp tục dưới dạng". Phải được lưu trữ trên một Miền được uỷ quyền.
6. Đường liên kết đến Chính sách quyền riêng tư của ứng dụng: Xuất hiện trên màn hình đồng ý với tính năng Đăng nhập bằng Google và thông tin từ chối trách nhiệm tuân thủ GDPR bằng tính năng Một lần nhấn bên dưới nút "Tiếp tục dưới dạng". Phải được lưu trữ trên một Miền được uỷ quyền.
7. Đường liên kết đến Điều khoản dịch vụ của ứng dụng (Không bắt buộc): Xuất hiện trên màn hình đồng ý với tính năng Đăng nhập bằng Google và thông tin từ chối trách nhiệm tuân thủ GDPR theo phương thức Một lần nhấn bên dưới nút "Tiếp tục dưới dạng". Phải được lưu trữ trên một Miền được uỷ quyền.
Chuyển đến để định cấu hình phạm vi cho ứng dụng.
1. Phạm vi cho API của Google: Phạm vi cho phép ứng dụng của bạn truy cập vào dữ liệu riêng tư của người dùng. Đối với việc xác thực, phạm vi mặc định (email, hồ sơ, openid) là đủ, bạn không cần thêm bất kỳ phạm vi nhạy cảm nào. Nhìn chung, bạn nên yêu cầu phạm vi tăng dần tại thời điểm cần quyền truy cập, thay vì trước đó.
Kiểm tra "Trạng thái xác minh", nếu đơn đăng ký của bạn cần xác minh thì nhấp vào nút "Gửi để xác minh" để gửi đơn đăng ký của bạn để xác minh. Hãy tham khảo các yêu cầu về việc xác minh OAuth để biết thông tin chi tiết.

Hiển thị chế độ cài đặt OAuth trong quá trình đăng nhập

Tính năng Một lần nhấn bằng FedCM

Chế độ cài đặt đồng ý OAuth mà Chrome One Tap hiển thị bằng FedCM

Miền được uỷ quyền cấp cao nhất sẽ xuất hiện trong quá trình người dùng đồng ý trong Chrome. Chỉ sử dụng tính năng Một lần nhấn trong các iframe khác nguồn gốc nhưng cùng trang web là một phương thức được hỗ trợ.

Tính năng Một lần chạm không có FedCM

Chế độ cài đặt về sự đồng ý cho OAuth như được hiển thị trong tính năng Một lần chạm

Tên ứng dụng sẽ xuất hiện trong quá trình người dùng đồng ý.

Hình 1. Chế độ cài đặt đồng ý OAuth do tính năng Một lần chạm hiển thị trong Chrome.

Chính sách bảo mật nội dung

Mặc dù không bắt buộc, nhưng bạn nên sử dụng Chính sách bảo mật nội dung để bảo mật ứng dụng và ngăn chặn các cuộc tấn công thông qua tập lệnh trên nhiều trang web (XSS). Để tìm hiểu thêm, hãy xem bài viết Giới thiệu về CSP và CSP và XSS.

Chính sách bảo mật nội dung của bạn có thể bao gồm một hoặc nhiều chỉ thị, chẳng hạn như connect-src, frame-src, script-src, style-src hoặc default-src.

Nếu CSP của bạn bao gồm:

lệnh connect-src, hãy thêm https://accounts.google.com/gsi/ để cho phép trang tải URL gốc cho các điểm cuối phía máy chủ của Dịch vụ nhận dạng của Google.
lệnh frame-src, hãy thêm https://accounts.google.com/gsi/ để cho phép URL gốc của các iframe nút Đăng nhập bằng một lần chạm và Đăng nhập bằng Google.
lệnh script-src, hãy thêm https://accounts.google.com/gsi/client để cho phép URL của thư viện JavaScript Dịch vụ nhận dạng của Google.
lệnh style-src, hãy thêm https://accounts.google.com/gsi/style để cho phép URL của Trang tính kiểu Dịch vụ nhận dạng của Google.
Chỉ thị default-src (nếu được sử dụng) là một phương án dự phòng nếu không chỉ định bất kỳ chỉ thị nào trước đó (connect-src, frame-src, script-src hoặc style-src). Hãy thêm https://accounts.google.com/gsi/ để cho phép một trang tải URL gốc cho các điểm cuối phía máy chủ của Dịch vụ nhận dạng của Google.

Tránh liệt kê từng URL GIS khi sử dụng connect-src. Điều này giúp giảm thiểu lỗi khi cập nhật GIS. Ví dụ: thay vì thêm https://accounts.google.com/gsi/status, hãy sử dụng URL gốc GIS https://accounts.google.com/gsi/.

Tiêu đề phản hồi mẫu này cho phép Dịch vụ nhận dạng của Google tải và thực thi thành công:

Content-Security-Policy-Report-Only: script-src
https://accounts.google.com/gsi/client; frame-src
https://accounts.google.com/gsi/; connect-src https://accounts.google.com/gsi/;

Chính sách về trình mở trên nhiều nguồn gốc

Nút Đăng nhập bằng Google và tính năng Google One Tap có thể yêu cầu bạn thay đổi Cross-Origin-Opener-Policy (COOP) để tạo thành công cửa sổ bật lên.

Khi bật FedCM, trình duyệt sẽ trực tiếp hiển thị cửa sổ bật lên và bạn không cần thực hiện thay đổi nào.

Tuy nhiên, khi FedCM bị tắt, hãy đặt tiêu đề COOP:

đến same-origin và
bao gồm same-origin-allow-popups.

Việc không đặt tiêu đề thích hợp sẽ làm gián đoạn quá trình giao tiếp giữa các cửa sổ, dẫn đến cửa sổ bật lên trống hoặc các lỗi tương tự.