path: root/files/pt-br/browserid/configuracao_rapida/index.html

---
title: Configuração Rápida
slug: BrowserID/Configuracao_Rapida
translation_of: Archive/Mozilla/Persona/Quick_Setup
---
<h2 id="Carregar_a_biblioteca_do_BrowserID">Carregar a biblioteca do BrowserID</h2>
<p>Inclua a biblioteca do BrowserID no seu site a partir de <a class="link-https" href="https://browserid.org/include.js">https://browserid.org/include.js</a>, certifique-se que ela carregue antes de chamar qualquer função <a href="/en/BrowserID/navigator.id" title="navigator.id"><code>navigator.id</code></a>.</p>
<p>Por exemplo:</p>
<pre class="brush: html">&lt;script src="https://browserid.org/include.js" type="text/javascript"&gt;&lt;/script&gt;
</pre>
<p>A biblioteca é projetada para ser neutra aos navegadores e funciona bem com o último Opera, Firefox, Chrome, Safari e Internet Explorer 8+ (amazenamento local - local storage - e postMessage são recursos detectados). No Internet Explorer 6 e 7, o script include.js não funcionará, mas ele foi feito de uma forma que a segurança do BrowserID para o Internet Explorer 6 e 7 é preservada (não é possível nenhum vazamento declaração ou endereço de email).</p>
<h2 id="Peça_ao_usuário_para_se_autenticar">Peça ao usuário para se autenticar</h2>
<p>Adicione um botão de login na sua página. Mesmo sendo completamente opcional, você pode usar um dos seguintes botões do BrowserID:</p>
<p><img alt="A red sign in button" src="https://browserid.org/i/sign_in_red.png"> <img alt="A blue sign in button" src="https://browserid.org/i/sign_in_blue.png"> <img alt="A orange sign in button" src="https://browserid.org/i/sign_in_orange.png"> <img alt="A green sign in button" src="https://browserid.org/i/sign_in_green.png"> <img alt="A grey sign in button" src="https://browserid.org/i/sign_in_grey.png" style=""></p>
<p>Por exemplo:</p>
<pre class="brush: html">&lt;a href="#" id="browserid" title="Sign-in with BrowserID"&gt;
  &lt;img src="/images/sign_in_blue.png" alt="Sign in"&gt;
&lt;/a&gt;</pre>
<p>Quando o usuário clicar no botão de login, chame a função <a href="/en/DOM/navigator.id.get" title="navigator.id.get"><code>navigator.id.get()</code></a>, passando uma função de retorno:</p>
<pre class="brush: js">(function() {
  $('#browserid').click(function() {
    navigator.id.get(gotAssertion);
    return false;
  });
});
</pre>
<p>Em caso de sucesso, o retorno será a <strong>declaração</strong> (assertion): essa é uma string contendo um pedido verificado que o usuário possui um endereço de email particular.</p>
<h2 id="Verifique_a_declaração">Verifique a declaração</h2>
<p>Você precisará enviar essa declaração para o servidor para verificá-la, por exemplo usando uma requisição AJAX.</p>
<pre class="brush: js">function gotAssertion(assertion) {
  // recebeu uma declaração, agora enviar para o servidor para verificação
  if (assertion !== null) {
    $.ajax({
      type: 'POST',
      url: '/api/login',
      data: { assertion: assertion },
      success: function(res, status, xhr) {
        if (res === null) {}//loggedOut();
          else loggedIn(res);
        },
      error: function(res, status, xhr) {
        alert("login failure" + res);
      }
    });
  } else {
    //loggedOut();
  }
}</pre>
<p>Nesse exemplo temos um serviço rodando em <code>/api/login</code> que recebe e verifica as declarações. Se o serviço verificar a declaração com sucesso podemos atualizar a Interface do Usuário (UI) chamando a função <code>loggedIn()</code>, ou então podemos manusear a falha no login.</p>
<div class="note">
  <strong>Nota:</strong> É importante que a declaração seja verificada no servidor e não no navegador.</div>
