警告:此数据是根据Google用户数据政策提供的。请查看并遵守政策。否则可能会导致项目或帐户被暂停。

非AMP组件API参考

该参考页介绍了如何将中间iframe加载到HTML页面中。

加载中间Iframe JavaScript库

将以下代码段放入您要Google一键显示的任何HTML页面中:

<script src="https://accounts.google.com/gsi/intermediate"></script>

HTML API

您可以通过包含ID属性设置为g_id_intermediate_iframe的HTML元素来加载中间iframe。请参见以下示例代码片段:

<script src="https://accounts.google.com/gsi/intermediate"></script>
...
<div id="g_id_intermediate_iframe"
        data-src = "https://example.com/onetap_iframe.html">
</div>

标识为“ g_id_intermediate_iframe”的元素

您可以将中间iframe数据属性放在任何可见或不可见的元素中,例如<div><span> 。唯一的要求是将元素ID设置为g_id_intermediate_iframe 。请勿将此ID放在多个元素上。

下表列出了数据属性及其描述:

属性
data-src一键式中间iframe的URI
data-done完成One Tap UX后将触发的JavaScript回调方法。

数据源

此属性是您的One Tap中间iframe的URI。有关更多信息,请参见下表:

类型必需的例子
细绳是的data-src="https://example.com/onetap_iframe.html"

数据完成

此属性是一种JavaScript回调方法,将在完成“一键式UX”操作后触发。

默认情况下,完成“一键式UX”后将重新加载内容页面。您可以通过提供自己的完成的回调来覆盖默认行为。有关更多信息,请参见下表:

类型必需的例子
功能可选的data-done="onOneTapSuccess"

JavaScript API

您可以通过调用JavaScript方法来加载中间iframe。

方法:google.accounts.id.initializeIntermediate

google.accounts.id.initializeIntermediate方法基于配置对象加载中间iframe。请参见以下方法的代码示例:

google.accounts.id.initializeIntermediate(IntermediateConfig)

以下代码示例通过onload函数实现google.accounts.id.initializeIntermediate方法:

<script>
  window.onload = function () {
    google.accounts.initializeIntermediate({
      src: 'https://example.com/intermediate'
    });
  };
</script>

数据类型:IntermediateConfig

下表列出了字段及其描述:

场地
src一键式中间iframe的URI
done当One Tap UX为one时将触发的JavaScript回调方法。

src

该字段是您的One Tap中间iframe的URI。有关更多信息,请参见下表:

类型必需的例子
细绳是的src: "https://example.com/onetap_iframe.html"

完毕

此字段是完成One Tap UX后将触发的JavaScript回调方法。

默认情况下,完成“一键式UX”后将重新加载内容页面。您可以通过提供自己的完成的回调来覆盖默认行为。有关更多信息,请参见下表:

类型必需的例子
功能可选的done: onOneTapSuccess