...
O que é?
Você pode personalizar seu formulário HTML para registrar consentimentos sem a necessidade de programar, utilizando apenas marcações no código.
| Note |
|---|
Este recurso está disponível apenas na API JavaScript nativa e ainda não está disponível para o SDK React.js ou Angular. |
...
Passo a Passo
| Table of Contents | ||
|---|---|---|
|
...
Primeiro Passo
Primeiramente, você deve importar o SDK JavaScript "sdkconsent.min.js" no seu código-fonte.
| Code Block | ||
|---|---|---|
| ||
<script src="https://cdn.privacytools.com.br/sdkconsent/dist/sdkconsent.min.js" type="text/javascript"></script>
<link rel="stylesheet" href="https://cdn.privacytools.com.br/sdkconsent/dist/sdkconsent.css" type="text/css" />
var sdk = sdkConsent("https://HOST/public_api/consent","sua chave publica"); |
...
Segundo Passo
Você precisará adicionar apenas algumas marcações para indicar ao SDK o que ele deve fazer.
...
| Code Block | ||
|---|---|---|
| ||
<form id="form-checkbox" action="#" method="post" data-consent-submit>
<input type="hidden" data-consent-user value="hashdousuario"/>
<table>
<tr>
<td width="200px">
Nome
</td>
<td>
<input type="text" data-consent-property name="name" width="200px"/>
</td>
</tr>
<tr>
<td>
Email
</td>
<td>
<input type="email" data-consent-property name="email" width="200px"/>
</td>
</tr>
<tr>
<td>
Cidade
</td>
<td>
<input type="text" data-consent-property name="city" width="200px"/>
</td>
</tr>
<tr>
<td colspan="2">
<input type="checkbox" name="accept" value="yes"
data-consent-reason="hashtemplate"
/>
Gostaria de receber emails promocionais
</td>
</tr>
<tr>
<td colspan="2">
<input type="submit" value="Enviar"/>
</td>
</tr>
</table>
</form> |
...
Tabela de Marcações
Marcação | Onde usar | Para que serve |
|---|---|---|
| Na sua tag | O SDK irá criar uma chamada no Se o seu código já tiver uma declaração Caso você não possa sobrescrevê-la, consulte as instruções no final da página. |
| Crie um campo hidden dentro do seu formulário:
| Você precisa enviar o hashUser do usuário para registrar o consentimento. Sem esse hashUser, o processo não funcionará. |
| Em um ou mais checkboxes ou combos de seleção:
Qualquer outro valor será interpretado como SIM. | Em um formulário, você pode coletar o consentimento para várias finalidades. Cada checkbox ou combo deve ser vinculado a uma finalidade específica. Obtenha o hash da finalidade e adicione como uma marcação diretamente no checkbox ou combo. Exemplo:
Ou
|
| Coloque esta marcação em cada dado pessoal do formulário que você deseja gravar. Para os dados pessoais abaixo, o sistema já possui campos pré-definidos. Caso o dado pessoal não seja nenhum desses, ele será registrado como um metadado da pessoa.
| Muitas vezes, o formulário irá coletar outros dados pessoais que você deseja vincular à pessoa através do hash. Utilize a propriedade opcional para fazer esse vínculo. |
...
Como obtenho o consentHash?
O consentHash é o hash que representa cada consentimento salvo – é como um "recibo" do consentimento. Quando o SDK registra o consentimento através do formulário, ele cria de volta um campo hidden com o nome "data-consent-hash" no seu HTML. Caso ocorra algum erro, ele criará o campo hidden com o nome "data-consent-error" no seu HTML.
Esses campos podem ser capturados no seu sistema após o envio (submit) do formulário.
...
Não quero sobrescrever o ‘onsubmit’
Caso o seu código não possa sobrescrever o onsubmit, você precisará chamar a função de gravação manualmente, seguindo as instruções abaixo:
| Code Block |
|---|
/**
A variável "sdk" é a sua referência para o SDK criada no início.
A referência "myForm" deve referenciar o seu formulário (ex: document.forms[0])
*/
sdk.registerFormConsents(myForm, function (consentHash) {
//faz alguma coisa com o recibo de sucesso do consentimento
//faça o seu submit
},function(error){
//faça alguma coisa com o erro de registro de consentimento
});
|
Pronto, neste caso você vai fazer a chamada manual.
...
Ficou com dúvidas? Chame o Time de Suporte 👈