Tính năng ngừng sử dụng cookie bên thứ ba của Chrome bắt đầu từ quý 1 năm 2024. Bạn có thể làm theo hướng dẫn di chuyển để xem lại các thay đổi có thể xảy ra và tránh tác động tiêu cực khi 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.

Tài liệu tham khảo API JavaScript của Google Đăng nhập bằng Google

Trang tham khảo này mô tả API JavaScript đăng nhập. Bạn có thể dùng API này để hiển thị lời nhắc Một lần chạm hoặc nút Đăng nhập bằng Google trên trang web của bạn.

Phương thức: google.accounts.id.initiated

Phương thức google.accounts.id.initialize khởi chạy tính năng Đăng nhập bằng Google ứng dụng khách dựa trên đối tượng cấu hình. Hãy xem mã ví dụ sau đây của phương thức:

google.accounts.id.initialize(IdConfiguration)

Mã ví dụ sau đây sẽ triển khai phương thức google.accounts.id.initialize bằng hàm onload:

<script>
  window.onload = function () {
    google.accounts.id.initialize({
      client_id: 'YOUR_GOOGLE_CLIENT_ID',
      callback: handleCredentialResponse
    });
    google.accounts.id.prompt();
  };
</script>

Phương thức google.accounts.id.initialize sẽ tạo một ứng dụng Đăng nhập bằng Google có thể được tất cả các mô-đun trong cùng một trang web sử dụng ngầm.

Bạn chỉ cần gọi phương thức google.accounts.id.initialize một lần ngay cả khi nếu bạn sử dụng nhiều mô-đun (như Một lần chạm, Nút được cá nhân hoá, thu hồi, v.v.) trong cùng một trang web.
Nếu bạn gọi phương thức google.accounts.id.initialize nhiều lần, chỉ có các cấu hình trong lệnh gọi cuối cùng được ghi nhớ và sử dụng.

Bạn thực sự đặt lại cấu hình bất cứ khi nào bạn gọi hàm google.accounts.id.initialize và tất cả các phương thức tiếp theo trong cùng một phương thức trang web của bạn sẽ sử dụng ngay cấu hình mới.

Loại dữ liệu: IdConfiguration

Bảng sau đây liệt kê các trường và nội dung mô tả về IdConfiguration loại dữ liệu:

Trường
`client_id`	Mã ứng dụng khách của ứng dụng
`auto_select`	Bật tính năng tự động chọn.
`callback`	Hàm JavaScript xử lý mã thông báo mã nhận dạng. Google One Chạm và nút Đăng nhập bằng Google `popup` chế độ trải nghiệm người dùng sử dụng tính năng này .
`login_uri`	URL của điểm cuối đăng nhập. Nút Đăng nhập bằng Google Chế độ trải nghiệm người dùng `redirect` sử dụng thuộc tính này.
`native_callback`	Hàm JavaScript xử lý thông tin xác thực mật khẩu.
`cancel_on_tap_outside`	Huỷ lời nhắc nếu người dùng nhấp vào bên ngoài lời nhắc.
`prompt_parent_id`	Mã DOM của phần tử vùng chứa lời nhắc Một lần chạm
`nonce`	Một chuỗi ngẫu nhiên cho mã thông báo mã nhận dạng
`context`	Tiêu đề và từ trong lời nhắc Một lần chạm
`state_cookie_domain`	Nếu bạn cần gọi tính năng Một lần chạm trong miền gốc và các miền con của miền, chuyển miền gốc đến trường này để một cookie dùng chung được đã sử dụng.
`ux_mode`	Quy trình trải nghiệm người dùng của nút Đăng nhập bằng Google
`allowed_parent_origin`	Các nguồn gốc được phép nhúng iframe trung gian. Tính năng Một lần chạm sẽ được chạy ở chế độ iframe trung gian nếu có trường này.
`intermediate_iframe_close_callback`	Ghi đè hành vi iframe trung gian mặc định khi người dùng theo cách thủ công đóng tính năng Một lần chạm.
`itp_support`	Bật trải nghiệm người dùng bằng tính năng Một lần chạm đã nâng cấp trên các trình duyệt ITP.
`login_hint`	Bỏ qua bước lựa chọn tài khoản bằng cách cung cấp gợi ý cho người dùng.
`hd`	Giới hạn lựa chọn tài khoản theo miền.
`use_fedcm_for_prompt`	Cho phép trình duyệt kiểm soát lời nhắc đăng nhập của người dùng và dàn xếp giữa trang web của bạn và Google.

client_id

Trường này là mã ứng dụng khách của ứng dụng, mã này được tìm thấy và tạo trong bảng điều khiển Google Cloud. Hãy xem bảng sau để biết thêm thông tin:

Loại	Bắt buộc	Ví dụ:
string	Có	`client_id: "CLIENT_ID.apps.googleusercontent.com"`

auto_select

Trường này xác định liệu mã thông báo giá trị nhận dạng có được tự động trả về mà không có người dùng nào tương tác khi chỉ có một phiên Google đã phê duyệt ứng dụng của bạn trước đó. Giá trị mặc định là false. Hãy xem bảng sau để biết thêm thông tin của bạn:

Loại	Bắt buộc	Ví dụ:
boolean	Không bắt buộc	`auto_select: true`

