Esta página de referência descreve como carregar um iframe intermediário em páginas HTML.
Carregar a biblioteca intermediária JavaScript de iframe
Coloque o seguinte snippet de código em qualquer página HTML que você queira mostrar no Google One:
<script src="https://accounts.google.com/gsi/intermediate"></script>
API HTML
É possível carregar o iframe intermediário incluindo um elemento HTML com o atributo de ID definido como g_id_intermediate_iframe
. Confira o exemplo de snippet de código
a seguir:
<script src="https://accounts.google.com/gsi/intermediate"></script>
<div id="g_id_intermediate_iframe"
data-src="https://example.com/onetap_iframe.html">
</div>
Elemento com o ID "g_id_intermediate_iframe"
Você pode colocar os atributos de dados do iframe intermediários em elementos visíveis ou invisíveis, como <div>
e <span>
. O único requisito é que o ID do elemento
seja definido como g_id_intermediate_iframe
. Não coloque esse ID em vários elementos.
A tabela a seguir lista os atributos de dados com as respectivas descrições:
Atributo | |
---|---|
data-src |
O URI do iframe intermediário com um toque |
data-done |
Um método de callback JavaScript a ser acionado quando a UX com um toque for concluída. |
dados-src.
Esse atributo é o URI do iframe intermediário com um toque. Consulte a tabela a seguir para mais informações:
Tipo | Obrigatório | Exemplo |
---|---|---|
string | Sim | data-src="https://example.com/onetap_iframe.html" |
dados concluídos
Esse atributo é um método de callback JavaScript acionado quando a UX com um toque é concluída.
Por padrão, a página de conteúdo é recarregada quando a UX com um toque é concluída. É possível substituir o comportamento padrão fornecendo seu próprio callback. Consulte a tabela a seguir para mais informações:
Tipo | Obrigatório | Exemplo |
---|---|---|
Função | Opcional | data-done="onOneTapSuccess" |
JavaScript API
Você pode carregar o iframe intermediário chamando um método JavaScript.
Método: google.accounts.id.InitializeIntermediate
O método google.accounts.id.initializeIntermediate
carrega o iframe intermediário
com base no objeto de configuração. Confira o exemplo de código do
método a seguir:
google.accounts.id.initializeIntermediate(IntermediateConfig)
O exemplo de código abaixo implementa o
método google.accounts.id.initializeIntermediate
com uma função onload
:
<script>
window.onload = function () {
google.accounts.id.initializeIntermediate({
src: 'https://example.com/intermediate'
});
};
</script>
Tipo de dados: IntermediateConfig
A tabela a seguir lista os campos com as respectivas descrições:
Campo | |
---|---|
src |
O URI do iframe intermediário com um toque |
done |
Um método de callback JavaScript a ser acionado quando a UX com um toque for um. |
src
Este campo é o URI do iframe intermediário com um toque. Consulte a tabela a seguir para mais informações:
Tipo | Obrigatório | Exemplo |
---|---|---|
string | Sim | src: "https://example.com/onetap_iframe.html" |
concluído
Esse campo é o método de callback JavaScript que será acionado quando a UX com um toque for concluída.
Por padrão, a página de conteúdo é recarregada quando a UX com um toque é concluída. É possível substituir o comportamento padrão fornecendo seu próprio callback. Consulte a tabela a seguir para mais informações:
Tipo | Obrigatório | Exemplo |
---|---|---|
Função | Opcional | done: onOneTapSuccess |