Chuyển sang FedCM

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

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

Tổng quan

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

Đối với hầu hết các 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 tương thích ngược với thư viện JavaScript của Dịch vụ nhận dạng của Google.

Thông tin cập nhật về tính năng Tự động đăng nhập

Bản thử nghiệm của tính năng Quản lý thông tin xác thực liên kết (FedCM) cho Dịch vụ nhận dạng của Google đã ra mắt vào tháng 8 năm 2023. Nhiều nhà phát triển đã thử nghiệm API này và đưa ra ý kiến phản hồi có giá trị.

Một phản hồi mà Google nhận được từ các nhà phát triển là về yêu cầu đối với cử chỉ của người dùng trong quy trình đăng nhập tự động FedCM. Để tăng cường quyền riêng tư, Chrome yêu cầu người dùng xác nhận lại rằng họ muốn đăng nhập vào trang web bằng Tài khoản Google trong mỗi phiên bản Chrome, ngay cả khi người dùng đã phê duyệt trang web trước khi triển khai FedCM. Việc xác nhận lại một lần này được thực hiện thông qua một lần nhấp vào lời nhắc Nhấn một lần hoặc Quy trình nút bằng FedCM để thể hiện ý định đăng nhập của người dùng. Thay đổi này có thể gây gián đoạn ban đầu đối với tỷ lệ chuyển đổi đăng nhập tự động trên một số trang web.

Gần đây, trong phiên bản M121, Chrome đã thay đổi giao diện người dùng của quy trình đăng nhập tự động FedCM. Bạn chỉ cần xác nhận lại khi cookie của bên thứ ba bị hạn chế. Điều này có nghĩa là:

  1. Tính năng tự động đăng nhập FedCM không yêu cầu xác nhận lại đối với người dùng cũ. Nếu người dùng xác nhận lại bằng giao diện người dùng FedCM, thì lần xác nhận lại này sẽ được tính vào yêu cầu về cử chỉ của người dùng sau thời kỳ 3PCD.

  2. Tính năng đăng nhập tự động FedCM sẽ kiểm tra trạng thái xác nhận lại khi người dùng hạn chế cookie của bên thứ ba theo cách thủ công hoặc theo mặc định trong Chrome trong tương lai.

Với thay đổi này, tất cả nhà phát triển tính năng đăng nhập tự động nên chuyển sang FedCM sớm nhất có thể để giảm sự gián đoạn đối với tỷ lệ chuyển đổi của tính năng đăng nhập tự động.

Đối với quy trình đăng nhập tự động, GIS JavaScript sẽ không kích hoạt FedCM trên Chrome cũ (trước M121), ngay cả khi trang web của bạn chọn sử dụng FedCM.

Sự khác biệt trong hành trình của người dùng

Trải nghiệm tính năng Một lần nhấn khi sử dụng FedCM và không sử dụng FedCM chỉ có một số khác biệt nhỏ.

Người dùng mới trong một phiên hoạt động

Khi sử dụng FedCM, tính năng Một lần nhấn sẽ hiển thị tên miền cấp cao nhất thay vì tên ứng dụng.

Sử dụng FedCM Không có FedCM
Người dùng mới trong một phiên hoạt động sử dụng FedCM Người dùng mới trong một phiên hoạt động không có FedCM

Người dùng cũ trong một phiên hoạt động (đã tắt tính năng tự động đăng nhập)

Khi sử dụng FedCM, tính năng Một lần nhấn sẽ hiển thị tên miền cấp cao nhất thay vì tên ứng dụng.

Sử dụng FedCM Không có FedCM
Hành trình của người dùng cũ trong một phiên hoạt động bằng FedCM (khi tính năng tự động đăng nhập bị tắt) Hành trình của người dùng cũ trong một phiên hoạt động mà không có FedCM (khi tính năng tự động đăng nhập bị tắt)

Người dùng cũ trong một phiên (đã bật tính năng đăng nhập tự động)

Khi sử dụng FedCM, người dùng có thể nhấp vào X để huỷ tính năng đăng nhập tự động trong vòng 5 giây thay vì nhấp vào nút Huỷ.