số gọi lại

Trường này là hàm JavaScript xử lý mã thông báo ID được trả về từ lời nhắc Một lần chạm hoặc cửa sổ bật lên. Thuộc tính này là bắt buộc nếu Google Chế độ trải nghiệm người dùng popup được sử dụng bằng tính năng Một lần chạm hoặc nút Đăng nhập bằng Google. Xem bảng sau để biết thêm thông tin:

Loại	Bắt buộc	Ví dụ:
hàm	Bắt buộc đối với chế độ Một lần chạm và chế độ trải nghiệm người dùng `popup`	`callback: handleResponse`

login_uri

Thuộc tính này là URI của điểm cuối đăng nhập.

Giá trị này phải khớp chính xác với một trong các URI chuyển hướng được phép cho OAuth Ứng dụng 2.0 mà bạn đã định cấu hình trong bảng điều khiển Google Cloud và phải tuân thủ quy trình xác thực URI chuyển hướng .

Thuộc tính này có thể bị bỏ qua nếu trang hiện tại là trang đăng nhập của bạn, trong đó trường hợp thông tin đăng nhập được đăng lên trang này theo mặc định.

Phản hồi về thông tin xác thực mã thông báo nhận dạng được đăng lên điểm cuối đăng nhập của bạn khi người dùng lượt nhấp vào nút Đăng nhập bằng Google và chế độ UX chuyển hướng được sử dụng.

Hãy xem bảng sau để biết thêm thông tin:

Loại	Không bắt buộc	Ví dụ:
URL	Giá trị mặc định là URI của trang hiện tại hoặc giá trị mà bạn chỉ định. Chỉ dùng khi bạn đặt `ux_mode: "redirect"`.	`login_uri: "https://www.example.com/login"`

Điểm cuối đăng nhập của bạn phải xử lý các yêu cầu POST chứa Khoá credential có Giá trị mã thông báo mã nhận dạng trong phần nội dung.

Sau đây là ví dụ về yêu cầu đối với điểm cuối đăng nhập:

POST /login HTTP/1.1
Host: www.example.com
Content-Type: application/x-www-form-urlencoded

credential=ID_TOKEN

native_callback

Trường này là tên của hàm JavaScript xử lý mật khẩu thông tin xác thực được trả về từ trình quản lý thông tin xác thực gốc của trình duyệt. Xem bảng sau để biết thêm thông tin:

Loại	Bắt buộc	Ví dụ:
hàm	Không bắt buộc	`native_callback: handleResponse`

cancel_on_tap_outside

Trường này quy định xem có huỷ yêu cầu Một lần chạm hay không khi người dùng nhấp vào bên ngoài lời nhắc. Giá trị mặc định là true. Bạn có thể tắt chế độ này nếu đặt thành false. Hãy xem bảng sau để biết thêm thông tin:

Loại	Bắt buộc	Ví dụ:
boolean	Không bắt buộc	`cancel_on_tap_outside: false`

prompt_parent_id

Thuộc tính này đặt ID DOM của phần tử vùng chứa. Nếu bạn không đặt chính sách này, Lời nhắc Một lần chạm hiển thị ở góc trên cùng bên phải của cửa sổ. Xem bảng sau để biết thêm thông tin:

Loại	Bắt buộc	Ví dụ:
string	Không bắt buộc	`prompt_parent_id: 'parent_id'`

nonce

Trường này là một chuỗi ngẫu nhiên mà mã thông báo mã nhận dạng sử dụng để ngăn các cuộc tấn công phát lại. Hãy xem bảng sau để biết thêm thông tin:

Loại	Bắt buộc	Ví dụ:
string	Không bắt buộc	`nonce: "biaqbm70g23"`

Độ dài của số chỉ dùng một lần bị giới hạn ở kích thước JWT tối đa mà môi trường của bạn hỗ trợ, và các giới hạn kích thước HTTP của trình duyệt và máy chủ riêng lẻ.

bối cảnh

Trường này thay đổi nội dung của tiêu đề và tin nhắn trong lời nhắc Một lần chạm. Xem bảng sau để biết thêm thông tin:

Loại	Bắt buộc	Ví dụ:
string	Không bắt buộc	`context: "use"`

Bảng sau đây liệt kê tất cả các ngữ cảnh có sẵn và nội dung mô tả tương ứng:

Bối cảnh
`signin`	"Đăng nhập bằng Google"
`signup`	"Đăng ký bằng Google"
`use`	"Sử dụng với Google"

state_cookie_domain

Nếu bạn cần hiển thị tính năng Một lần chạm trong miền gốc và các miền con của miền con, hãy chuyển miền mẹ vào trường này để sử dụng một cookie trạng thái dùng chung. Xem bảng sau để biết thêm thông tin:

Loại	Bắt buộc	Ví dụ:
string	Không bắt buộc	`state_cookie_domain: "example.com"`

ux_mode

Sử dụng trường này để thiết lập quy trình trải nghiệm người dùng mà nút Đăng nhập bằng Google sử dụng. Chiến lược phát hành đĩa đơn giá trị mặc định là popup. Thuộc tính này không ảnh hưởng đến trải nghiệm người dùng OneTap. Xem bảng sau để biết thêm thông tin:

