Chuyển sang FedCM

Hướng dẫn này giúp bạn hiểu được những thay đổi đối với ứng dụng web mà API Quản lý thông tin xác thực liên kết (FedCM) ra mắt.

Khi FedCM được bật, trình duyệt sẽ hiển thị lời nhắc của người dùng và không sử dụng cookie của bên thứ ba nào.

Tổng quan

Hộp cát về quyền riêng tư dành cho webviệc Chrome xoá cookie của bên thứ ba khỏi web dẫn đến những thay đổi quan trọng đối với Dịch vụ nhận dạng của Google và tính năng đăng nhập của người dùng.

FedCM cho phép các quy trình đăng nhập riêng tư hơn mà không cần sử dụng cookie của bên thứ ba. Trình duyệt kiểm soát chế độ cài đặt người dùng, hiển thị lời nhắc của người dùng và chỉ liên hệ với Nhà cung cấp danh tính, chẳng hạn như Google sau khi người dùng đồng ý một cách rõ ràng.

Đối với hầu hết trang web, quá trình di chuyển diễn ra liền mạch thông qua các bản cập nhật có khả năng tương thích ngược cho thư viện JavaScript của Dịch vụ nhận dạng của Google.

Trước khi bắt đầu

Kiểm tra để đảm bảo trình duyệt và phiên bản trình duyệt của bạn hỗ trợ FedCM API, đồng thời cập nhật lên phiên bản mới hơn nếu cần.

Trước khi kiểm thử quy trình đăng nhập bị chặn cookie của bên thứ ba, hãy mở chrome://flags và bật tính năng FedCmWithoutThirdPartyCookies thử nghiệm. Bước này chỉ cần thiết cho đến khi nó trở thành bước mặc định. Ngoài ra, bạn phải bật chế độ cài đặt Đăng nhập qua bên thứ ba trong Chrome.

Di chuyển ứng dụng web

Hãy làm theo các bước sau để bật FedCM, đánh giá tác động tiềm ẩn của quá trình di chuyển và nếu cần thiết để thực hiện các thay đổi đối với ứng dụng web hiện có:

  1. Thêm một cờ boolean để bật FedCM khi khởi chạy bằng:

  2. Xoá mọi trường hợp sử dụng giá trị opt_out_or_no_session được trả về trong đối tượng PromptMomentNotication.

    Để cải thiện quyền riêng tư của người dùng, lệnh gọi lại google.accounts.id.prompt không còn trả về các kết quả liên quan đến chế độ cài đặt của người dùng hoặc trạng thái phiên.

  3. Cập nhật luồng người dùng và mã trang web để xử lý thông báo trễ về các sự kiện isDisplayMoment().

    Để cải thiện quyền riêng tư của người dùng, thông báo khoảnh khắc hiển thị bị trễ một cách có chủ ý trong một khoảng thời gian ngẫu nhiên khi FedCM được bật. Bạn có thể nhận được thông báo sau tối đa 1 phút sau khi sự kiện thực tế diễn ra. Khi sử dụng isDisplayMoment để hiển thị lời nhắc hoặc kích hoạt tương tác của người dùng theo điều kiện, hãy xem xét kỹ khoảng thời gian thay đổi trong thiết kế trải nghiệm người dùng.

  4. Xoá các thuộc tính kiểu position khỏi data-prompt_parent_idintermediate_iframes.

    Trình duyệt kiểm soát kích thước và vị trí của lời nhắc người dùng. Vị trí tuỳ chỉnh cho tính năng Một lần chạm trên máy tính không được hỗ trợ.

  5. Cập nhật bố cục trang nếu cần.

    Trình duyệt kiểm soát kích thước và vị trí của các lời nhắc của người dùng. Tuỳ thuộc vào bố cục của các trang riêng lẻ, một số nội dung có thể bị che phủ.

    Hãy thay đổi bố cục trang để cải thiện trải nghiệm người dùng khi thông tin quan trọng bị che khuất.

  6. Thêm thuộc tính allow="identity-credentials-get" vào khung mẹ nếu ứng dụng web của bạn gọi API Một lần chạm qua các iframe nhiều nguồn gốc.

    Một iframe được coi là nhiều nguồn gốc nếu nguồn gốc của nó không giống hoàn toàn với nguồn gốc. Ví dụ:

    • Các miền khác nhau: https://example1.comhttps://example2.com
    • Các miền cấp cao nhất khác nhau: https://example.ukhttps://example.jp
    • Miền con: https://example.comhttps://login.example.com

    Để cải thiện quyền riêng tư của người dùng, khi API Một lần chạm được gọi qua iframe nhiều nguồn gốc, bạn phải thêm thuộc tính allow="identity-credentials-get" vào mọi thẻ iframe của khung mẹ:

    <iframe src="https://your.cross-origin/onetap.page" allow="identity-credentials-get"></iframe>
    

    Nếu ứng dụng của bạn sử dụng iframe khác, bạn phải đảm bảo rằng thuộc tính này được thêm vào mọi iframe, bao gồm cả mọi iframe phụ.

    Ví dụ: xem xét những tình huống sau:

    • Tài liệu hàng đầu (https://www.example.uk) chứa iframe có tên "Iframe A", nhúng một trang (https://logins.example.com).

    • Trang được nhúng này (https://logins.example.com) cũng chứa một iframe có tên là "Iframe B", giúp nhúng thêm một trang (https://onetap.example2.com) lưu trữ tính năng Một lần chạm.

    Để đảm bảo hiển thị đúng cách một lần chạm, bạn phải thêm thuộc tính này vào cả thẻ Iframe A và Iframe B.

  7. Bổ sung chỉ thị này vào Chính sách bảo mật nội dung (CSP) của bạn.

    Đây là bước không bắt buộc vì không phải trang web nào cũng chọn xác định CSP.

  8. Xoá hỗ trợ Accelerated Mobile Pages (AMP) để đăng nhập.

    Hỗ trợ người dùng đăng nhập cho AMP là một tính năng không bắt buộc của GIS mà ứng dụng web của bạn có thể đã triển khai. Nếu đúng như vậy,

    Xoá mọi tham chiếu đến:

    • amp-onetap-google phần tử tuỳ chỉnh và

    • <script async custom-element="amp-onetap-google" src="https://cdn.ampproject.org/v0/amp-onetap-google-0.1.js"></script>

    Hãy cân nhắc việc chuyển hướng các yêu cầu đăng nhập từ AMP sang quy trình đăng nhập bằng HTML của trang web. Xin lưu ý rằng Intermediate Iframe Support API có liên quan sẽ không bị ảnh hưởng.