Thiết lập

Sử dụng bộ sưu tập để sắp xếp ngăn nắp các trang Lưu và phân loại nội dung dựa trên lựa chọn ưu tiên của bạn.

Trước khi bạn thêm tính năng Đăng nhập bằng Google, Một lần nhấn hoặc Đăng nhập tự động vào trang web, hãy thiết lập cấu hình OAuth và tuỳ chọn định cấu hình Chính sách bảo mật nội dung cho 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 của bạn, trước tiên, bạn cần thiết lập mã ứng dụng khách Google API. Để làm được điều này, vui lòng hoàn thành các bước sau:

  1. Mở trang Credentials (Thông tin xác thực) của bảng điều khiển API Google.

  2. Tạo hoặc chọn dự án API của Google. 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.

    Nếu dự án của bạn không có mã ứng dụng loại Ứng dụng web, hãy nhấp vàoTạo thông tin xác thực > Mã ứng dụng khách OAuth để tạo mã. Hãy nhớ đưa miền của trang web vào hộp Nguồn gốc JavaScript được ủy quyền. Xin lưu ý rằng Google One Tap chỉ có thể hiển thị trong miền HTTPS. Khi thực hiện các thử nghiệm cục bộ hoặc phát triển, bạn phải thêm cả http://localhost và http://localhost:<port_number> vào hộp Các nguồn gốc JavaScript được ủy quyền. Bạn cũng phải đặt tiêu đề Referrer-Policy thành no-referrer-when-downgrade khi sử dụng http và localhost.

Cả chế độ xác thực bằng tính năng Đăng nhập bằng Google và Một lần chạm đều bao gồm màn hình đồng ý để người dùng biết ứng dụng 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.

  1. Mở trang Màn hình xin phép bằng OAuth của bảng điều khiển API của Google.
  2. Nếu thấy lời nhắc, hãy chọn dự án bạn vừa tạo.

  3. Trên trang "Màn hình xin phép bằng OAuth", hãy điền 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 này 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 thấy ở nơi khác. Tên ứng dụng sẽ xuất hiện trong cửa sổ hộp thoại Một lần chạm.

    2. Biểu trưng của ứng dụng: Hình ảnh trên màn hình đồng ý sẽ giúp người dùng nhận ra ứng dụng của bạn. Biểu trưng này sẽ hiển thị trên màn hình Đăng nhập bằng Google và đồng ý với chế độ cài đặt tài khoản. Biểu tượng này không hiển thị trên hộp thoại One Tap.

    3. Email hỗ trợ: Hiển thị trên màn hình đồng ý để người dùng hỗ trợ 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ị với người dùng trên màn hình Đăng nhập bằng Google để yêu cầu sự đồng ý khi người dùng nhấp vào tên ứng dụng.

    4. 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 trên Google. Đối với quy trình 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, phương pháp hay nhất là yêu cầu mở rộng phạm vi tại thời điểm yêu cầu quyền truy cập, thay vì lên trước. Tìm hiểu thêm.

    5. Miền được cấp phép: Để 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 ủy quyền. Liên kết của ứng dụng phải được lưu trữ trên Google Domains. Tìm hiểu thêm.

    6. Đường liên kết đến trang chủ ứng dụng: Hiển thị trên màn hình Đăng nhập bằng Google rồi đồng ý với tuyên bố từ chối trách nhiệm tuân thủ GDPR (Quy định chung về bảo vệ dữ liệu) chỉ bằng một lần nhấn trong nút "Tiếp tục dưới dạng". Phải được lưu trữ trên Miền được cấp phép.

    7. Đường liên kết đến chính sách quyền riêng tư của ứng dụng: Hiển thị trên màn hình Đăng nhập bằng Google (Sự đồng ý của người dùng) và thông tin về tuyên bố từ chối trách nhiệm tuân thủ GDPR (Quy định chung về bảo vệ dữ liệu) trong một lần nhấn dưới nút "Tiếp tục dưới dạng". Phải được lưu trữ trên Miền được cấp phép.

    8. Đường liên kết đến Điều khoản dịch vụ của ứng dụng (Không bắt buộc): Thông tin này xuất hiện trên màn hình đăng nhập bằng sự đồng ý của Google và thông tin về tuyên bố từ chối trách nhiệm tuân thủ GDPR (Quy định chung về bảo vệ dữ liệu) chỉ bằng một lần nhấn. Phải được lưu trữ trên Miền được cấp phép.

    Hình 1 Các trường trên Màn hình đồng ý OAuth hiển thị trên giao diện người dùng Một lần chạm

  4. Kiểm tra "Trạng thái xác minh", nếu đơn đăng ký của bạn cần xác minh, hãy nhấp vào nút "Gửi để xác minh" để gửi đơn đăng ký 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.

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

Mặc dù không bắt buộc, bạn cũng nên 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 tập lệnh trên nhiều trang web (XSS). Để tìm hiểu thêm, hãy xem nội dung 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 lệnh, chẳng hạn như connect-src, frame-src, script-src hoặc style-src.

Nếu CSP của bạn có:

  • connect-src, 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.
  • frame-src, thêm https://accounts.google.com/gsi/ để cho phép URL mẹ của iframe một nút Nhấn và đăng nhập bằng Google.
  • script-src, 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.
  • style-src, thêm https://accounts.google.com/gsi/style để cho phép URL của Biểu định kiểu Dịch vụ nhận dạng của Google.

Tránh liệt kê các URL GIS riêng lẻ khi sử dụng connect-src. Điều này giúp giảm thiểu lỗi thất bại khi GIS được cập nhật. 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 các 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 mở trên nhiều nguồn gốc

Để cho phép nút Đăng nhập bằng Google và/hoặc Google One Tap hoạt động tốt với cửa sổ bật lên, bạn không được đặt tiêu đề phản hồi HTTP Cross-Origin-Opener-Policy thành same-origin. Việc này sẽ phá vỡ hoạt động giao tiếp giữa các cửa sổ và dẫn đến một cửa sổ bật lên trống hoặc các lỗi tương tự.

Bạn nên sử dụng giá trị same-origin-allow-popups cho tiêu đề Cross-Origin-Opener-Policy trên các trang đăng nhập bằng nút Đăng nhập bằng Google và/hoặc Google One Tap.