Loại	Bắt buộc	Ví dụ:
string	Không bắt buộc	`ux_mode: "redirect"`

Bảng sau đây liệt kê các chế độ trải nghiệm người dùng có sẵn và nội dung mô tả tương ứng.

Chế độ trải nghiệm người dùng
`popup`	Thực hiện quy trình đăng nhập vào trải nghiệm người dùng trong cửa sổ bật lên.
`redirect`	Thực hiện quy trình đăng nhập vào trải nghiệm người dùng bằng cách chuyển hướng toàn bộ trang.

allowed_parent_origin

Các nguồn gốc được phép nhúng iframe trung gian. Chạy bằng tính năng Một lần chạm ở chế độ iframe trung gian nếu có trường này. Xem các mục sau để biết thêm thông tin:

Loại	Bắt buộc	Ví dụ:
chuỗi hoặc mảng chuỗi	Không bắt buộc	`allowed_parent_origin: "https://example.com"`

Bảng sau đây liệt kê các loại giá trị được hỗ trợ và nội dung mô tả của các loại giá trị đó.

Các kiểu giá trị
`string`	Một URI miền duy nhất.	`"https://example.com"`
`string array`	Một mảng URI miền.	`["https://news.example.com", "https://local.example.com"]`

Tiền tố ký tự đại diện cũng được hỗ trợ. Ví dụ: "https://*.example.com" khớp với example.com và miền con của miền đó ở tất cả các cấp (ví dụ: news.example.com, login.news.example.com). Những điều cần lưu ý khi sử dụng ký tự đại diện:

Chuỗi mẫu không được chỉ gồm ký tự đại diện và cấp cao nhất miền. Ví dụ: https://.com và https://.co.uk là không hợp lệ; Như đã lưu ý ở trên, "https://.example.com" khớp với example.com và các miền con của nó. Bạn cũng có thể sử dụng để đại diện cho 2 miền khác nhau. Ví dụ: ["https://example1.com", "https://.example2.com"] kết quả phù hợp các miền example1.com, example2.com và miền con của example2.com
Miền có ký tự đại diện phải bắt đầu bằng lược đồ https:// bảo mật, và vì vậy "*.example.com" bị coi là không hợp lệ.

Nếu giá trị của trường allowed_parent_origin không hợp lệ, thì tính năng Một lần chạm việc khởi chạy chế độ iframe trung gian sẽ không thành công và dừng lại.

intermediate_iframe_close_callback

Ghi đè hành vi iframe trung gian mặc định khi người dùng đóng One theo cách thủ công Nhấn bằng cách nhấn vào dấu 'X' trong giao diện người dùng một lần chạm. Hành vi mặc định là xoá iframe trung gian khỏi DOM ngay lập tức.

Trường intermediate_iframe_close_callback chỉ có hiệu lực trong môi trường trung gian chế độ iframe. Và nó chỉ tác động đến iframe trung gian, thay vì iframe một lần chạm. Giao diện người dùng Một lần chạm sẽ bị xoá trước khi thực hiện lệnh gọi lại.

Loại	Bắt buộc	Ví dụ:
hàm	Không bắt buộc	`intermediate_iframe_close_callback: logBeforeClose`

itp_support

Trường này xác định liệu trải nghiệm người dùng đã nâng cấp phải được bật trên các trình duyệt có hỗ trợ tính năng Ngăn chặn theo dõi thông minh (ITP). Giá trị mặc định là false. Hãy xem bảng sau để biết thêm thông tin của bạn:

Loại	Bắt buộc	Ví dụ:
boolean	Không bắt buộc	`itp_support: true`

login_hint

Nếu biết trước người dùng nào sẽ được đăng nhập, ứng dụng của bạn có thể cung cấp gợi ý đăng nhập cho Google. Khi thành công, lựa chọn tài khoản sẽ được bỏ qua. Các giá trị được chấp nhận là: địa chỉ email hoặc giá trị trường sub của mã thông báo nhận dạng.

Để biết thêm thông tin, hãy xem trường login_hint trong OpenID Connect .

Loại	Bắt buộc	Ví dụ:
Chuỗi, địa chỉ email hoặc giá trị từ mã thông báo mã nhận dạng Trường `sub`.	Không bắt buộc	`login_hint: 'elisa.beckett@gmail.com'`

hd

Khi người dùng có nhiều tài khoản và chỉ nên đăng nhập bằng tài khoản Workspace của họ hãy sử dụng địa chỉ này để cung cấp gợi ý tên miền cho Google. Khi thành công, người dùng các tài khoản được hiển thị trong quá trình lựa chọn tài khoản được giới hạn trong miền đã cung cấp. Giá trị ký tự đại diện: * chỉ cung cấp tài khoản Workspace cho người dùng và không bao gồm tài khoản người dùng cá nhân (user@gmail.com) trong quá trình chọn tài khoản.

Để biết thêm thông tin, hãy xem trường hd trong tài liệu SSO Connect.

Loại	Bắt buộc	Ví dụ:
Chuỗi. Một tên miền đủ điều kiện hoặc *.	Không bắt buộc	`hd: '*'`

use_fedcm_for_prompt