<p>On the server, you must verify the assertion, and extract the user's email address from it.</p>
<p>A maneira mais fácil de fazer isso é usar um serviço de verificação grátis provido pelo BrowserID. Envie uma requisição POST para <span class="nowiki"><code>https://browserid.org/verify</code></span> com dois parâmetros:</p>
<ul>
  <li><code>assertion</code>: a declaração codificadathe encoded assertion</li>
  <li><code>audience</code>: o hostname e porta opcional do seu site. Isso dificulta que uma declaração criada por outro site ganhe acesso no seu. Você deve especificar a audiência explicitamente e não confiar em um parâmetro enviado pelo navegador do usuário, como o <code>document.location</code>. O serviço irá verificar se a audiência que você especificou combina com o nome do domínio incluído na declaração.</li>
</ul>
<div class="note">
  <strong>Note:</strong> Essa chamada era um <code>GET</code>. A partir de 13 de outubro de 2011 ela deverá ser um <code>POST</code>.</div>
<p>O serviço verificará que a declaração foi feita para o seu site e é válida. Ela responde com uma estrutura JSON contendo o conteúdo da declaração e o código do status.</p>
<p>Suponha que você tenha uma declaração que peça ao endereço <span class="nowiki"><code>https://mysite.com</code></span> aceitar o email <span class="nowiki"><code>lloyd@example.com</code></span>.</p>
<p>Você pode enviá-lo para <span class="nowiki"><code>https://browserid.org/verify</code></span>:</p>
<pre><code>$ curl -d "assertion=&lt;ASSERTION&gt;&amp;audience=https://mysite.com" "https://browserid.org/verify"
</code></pre>
<p>Essa é a resposta:</p>
<pre>{
    "status": "okay",
    "email": "lloyd@example.com",
    "audience": "https://mysite.com",
    "expires": 1308859352261,
    "issuer": "browserid.org"
}
</pre>
<p>Você só precisa de verificar se o status é "okay", e se for, o usuário pode fazer o login. Você pode criar uma sessão para ele e definir um cookie no navegador para identificar a sessão.</p>
<p>Um exemplo da implementação do /api/login em PHP:.</p>
<pre><code>$url = 'https://browserid.org/verify';
$data = http_build_query(array('assertion' =&gt; $_POST['assertion'], 'audience' =&gt; urlencode('mysite.com')));

$params = array(
    'http' =&gt; array(
        'method' =&gt; 'POST',
        'content' =&gt; $data,
        'header'=&gt; "Content-type: application/x-www-form-urlencoded\r\n"
            . "Content-Length: " . strlen($data) . "\r\n"
    )
);

$ctx = stream_context_create($params);
$fp = fopen($url, 'rb', false, $ctx);

if ($fp) {
  $result = stream_get_contents($fp);
}
else {
  $result = FALSE;
}</code>

$json = json_decode($result);

if ($json-&gt;status == 'okay') {
  // the user logged in successfully.
}
else {
  // log in failed.
}

echo $result;
</pre>
<h2 id="Implementação_do_logout">Implementação do logout</h2>
<p>Você pode implementar o logout simplesmente removendo o cookie de sessão do usuário. Se você implementou o suporte para <a href="/en/BrowserID/Advanced_Features" title="Advanced Features">persistent login</a>, então você também precisará chamar {{ domxref("navigator.id.logout()") }}.</p>
<p>Dependendo de quanto tempo tem desde que o usuário fez o login no provedor de identidade dele, o usuário ainda pode ter um certificado válido: se esse for o caso, então quando o usuário voltar a fazer o login, não será perguntado a eles pela senha do BrowserID. Mas será perguntado um endereço de email para usar e confirmar que eles querem entrar.</p>
<p>{{ languages( { "en": "en/BrowserID/Quick_Setup", "es": "es/BrowserID/Configuración_rápida", "pt-BR": "pt-BR/BrowserID/Configuracao_Rapida" } ) }}</p>