Trang tài liệu tham khảo này mô tả API JavaScript hỗ trợ iframe trung gian, được tính năng Đăng nhập một lần dùng để thao tác với iframe trung gian trong trải nghiệm người dùng tiếp theo.
Hãy xem hướng dẫn Tích hợp tính năng Đăng nhập bằng một lần nhấn bằng iframe để tìm hiểu cách sử dụng iframe trung gian.
Bảng sau đây liệt kê tất cả các phương thức hiện có và hành vi của chúng.
Phương thức | |
---|---|
verifyParentOrigin |
thực hiện quy trình xác minh nguồn gốc của trang mẹ |
notifyParentClose |
thông báo cho khung mẹ rằng luồng trải nghiệm người dùng One Tap bị bỏ qua |
notifyParentDone |
thông báo cho khung mẹ rằng quy trình trải nghiệm người dùng Đăng nhập bằng một lần nhấn đã hoàn tất |
notifyParentResize |
thông báo cho khung mẹ để đổi kích thước iframe trung gian |
notifyParentTapOutsideMode |
thông báo cho khung mẹ biết có huỷ iframe trung gian hay không khi người dùng nhấp vào bên ngoài iframe trung gian |
Tải Thư viện JavaScript hỗ trợ iframe trung gian
Đặt đoạn mã sau vào bất kỳ trang HTML nào mà bạn muốn tải iframe trung gian:
<script src="https://accounts.google.com/gsi/intermediatesupport"></script>
Phương thức: google.accounts.id.intermediate.verifyParentOrigin
Phương thức google.accounts.id.intermediate.verifyParentOrigin
thực hiện quy trình xác minh nguồn gốc mẹ. Hãy xem ví dụ về mã sau đây của phương thức này:
google.accounts.id.intermediate.verifyParentOrigin(
origins, verifiedCallback, verificationFailedCallback)
Ví dụ về mã sau đây cho thấy cách chỉ hiện giao diện người dùng sau khi nguồn gốc mẹ được xác minh:
<script>
window.onload = () => {
google.accounts.id.intermediate.verifyParentOrigin(
"https://example.com", showUI, showError);
};
</script>
Bảng sau đây liệt kê các tham số:
Thông số | |
---|---|
origins |
Các nguồn gốc được phép nhúng iframe trung gian. |
verifiedCallback |
Phương thức gọi lại JavaScript được kích hoạt khi nguồn gốc mẹ hiện tại được phép nhúng iframe trung gian. |
verificationFailedCallback |
Phương thức gọi lại JavaScript được kích hoạt khi nguồn gốc mẹ hiện tại không được phép nhúng iframe trung gian. |
nguồn gốc
Các nguồn gốc được phép nhúng iframe trung gian. Hãy xem bảng sau để biết thêm thông tin:
Loại | Bắt buộc | Ví dụ: |
---|---|---|
chuỗi, mảng chuỗi hoặc hàm | 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ị đó.
Loại 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" |
verifiedCallback
Trường này là một phương thức callback JavaScript được kích hoạt khi nguồn gốc mẹ hiện tại được phép nhúng iframe trung gian.
verificationFailedCallback
Trường này là một phương thức gọi lại JavaScript được kích hoạt khi nguồn gốc mẹ hiện tại không được phép nhúng iframe trung gian.
Phương thức: google.accounts.id.intermediate.notifyParentClose
Phương thức google.accounts.id.intermediate.notifyParentClose
sẽ thông báo cho khung mẹ đóng iframe trung gian khi quy trình trải nghiệm người dùng One Tap bị bỏ qua. Hãy xem ví dụ về mã sau đây của phương thức này:
google.accounts.id.intermediate.notifyParentClose()
Phương thức: google.accounts.id.intermediate.notifyParentDone
Phương thức google.accounts.id.intermediate.notifyParentClose
sẽ thông báo cho khung mẹ đóng iframe trung gian và làm mới trạng thái đăng nhập. Hãy xem ví dụ về mã sau đây của phương thức này:
google.accounts.id.intermediate.notifyParentDone()
Phương thức: google.accounts.id.intermediate.notifyParentResize
Phương thức google.accounts.id.intermediate.notifyParentResize
thông báo cho khung mẹ để đổi kích thước iframe trung gian. Hãy xem ví dụ về mã sau đây của phương thức này:
google.accounts.id.intermediate.notifyParentResize(height)
độ cao
Chiều cao mới tính bằng pixel. Đây là trường bắt buộc. Giá trị này phải là một số không âm.
Nếu tham số chiều cao lớn hơn 0, thì iframe trung gian sẽ được đặt thành chiều cao mới. Nếu tham số chiều cao là 0, thì iframe trung gian sẽ trở nên không hiển thị. Một iframe bị ẩn chưa đóng. Sau này, bạn có thể hiện cửa sổ này bằng một lệnh gọi phương thức đổi kích thước khác.
Phương thức: google.accounts.id.intermediate.notifyParentTapOutsideMode
Phương thức google.accounts.id.intermediate.notifyParentTapOutsideMode
sẽ thông báo cho khung mẹ biết có nên huỷ iframe trung gian hay không khi người dùng nhấp vào bên ngoài iframe trung gian. Hãy xem ví dụ về mã sau đây của phương thức này:
google.accounts.id.intermediate.notifyParentTapOutsideMode(cancel)
hủy
Giá trị boolean bắt buộc này cho biết có huỷ iframe trung gian hay không khi người dùng nhấp vào bên ngoài iframe trung gian.