Cho phép trình duyệt kiểm soát lời nhắc đăng nhập của người dùng và dàn xếp quy trình đăng nhập giữa trang web của bạn và Google. Giá trị mặc định là false. Xem bài viết Di chuyển sang FedCM để biết thêm thông tin.

Loại	Bắt buộc	Ví dụ:
boolean	Không bắt buộc	`use_fedcm_for_prompt: true`

Phương thức: google.accounts.id.prompt

Phương thức google.accounts.id.prompt cho thấy lời nhắc Một lần chạm hoặc trình quản lý thông tin xác thực gốc của trình duyệt sau khi phương thức initialize() được gọi. Hãy xem mã ví dụ sau đây về phương thức này:

 google.accounts.id.prompt(/**
 @type{(function(!PromptMomentNotification):void)=} */ momentListener)

Thông thường, phương thức prompt() được gọi khi tải trang. Do buổi tập luyện ở phía Google, giao diện người dùng của lời nhắc bằng một lần chạm có thể không được hiển thị. Để nhận thông báo về trạng thái giao diện người dùng cho các khoảnh khắc khác nhau, hãy truyền một nhận thông báo về trạng thái giao diện người dùng.

Thông báo được kích hoạt vào những thời điểm sau:

Khoảnh khắc hiển thị: Sự kiện này xảy ra sau khi phương thức prompt() được gọi. Chiến lược phát hành đĩa đơn thông báo chứa giá trị boolean cho biết liệu giao diện người dùng có được hiển thị hay không.
Khoảnh khắc bị bỏ qua: Điều này xảy ra khi lời nhắc một lần chạm được tự động đóng huỷ, huỷ theo cách thủ công hoặc khi Google không thể cấp thông tin xác thực, chẳng hạn như khi phiên bạn chọn đã đăng xuất khỏi Google.

Trong những trường hợp này, bạn nên tiếp tục chuyển sang danh tính tiếp theo (nếu có).
Khoảnh khắc đã loại bỏ: Điều này xảy ra khi Google truy xuất thành công một thông tin xác thực hoặc người dùng muốn dừng luồng truy xuất thông tin xác thực. Để ví dụ: khi người dùng bắt đầu nhập tên người dùng và mật khẩu của họ vào trong hộp thoại đăng nhập, bạn có thể gọi phương thức google.accounts.id.cancel() để đóng lời nhắc Một lần chạm và kích hoạt một khoảnh khắc bỏ qua.

Cảnh báo: Khi đang ở trong một khoảnh khắc đã bỏ qua, đừng thử bất kỳ danh tính nào tiếp theo Google Cloud.

Đoạn mã ví dụ sau đây triển khai khoảnh khắc bị bỏ qua:

<script>
  window.onload = function () {
    google.accounts.id.initialize(...);
    google.accounts.id.prompt((notification) => {
      if (notification.isNotDisplayed() || notification.isSkippedMoment()) {
        // continue with another identity provider.
      }
    });
  };
</script>

Loại dữ liệu: PromptMomentNotification

Bảng sau đây liệt kê các phương thức và nội dung mô tả về Loại dữ liệu PromptMomentNotification:

Phương thức
`isDisplayMoment()`	Có phải thông báo này chỉ dành cho một khoảnh khắc hiển thị không? Lưu ý: Khi FedCM đã bật, thì thông báo này sẽ không được kích hoạt. Xem Di chuyển sang FedCM để biết thêm thông tin.
`isDisplayed()`	Đây có phải là thông báo cho một khoảnh khắc hiển thị không và giao diện người dùng đang được hiển thị không? Lưu ý: Khi FedCM đã bật, thì thông báo này sẽ không được kích hoạt. Xem Di chuyển sang FedCM để biết thêm thông tin.
`isNotDisplayed()`	Đây có phải là thông báo cho một khoảnh khắc hiển thị nhưng giao diện người dùng không được hiển thị không? Lưu ý: Khi FedCM đã bật, thì thông báo này sẽ không được kích hoạt. Xem Di chuyển sang FedCM để biết thêm thông tin.
`getNotDisplayedReason()`	Lý do chi tiết khiến giao diện người dùng không hiển thị. Sau đây là các giá trị có thể có: `browser_not_supported` `invalid_client` `missing_client_id` `opt_out_or_no_session` `secure_http_required` `suppressed_by_user` `unregistered_origin` `unknown_reason` Lưu ý: Khi FedCM đã bật, thì phương pháp này không được hỗ trợ. Xem Di chuyển sang FedCM để biết thêm thông tin.
`isSkippedMoment()`	Thông báo này có phải cho khoảnh khắc bị bỏ qua không?
`getSkippedReason()`	Lý do chi tiết cho khoảnh khắc bị bỏ qua. Sau đây là các giá trị có thể có: `auto_cancel` `user_cancel` `tap_outside` `issuing_failed` Lưu ý: Khi FedCM đã bật, thì phương pháp này không được hỗ trợ. Xem Di chuyển sang FedCM để biết thêm thông tin.
`isDismissedMoment()`	Đây có phải là thông báo cho khoảnh khắc đã bỏ qua không?
`getDismissedReason()`	Lý do chi tiết cho việc từ chối. Những trường hợp sau có thể xảy ra giá trị: `credential_returned` `cancel_called` `flow_restarted`
`getMomentType()`	Trả về một chuỗi cho loại khoảnh khắc. Những trường hợp sau có thể xảy ra giá trị: `display` `skipped` `dismissed`