Sử dụng FedCM Không có FedCM
Hành trình của người dùng cũ trong một phiên hoạt động bằng FedCM (đã bật tính năng đăng nhập tự động) Hành trình của người dùng cũ trong một phiên hoạt động mà không có FedCM (đã bật tính năng tự động đăng nhập)

Nhiều phiên

Khi sử dụng FedCM, tính năng Một lần nhấn sẽ hiển thị tên miền cấp cao nhất thay vì tên ứng dụng.

Sử dụng FedCM Không có FedCM
Người dùng nhiều phiên sử dụng FedCM Người dùng nhiều phiên hoạt động không có FedCM

Hãy xem trang về nút Đăng nhập bằng Google để biết các hành trình chính của người dùng cho luồng Nút FedCM.

Trước khi bắt đầu

Kiểm tra để đảm bảo rằng chế độ cài đặt và phiên bản trình duyệt của bạn hỗ trợ API FedCM. Bạn nên cập nhật lên phiên bản mới nhất.

  • FedCM API có trong Chrome 117 trở lên.

  • Chế độ cài đặt Đăng nhập qua bên thứ ba đang bật trong Chrome. Chế độ cài đặt này chỉ ảnh hưởng đến tính năng Một lần nhấn và không ảnh hưởng đến luồng nút FedCM.

  • Nếu trình duyệt Chrome của bạn là phiên bản 119 trở xuống, hãy mở chrome://flags và bật tính năng FedCmWithoutThirdPartyCookies thử nghiệm. Bạn không cần thực hiện bước này với trình duyệt Chrome phiên bản 120 trở lên.

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 việc di chuyển và thực hiện các thay đổi đối với ứng dụng web hiện có nếu cần:

1. Thêm cờ boolean để bật FedCM cho tính năng Một lần nhấn khi khởi chạy bằng:

2. Thêm cờ boolean để bật FedCM cho Nút khi khởi chạy bằng: {:#fedcm_button_flag} (Không bắt buộc)

  • HTML, đặt thuộc tính data-use_fedcm_for_button thành true để bật luồng Nút FedCM. Khi chỉ bật luồng Nút FedCM, bạn cũng có thể đặt thuộc tính data-use_fedcm_for_button thành true để bật tính năng tự động chọn mới.

  • JavaScript, đặt use_fedcm_for_button thành true trong đối tượng IdConfiguration để bật luồng Nút FedCM. Khi chỉ bật luồng Nút FedCM, bạn cũng có thể đặt thuộc tính button_auto_select thành true để bật tính năng tự động chọn mới.

3. Xoá việc sử dụng các phương thức isDisplayMoment(), isDisplayed(), isNotDisplayed() và getNotDisplayedReason() cho tính năng Một lần nhấn trong mã của bạn.

Để 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ề thông báo về khoảnh khắc hiển thị nào trong đối tượng PromptMomentNotication nữa. Xoá mọi mã phụ thuộc vào các phương thức liên quan đến thời điểm hiển thị. Đó là các phương thức isDisplayMoment(), isDisplayed(), isNotDisplayed() và getNotDisplayedReason().

4. Xoá việc sử dụng phương thức getSkippedReason() cho tính năng Một lần nhấn trong mã của bạn.

Mặc dù khoảnh khắc bỏ qua, isSkippedMoment(), vẫn sẽ được gọi từ lệnh gọi lại google.accounts.id.prompt trong đối tượng PromptMomentNotication, nhưng lý do chi tiết sẽ không được cung cấp. Xoá mọi mã phụ thuộc vào phương thức getSkippedReason() khỏi mã của bạn.

Xin lưu ý rằng thông báo về khoảnh khắc đã đóng, isDismissedMoment() và phương thức lý do chi tiết có liên quan, getDismissedReason(), sẽ không thay đổi khi FedCM được bật.

5. Xoá các thuộc tính kiểu position khỏi data-prompt_parent_id và intermediate_iframes cho tính năng Một lần nhấn.

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

6. Cập nhật bố cục trang nếu cần cho tính năng Một lần nhấn.

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. Tuỳ thuộc vào bố cục của từng trang, một số nội dung có thể được phủ lên vì các vị trí tuỳ chỉnh cho tính năng Một lần nhấn trên máy tính không được hỗ trợ theo bất kỳ cách nào, chẳng hạn như thuộc tính kiểu, data-prompt_parent_id, intermediate_iframes, iframe tuỳ chỉnh và các cách sáng tạo khác.

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. Đừng xây dựng trải nghiệm người dùng xung quanh lời nhắc Một lần nhấn ngay cả khi bạn giả định lời nhắc đó ở vị trí mặc định. Vì FedCM API được điều phối qua trình duyệt, nên các nhà cung cấp trình duyệt có thể đặt vị trí của lời nhắc theo cách hơi khác nhau.

7. 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 nhấn hoặc API Nút từ các iframe trên nhiều nguồn gốc.

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

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

Khi sử dụng tính năng Một lần nhấn trong iframe trên nhiều nguồn gốc, người dùng có thể gặp phải trải nghiệm khó hiểu. Lời nhắc Một lần nhấn hiển thị tên miền cấp cao nhất, chứ không phải tên của iframe, dưới dạng biện pháp bảo mật để ngăn chặn việc thu thập thông tin xác thực. Tuy nhiên, mã thông báo nhận dạng được cấp cho nguồn gốc của iframe. Hãy xem vấn đề này trên GitHub để biết thêm thông tin chi tiết.

Vì sự khác biệt này có thể gây hiểu lầm, nên chỉ sử dụng tính năng Một lần nhấn trong các iframe cùng trang web nhưng khác nguồn gốc là phương thức được hỗ trợ. Ví dụ: một trang trên miền cấp cao nhất https://www.example.com sử dụng iframe để nhúng một trang có tính năng Một lần nhấn trên https://login.example.com. Lời nhắc Một lần nhấn sẽ hiển thị "Đăng nhập vào example.com bằng google.com".

Tất cả các trường hợp khác như các miền khác nhau đều không được hỗ trợ. Thay vào đó, hãy cân nhắc các phương thức tích hợp thay thế như:

  • Triển khai nút Đăng nhập bằng Google mà không bật FedCM.
  • Triển khai tính năng Một lần nhấn trên miền cấp cao nhất
  • Sử dụng điểm cuối OAuth 2.0 của Google để tích hợp theo cách tuỳ chỉnh hơn.
  • Nếu đang nhúng một trang web bên thứ ba trong một iframe và không thể sửa đổi cách triển khai tính năng Một lần nhấn, bạn có thể ngăn lời nhắc Một lần nhấn xuất hiện trong iframe. Để thực hiện việc này, hãy xoá thuộc tính allow="identity-credentials-get" khỏi thẻ iframe trong khung mẹ. Thao tác này sẽ ngăn lời nhắc xuất hiện và sau đó bạn có thể hướng dẫn người dùng trực tiếp đến trang đăng nhập của trang web được nhúng.

Khi API Một lần nhấn hoặc Nút được gọi từ các iframe trên nhiều nguồn gốc, bạn phải thêm thuộc tính allow="identity-credentials-get" trong 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 một iframe chứa một 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ả tất cả iframe con.

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

  • Tài liệu trên cùng (https://www.example.uk) chứa một iframe có tên "Iframe A", trong đó 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", nhúng thêm một trang (https://onetap.example2.com) lưu trữ tính năng Một lần nhấn hoặc Nút.

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

    Chuẩn bị để giải đáp thắc mắc về lời nhắc Một lần nhấn hoặc Nút không hiển thị. Các trang web khác có nguồn gốc khác nhau có thể nhúng các trang lưu trữ tính năng Một lần chạm của bạn trong iframe của chúng. Bạn có thể nhận được nhiều phiếu yêu cầu hỗ trợ hơn liên quan đến việc tính năng Một lần nhấn hoặc Nút không xuất hiện từ người dùng cuối hoặc chủ sở hữu trang web khác. Mặc dù chỉ chủ sở hữu trang web mới có thể cập nhật trang của họ, nhưng bạn có thể làm như sau để giảm thiểu tác động:

  • Cập nhật tài liệu dành cho nhà phát triển để bao gồm cách thiết lập iframe đúng cách nhằm gọi trang web của bạn. Bạn có thể liên kết đến trang này trong tài liệu của mình.

  • Cập nhật trang Câu hỏi thường gặp dành cho nhà phát triển (nếu có).

  • Hãy thông báo cho nhóm hỗ trợ của bạn về thay đổi sắp tới và chuẩn bị trước nội dung phản hồi cho yêu cầu.

  • Chủ động liên hệ với các đối tác, khách hàng hoặc chủ sở hữu trang web bị ảnh hưởng để quá trình chuyển đổi sang FedCM diễn ra suôn sẻ.

8. Thêm các lệnh này vào Chính sách bảo mật nội dung (CSP).

Đâ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.

  • Nếu trang web của bạn không sử dụng CSP, bạn không cần thực hiện thay đổi nào.

  • Nếu CSP của bạn hoạt động cho tính năng Một lần nhấn hoặc Nút hiện tại và bạn không sử dụng connect-src, frame-src, script-src, style-src hoặc default-src, thì bạn không cần thực hiện thay đổi nào.

  • Nếu không, hãy làm theo hướng dẫn này để thiết lập CSP. Nếu bạn không thiết lập đúng cách CSP, thì tính năng Một lần nhấn hoặc Nút của FedCM sẽ không hiển thị trên trang web.

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

Tính năng hỗ trợ đăng nhập của người dùng 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 trường hợp này xảy ra,

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

  • Phần tử tuỳ chỉnh amp-onetap-google và 
  • <script async custom-element="amp-onetap-google" src="https://cdn.ampproject.org/v0/amp-onetap-google-0.1.js"></script>

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

Kiểm thử và xác minh quá trình di chuyển

Sau khi thực hiện các thay đổi cần thiết dựa trên các bước trước, bạn có thể xác minh rằng quá trình di chuyển đã thành công.

  1. Xác nhận rằng trình duyệt của bạn hỗ trợ FedCM và bạn có một phiên Tài khoản Google hiện tại.

  2. Chuyển đến(các) trang Nút hoặc Một lần nhấn trong ứng dụng.

  3. Xác nhận rằng lời nhắc hoặc Nút nhấn một lần xuất hiện và phủ lên nội dung cơ bản một cách an toàn.

  4. Xác nhận thông tin xác thực chính xác được trả về điểm cuối hoặc phương thức gọi lại khi đăng nhập vào ứng dụng bằng tính năng Một lần nhấn hoặc Nút.

  5. Nếu bạn bật tính năng tự động đăng nhập, hãy xác minh rằng tính năng huỷ hoạt động và thông tin xác thực chính xác sẽ trả về điểm cuối hoặc phương thức gọi lại.

Thời gian chờ của tính năng Một lần chạm

Khi nhấp vào biểu tượng Một lần nhấn ở góc trên cùng bên phải, lời nhắc sẽ đóng và chuyển sang thời gian chờ, tạm thời ngăn lời nhắc Một lần nhấn hiển thị. Trong Chrome, nếu muốn lời nhắc Một lần chạm xuất hiện lại trước khi thời gian chờ kết thúc, bạn có thể đặt lại trạng thái chờ bằng cách nhấp vào biểu tượng khoá trong thanh địa chỉ rồi nhấp vào nút Đặt lại quyền.

Khoảng thời gian yên tĩnh khi tự động đăng nhập

Khi kiểm thử tính năng đăng nhập tự động bằng một lần nhấn bằng FedCM, tính năng này sẽ có khoảng thời gian yên tĩnh 10 phút giữa mỗi lần đăng nhập tự động. Không thể đặt lại khoảng thời gian yên tĩnh. Bạn sẽ phải đợi 10 phút hoặc sử dụng một Tài khoản Google khác để thử nghiệm nhằm kích hoạt tính năng đăng nhập tự động một lần nữa.

Thông tin hữu ích

Công cụ phân tích Hộp cát về quyền riêng tư (PSAT) là một tiện ích Chrome DevTools giúp hỗ trợ việc sử dụng các API thay thế như FedCM. Công cụ này hoạt động bằng cách quét trang web của bạn để tìm các tính năng bị ảnh hưởng và cung cấp danh sách các thay đổi được đề xuất.