此参考页面介绍了中间 iframe 支持 JavaScript API,该 API 由一键登录功能用于在后续用户体验中操纵中间 iframe。
如需了解如何使用中间 iframe,请参阅使用 iframe 集成一键登录指南。
下表列出了所有可用的方法及其行为。
方法 | |
---|---|
verifyParentOrigin |
执行父来源验证 |
notifyParentClose |
通知父框架跳过一键登录用户体验流程 |
notifyParentDone |
通知父框架单点触控用户体验流程已完成 |
notifyParentResize |
通知父框架调整中间 iframe 的大小 |
notifyParentTapOutsideMode |
通知父框架当用户点击中间 iframe 之外的区域时是否取消中间 iframe |
加载中间 iframe 支持 JavaScript 库
将以下代码段放置到您要加载中间 iframe 的任何 HTML 网页中:
<script src="https://accounts.google.com/gsi/intermediatesupport"></script>
方法:google.accounts.id.intermediate.verifyParentOrigin
google.accounts.id.intermediate.verifyParentOrigin
方法执行父源验证。请参阅以下方法代码示例:
google.accounts.id.intermediate.verifyParentOrigin(
origins, verifiedCallback, verificationFailedCallback)
以下代码示例展示了如何在验证父源后才显示界面:
<script>
window.onload = () => {
google.accounts.id.intermediate.verifyParentOrigin(
"https://example.com", showUI, showError);
};
</script>
下表列出了这些参数:
参数 | |
---|---|
origins |
允许嵌入中间 iframe 的来源。 |
verifiedCallback |
当当前父源获准嵌入中间 iframe 时触发的 JavaScript 回调方法。 |
verificationFailedCallback |
当当前父来源不允许嵌入中间 iframe 时触发的 JavaScript 回调方法。 |
来源
允许嵌入中间 iframe 的来源。如需了解详情,请参阅下表:
类型 | 是否必须提供 | 示例 |
---|---|---|
字符串、字符串数组或函数 | 可选 | allowed_parent_origin: "https://example.com" |
下表列出了支持的值类型及其说明。
值类型 | ||
---|---|---|
string |
单个网域 URI。 | “https://example.com” |
string array |
网域 URI 数组。 | "https://news.example.com,https://local.example.com" |
verifiedCallback
此字段是一个 JavaScript 回调方法,当允许当前父来源嵌入中间 iframe 时触发。
verificationFailedCallback
此字段是一个 JavaScript 回调方法,当当前父来源不允许嵌入中间 iframe 时触发。
方法:google.accounts.id.intermediate.notifyParentClose
当跳过“一键登录”用户体验流程时,google.accounts.id.intermediate.notifyParentClose
方法会通知父框架关闭中间 iframe。请参阅以下方法代码示例:
google.accounts.id.intermediate.notifyParentClose()
方法:google.accounts.id.intermediate.notifyParentDone
google.accounts.id.intermediate.notifyParentClose
方法会通知父框架关闭中间 iframe 并刷新登录状态。请参阅以下方法代码示例:
google.accounts.id.intermediate.notifyParentDone()
方法:google.accounts.id.intermediate.notifyParentResize
google.accounts.id.intermediate.notifyParentResize
方法会通知父框架调整中间 iframe 的大小。请参阅以下方法代码示例:
google.accounts.id.intermediate.notifyParentResize(height)
高度
新的高度(以像素为单位)。这是必填字段。该值必须是非负数。
如果高度参数大于 0,则中间 iframe 会设置为新的高度。如果 height 参数为 0,则中间 iframe 会变为不可见。隐藏的 iframe 未关闭。之后,可以通过另一次调整大小方法调用来显示它。
方法:google.accounts.id.intermediate.notifyParentTapOutsideMode
当用户点击中间 iframe 之外的区域时,google.accounts.id.intermediate.notifyParentTapOutsideMode
方法会通知父框架是否取消中间 iframe。请参阅以下方法代码示例:
google.accounts.id.intermediate.notifyParentTapOutsideMode(cancel)
取消
此必需的布尔值用于指示当用户点击中间 iframe 之外的区域时,是否取消中间 iframe。