Loại dữ liệu: CredentialResponse

Khi hàm callback được gọi, đối tượng CredentialResponse sẽ được gọi được truyền dưới dạng thông số. Bảng sau đây liệt kê các trường có trong bảng sau trong đối tượng phản hồi thông tin xác thực:

Trường
`credential`	Trường này là mã thông báo giá trị nhận dạng được trả về.
`select_by`	Trường này đặt cách chọn thông tin xác thực.
`state`	Trường này chỉ được xác định khi người dùng nhấp vào nút Đăng nhập bằng Google nút đăng nhập và nút `state` được chỉ định.

giấy chứng nhận

Trường này là mã thông báo mã nhận dạng dưới dạng chuỗi Mã thông báo web JSON được mã hoá base64.

Thời gian được giải mã, JWT sẽ có dạng như ví dụ sau:

header
{
  "alg": "RS256",
  "kid": "f05415b13acb9590f70df862765c655f5a7a019e", // JWT signature
  "typ": "JWT"
}
payload
{
  "iss": "https://accounts.google.com", // The JWT's issuer
  "nbf":  161803398874,
  "aud": "314159265-pi.apps.googleusercontent.com", // Your server's client ID
  "sub": "3141592653589793238", // The unique ID of the user's Google Account
  "hd": "gmail.com", // If present, the host domain of the user's GSuite email address
  "email": "elisa.g.beckett@gmail.com", // The user's email address
  "email_verified": true, // true, if Google has verified the email address
  "azp": "314159265-pi.apps.googleusercontent.com",
  "name": "Elisa Beckett",
                            // If present, a URL to user's profile picture
  "picture": "https://lh3.googleusercontent.com/a-/e2718281828459045235360uler",
  "given_name": "Elisa",
  "family_name": "Beckett",
  "iat": 1596474000, // Unix timestamp of the assertion's creation time
  "exp": 1596477600, // Unix timestamp of the assertion's expiration time
  "jti": "abc161803398874def"
}

Trường sub là giá trị nhận dạng duy nhất trên toàn cầu của Tài khoản Google. Chỉ sử dụng trường sub làm giá trị nhận dạng cho người dùng vì đây là trường duy nhất trong số tất cả các sản phẩm và dịch vụ của Google và không bao giờ được sử dụng lại. Không dùng địa chỉ email làm giá trị nhận dạng vì một Tài khoản Google có thể có nhiều địa chỉ email tại các thời điểm khác nhau.

Bằng cách sử dụng các trường email, email_verified và hd, bạn có thể xác định xem Google lưu trữ và có thẩm quyền đối với địa chỉ email. Trong trường hợp Google có thẩm quyền và xác nhận được người dùng là chủ sở hữu tài khoản hợp pháp.

Những trường hợp mà Google có thẩm quyền:

email có hậu tố @gmail.com, đây là một Tài khoản Gmail.
email_verified là đúng và hd đã được đặt, đây là một Google Workspace tài khoản.

Người dùng có thể đăng ký Tài khoản Google mà không cần sử dụng Gmail hoặc Google Workspace. Khi email không chứa hậu tố @gmail.com và không có hd, Google sẽ không xác thực và dùng mật khẩu hoặc các phương pháp thử thách khác xác minh người dùng. email_verfied cũng có thể đúng vì Google đã xác minh ban đầu người dùng khi Tài khoản Google được tạo, nhưng quyền sở hữu đối với tài khoản email của bên thứ ba có thể đã thay đổi.

Trường exp cho biết thời gian hết hạn để bạn xác minh mã thông báo trên phía máy chủ. Mất 1 giờ cho mã thông báo nhận dạng mà tính năng Đăng nhập bằng Google nhận được. Bạn cần phải xác minh mã thông báo trước khi hết hạn bất cứ lúc nào. Không sử dụng exp để quản lý phiên. Mã thông báo giá trị nhận dạng đã hết hạn không có nghĩa là người dùng đã đăng xuất. Ứng dụng của bạn chịu trách nhiệm về phiên quản lý người dùng của bạn.

select_by

Bảng sau đây liệt kê các giá trị có thể có cho trường select_by. Chiến lược phát hành đĩa đơn loại nút dùng cùng với phiên hoạt động và trạng thái đồng ý được dùng để đặt giá trị,

Người dùng đã nhấn nút Một lần chạm hoặc Đăng nhập bằng Google hoặc đã sử dụng quy trình Đăng nhập tự động không chạm.
Đã tìm thấy một phiên hiện có hoặc người dùng đã chọn và đăng nhập vào Tài khoản Google để thiết lập một phiên hoạt động mới.
Trước khi chia sẻ thông tin xác thực mã thông báo ID với ứng dụng của bạn, người dùng
- đã nhấn nút Xác nhận để đồng ý chia sẻ thông tin đăng nhập, hoặc
- đã đồng ý trước đó và đã sử dụng tính năng Chọn một tài khoản để chọn Tài khoản Google.

Giá trị của trường này được đặt thành một trong các loại sau,

Giá trị	Mô tả
`auto`	Tự động đăng nhập người dùng trong phiên hiện tại đã có đã đồng ý chia sẻ thông tin đăng nhập. Chỉ áp dụng cho trình duyệt không hỗ trợ FedCM.
`user`	Người dùng trong một phiên hoạt động hiện tại và trước đó đã đồng ý đã nhấn nút Một lần chạm "Tiếp tục bằng tài khoản" để chia sẻ thông tin đăng nhập. Áp dụng đối với các trình duyệt không hỗ trợ FedCM.
`fedcm`	Người dùng đã nhấn nút Một lần chạm "Tiếp tục bằng tài khoản" nút chia sẻ thông tin xác thực bằng FedCM. Chỉ áp dụng cho FedCM được hỗ trợ trình duyệt.
`fedcm_auto`	Tự động đăng nhập người dùng trong phiên hiện tại đã có đã đồng ý chia sẻ thông tin xác thực bằng tính năng Một lần chạm của FedCM. Chỉ áp dụng cho FedCM được hỗ trợ trình duyệt.
`user_1tap`	Một người dùng đang có một phiên hoạt động đã nhấn nút Một lần chạm "Tiếp tục bằng tài khoản" để đồng ý và chia sẻ thông tin đăng nhập. Chỉ áp dụng cho Chrome phiên bản 75 trở lên.
`user_2tap`	Một người dùng chưa có phiên hoạt động đã nhấn nút Một lần chạm "Tiếp tục bằng tài khoản" để chọn một tài khoản, rồi nhấn nút Xác nhận trong cửa sổ bật lên để đồng ý và chia sẻ thông tin đăng nhập. Áp dụng cho trình duyệt không dựa trên Chromium.
`btn`	Người dùng trong một phiên hoạt động hiện tại và trước đây đã đồng ý đã nhấn nút Đăng nhập bằng Google và chọn một Tài khoản Google từ "Chọn một tài khoản" để chia sẻ thông tin đăng nhập.
`btn_confirm`	Một người dùng hiện có một phiên hoạt động đã nhấn nút Đăng nhập bằng Google rồi nhấn nút Xác nhận để đồng ý và chia sẻ thông tin đăng nhập.
`btn_add_session`	Một người dùng không có phiên hoạt động hiện có nhưng trước đó đã cấp quyền đồng ý đã nhấn nút Đăng nhập bằng Google để chọn một Tài khoản Google và chia sẻ thông tin đăng nhập.
`btn_confirm_add_session`	Một người dùng chưa có phiên hoạt động trước tiên đã nhấn nút Đăng nhập bằng Google để chọn một Tài khoản Google rồi nhấn nút Xác nhận để đồng ý và chia sẻ thông tin đăng nhập.

tiểu bang

Trường này chỉ được xác định khi người dùng nhấp vào nút Đăng nhập bằng Google để đăng nhập và thuộc tính state của nút được nhấp được chỉ định. Chiến lược phát hành đĩa đơn giá trị của trường này giống với giá trị mà bạn đã chỉ định trong Thuộc tính state.

Vì nhiều nút Đăng nhập bằng Google có thể hiển thị trên cùng một trang, nên bạn có thể gán mỗi nút bằng một chuỗi duy nhất. Do đó, bạn có thể sử dụng trường state này để xác định nút nào người dùng đã nhấp vào để đăng nhập.

Phương thức: google.accounts.id.renderButton

Phương thức google.accounts.id.renderButton kết xuất quy trình Đăng nhập bằng Google trên trang web của mình.

Hãy xem mã ví dụ sau đây về phương thức này:

google.accounts.id.renderButton(
      /** @type{!HTMLElement} */ parent,
      /** @type{!GsiButtonConfiguration} */ options
    )

Loại dữ liệu: GsiButtonConfiguration

Bảng sau đây liệt kê các trường và nội dung mô tả về Loại dữ liệu GsiButtonConfiguration:

Thuộc tính
`type`	Loại nút: biểu tượng hoặc nút chuẩn.
`theme`	Chủ đề của nút. Ví dụ:fill_blue hoặc filled_black.
`size`	Kích thước nút. Ví dụ: nhỏ hoặc lớn.
`text`	Văn bản của nút. Ví dụ: "Đăng nhập bằng Google" hoặc "Đăng ký bằng Google".
`shape`	Hình dạng nút. Ví dụ: hình chữ nhật hoặc hình tròn.
`logo_alignment`	Căn chỉnh biểu trưng của Google: bên trái hoặc chính giữa.
`width`	Chiều rộng của nút, tính bằng pixel.
`locale`	Nếu bạn đặt chính sách này, thì ngôn ngữ của nút sẽ hiển thị.
`click_listener`	Nếu bạn đặt chính sách này, hàm này sẽ được gọi khi nút Đăng nhập bằng Google nút được nhấp vào.
`state`	Nếu được đặt, chuỗi này sẽ trả về cùng với mã thông báo mã nhận dạng.

Loại thuộc tính

Các phần sau đây chứa thông tin chi tiết về loại thuộc tính và một số ví dụ:

loại

Loại nút. Giá trị mặc định là standard.

Hãy xem bảng sau để biết thêm thông tin:

Loại	Bắt buộc	Ví dụ:
string	Có	`type: "icon"`

Bảng sau đây liệt kê các loại nút có thể sử dụng và mô tả:

Loại
`standard`	Nút có văn bản hoặc thông tin được cá nhân hoá.
`icon`	Nút biểu tượng không có văn bản.

chủ đề

Chủ đề của nút. Giá trị mặc định là outline. Hãy xem bảng sau để biết thêm thông tin:

Loại	Bắt buộc	Ví dụ:
string	Không bắt buộc	`theme: "filled_blue"`

Bảng sau đây liệt kê các giao diện có sẵn và nội dung mô tả tương ứng:

Chủ đề
`outline`	Chủ đề nút chuẩn.
`filled_blue`	Giao diện nút màu xanh dương.
`filled_black`	Giao diện nút màu đen.

size

Kích thước nút. Giá trị mặc định là large. Hãy xem bảng sau để biết thêm thông tin:

Loại	Bắt buộc	Ví dụ:
string	Không bắt buộc	`size: "small"`

Bảng sau đây liệt kê các kích thước nút có sẵn và nội dung mô tả tương ứng:

Kích thước
`large`	Một nút lớn.
`medium`	Một nút có kích thước trung bình.
`small`	Một nút nhỏ.

văn bản

Văn bản của nút. Giá trị mặc định là signin_with. Không có hình ảnh sự khác biệt về văn bản của các nút biểu tượng có thuộc tính text khác nhau. Trường hợp ngoại lệ duy nhất là khi văn bản được đọc để kiểm tra khả năng hỗ trợ tiếp cận trên màn hình.

Hãy xem bảng sau để biết thêm thông tin:

Loại	Bắt buộc	Ví dụ:
string	Không bắt buộc	`text: "signup_with"`

Bảng sau đây liệt kê tất cả văn bản cho nút hiện có và mô tả:

Văn bản
`signin_with`	Văn bản nút là "Đăng nhập bằng Google".
`signup_with`	Văn bản nút là "Đăng ký bằng Google".
`continue_with`	Văn bản của nút là "Tiếp tục với Google".
`signin`	Văn bản nút là "Đăng nhập".

hình dạng

Hình dạng nút. Giá trị mặc định là rectangular. Xem bảng sau đây để biết thêm thông tin:

Loại	Bắt buộc	Ví dụ:
string	Không bắt buộc	`shape: "rectangular"`

Bảng sau đây liệt kê các hình dạng nút hiện có và nội dung mô tả:

Hình dạng
`rectangular`	Nút hình chữ nhật. Nếu dùng cho `icon` thì loại nút này sẽ giống như `square`.
`pill`	Nút có hình viên thuốc. Nếu dùng cho nút `icon` thì loại này sẽ giống với `circle`.
`circle`	Nút hình tròn. Nếu dùng cho `standard` thì loại nút này sẽ giống như `pill`.
`square`	Nút hình vuông. Nếu dùng cho `standard` thì loại nút này sẽ giống như `rectangular`.

logo_alignment

Căn chỉnh biểu trưng của Google. Giá trị mặc định là left. Thuộc tính này chỉ áp dụng cho loại nút standard. Hãy xem bảng sau để biết thêm thông tin của bạn:

Loại	Bắt buộc	Ví dụ:
string	Không bắt buộc	`logo_alignment: "center"`

Bảng sau đây liệt kê các cách căn chỉnh có sẵn và nội dung mô tả về các cách đó:

logo_alignment
`left`	Căn trái biểu trưng của Google.
`center`	Căn giữa biểu trưng của Google.

chiều rộng

Chiều rộng tối thiểu của nút, tính bằng pixel. Chiều rộng tối đa là 400 pixel.

Hãy xem bảng sau để biết thêm thông tin:

Loại	Bắt buộc	Ví dụ:
string	Không bắt buộc	`width: "400"`

ngôn ngữ

Không bắt buộc. Hiện văn bản của nút bằng ngôn ngữ được chỉ định, nếu không thì đặt mặc định thành các chế độ cài đặt của trình duyệt hoặc Tài khoản Google của người dùng. Thêm tham số hl và mã ngôn ngữ vào lệnh src khi tải thư viện, ví dụ: gsi/client?hl=<iso-639-code>.

Nếu bạn không đặt chính sách này, thì ngôn ngữ mặc định của trình duyệt hoặc ngôn ngữ của người dùng trong phiên hoạt động trên Google tùy chọn được sử dụng. Do đó, người dùng khác nhau có thể thấy các phiên bản khác nhau của các nút được bản địa hoá và có thể có các kích thước khác nhau.

Hãy xem bảng sau để biết thêm thông tin:

Loại	Bắt buộc	Ví dụ:
string	Không bắt buộc	`locale: "zh_CN"`

click_listener

Bạn có thể xác định hàm JavaScript sẽ được gọi khi tính năng Đăng nhập bằng Google được nhấp bằng thuộc tính click_listener.

  google.accounts.id.renderButton(document.getElementById("signinDiv"), {
      theme: 'outline',
      size: 'large',
      click_listener: onClickHandler
    });

  
  function onClickHandler(){
    console.log("Sign in with Google button clicked...")
  }

Trong ví dụ này, thông báo nhấn nút Đăng nhập bằng Google được nhấp... sẽ được ghi lại vào bảng điều khiển khi nhấp vào nút Đăng nhập bằng Google.

tiểu bang

Không bắt buộc, vì nhiều nút Đăng nhập bằng Google có thể hiển thị trên cùng một nút , bạn có thể gán mỗi nút bằng một chuỗi duy nhất. Cùng một chuỗi sẽ trả lại cùng với mã thông báo nhận dạng, để bạn có thể xác định người dùng nút nào đã nhấp để đăng nhập.

Hãy xem bảng sau để biết thêm thông tin:

Loại	Bắt buộc	Ví dụ:
string	Không bắt buộc	`data-state: "button 1"`

Loại dữ liệu: Thông tin xác thực

Khi native_callback được gọi, đối tượng Credential được truyền dưới dạng tham số. Chiến lược phát hành đĩa đơn bảng sau liệt kê các trường có trong đối tượng:

Trường
`id`	Xác định người dùng.
`password`	Mật khẩu

Phương thức: google.accounts.id.disableAutoSelect

Khi người dùng đăng xuất khỏi trang web, bạn cần gọi phương thức google.accounts.id.disableAutoSelect để ghi trạng thái trong cookie. Chiến dịch này giúp ngăn chặn vòng lặp chết của trải nghiệm người dùng. Hãy xem đoạn mã sau đây của phương thức này:

google.accounts.id.disableAutoSelect()

Mã ví dụ sau đây sẽ triển khai google.accounts.id.disableAutoSelect có hàm onSignout():

<script>
  function onSignout() {
    google.accounts.id.disableAutoSelect();
  }
</script>

Phương thức: google.accounts.id.storeCredential

Phương thức này là một trình bao bọc cho phương thức store() của gốc trình duyệt API trình quản lý thông tin xác thực. Do đó, mật khẩu này chỉ có thể được dùng để lưu trữ một mật khẩu chứng chỉ danh tính. Hãy xem mã ví dụ sau đây về phương thức này:

google.accounts.id.storeCredential(Credential, callback)

Mã ví dụ sau đây sẽ triển khai google.accounts.id.storeCredential có hàm onSignIn():

<script>
  function onSignIn() {
    let cred = {id: '...', password: '...'};
    google.accounts.id.storeCredential(cred);
  }
</script>

Phương thức: google.accounts.id.cancel

Bạn có thể huỷ quy trình Một lần chạm nếu xoá lời nhắc khỏi bên đáng tin cậy DOM. Thao tác huỷ sẽ bị bỏ qua nếu một thông tin xác thực đã được chọn. Xem mã ví dụ sau đây của phương thức:

google.accounts.id.cancel()

Mã ví dụ sau đây sẽ triển khai phương thức google.accounts.id.cancel() bằng hàm onNextButtonClicked():

<script>
  function onNextButtonClicked() {
    google.accounts.id.cancel();
    showPasswordPage();
  }
</script>

Lệnh gọi lại tải thư viện: onGoogleLibraryLoad

Bạn có thể đăng ký một lệnh gọi lại onGoogleLibraryLoad. Thiết bị sẽ nhận được thông báo sau khi Biển báo Trong Với Google, thư viện JavaScript sẽ được tải:

window.onGoogleLibraryLoad = () => {
    ...
};

Lệnh gọi lại này chỉ là lối tắt cho lệnh gọi lại window.onload. Không có khác biệt về hành vi.

Ví dụ về mã sau đây sẽ triển khai một lệnh gọi lại onGoogleLibraryLoad:

<script>
  window.onGoogleLibraryLoad = () => {
   google.accounts.id.initialize({
     ...
   });
   google.accounts.id.prompt();
  };
</script>

Phương thức: google.accounts.id.Revoke

Phương thức google.accounts.id.revoke thu hồi quyền sử dụng OAuth dùng để chia sẻ Mã thông báo giá trị nhận dạng cho người dùng đã chỉ định. Hãy xem đoạn mã sau đây của phương thức này: javascript google.accounts.id.revoke(login_hint, callback)

Thông số	Loại	Mô tả
`login_hint`	string	Địa chỉ email hoặc mã nhận dạng duy nhất của Tài khoản Google của người dùng. Mã này là thuộc tính `sub` của tải trọng thông tin xác thực.
`callback`	hàm	Trình xử lý RevocationResponse không bắt buộc.

Mã mẫu sau đây cho biết cách sử dụng phương thức revoke với một mã nhận dạng.

  google.accounts.id.revoke('1618033988749895', done => {
    console.log(done.error);
  });

Loại dữ liệu: RevocationResponse

Khi hàm callback được gọi, đối tượng RevocationResponse sẽ được gọi được truyền dưới dạng thông số. Bảng sau đây liệt kê các trường có trong bảng sau trong đối tượng phản hồi thu hồi:

Trường
`successful`	Trường này là giá trị trả về của lệnh gọi phương thức.
`error`	Trường này không bắt buộc phải chứa thông báo phản hồi chi tiết về lỗi.

thành công

Trường này là một giá trị boolean được đặt thành true nếu lệnh gọi phương thức thu hồi thành công hoặc false nếu không thành công.

error

Trường này là một giá trị chuỗi và chứa thông báo lỗi chi tiết nếu việc thu hồi lệnh gọi phương thức không thành công, không xác định được lệnh gọi phương thức thành công.