<?xml version="1.0" encoding="UTF-8"?>
<rss version="2.0" xmlns:atom="http://www.w3.org/2005/Atom" xmlns:dc="http://purl.org/dc/elements/1.1/">
  <channel>
    <title>DEV Community: Julian Barbosa</title>
    <description>The latest articles on DEV Community by Julian Barbosa (@julian_barbosa).</description>
    <link>https://dev.to/julian_barbosa</link>
    <image>
      <url>https://media2.dev.to/dynamic/image/width=90,height=90,fit=cover,gravity=auto,format=auto/https:%2F%2Fdev-to-uploads.s3.amazonaws.com%2Fuploads%2Fuser%2Fprofile_image%2F465379%2Fb1fa63a2-96d7-4c9c-9dcd-277cdc23f1a7.png</url>
      <title>DEV Community: Julian Barbosa</title>
      <link>https://dev.to/julian_barbosa</link>
    </image>
    <atom:link rel="self" type="application/rss+xml" href="https://dev.to/feed/julian_barbosa"/>
    <language>en</language>
    <item>
      <title>JWT: Um breve resumo.</title>
      <dc:creator>Julian Barbosa</dc:creator>
      <pubDate>Fri, 08 Dec 2023 01:47:25 +0000</pubDate>
      <link>https://dev.to/julian_barbosa/jwt-um-breve-resumo-52bi</link>
      <guid>https://dev.to/julian_barbosa/jwt-um-breve-resumo-52bi</guid>
      <description>&lt;h2&gt;
  
  
  Para que serve?
&lt;/h2&gt;

&lt;p&gt;Tokens JWT são tokens "autossuficientes" que servem para realizar troca de informações de forma segura entre aplicações no formato JSON&lt;/p&gt;

&lt;h3&gt;
  
  
  Self-Contained
&lt;/h3&gt;

&lt;p&gt;Os tokens carregam dentro de si todas as informações necessárias para validá-lo. Ou seja: são autossuficientes.&lt;/p&gt;

&lt;h3&gt;
  
  
  Stateless
&lt;/h3&gt;

&lt;p&gt;Sendo os tokens autossuficientes, nós não precisamos salvar anda no servidor em um cache ou banco de dados, por isso não possuem estado.&lt;/p&gt;

&lt;h2&gt;
  
  
  Anatomia de um Token JWT
&lt;/h2&gt;

&lt;p&gt;A Anatomia de um token JWT consiste em três strings criptografadas que são separadas por um ponto, onde cada string representa uma parte do JWT, seguindo a seguinte estrutura:&lt;br&gt;
&lt;/p&gt;

&lt;div class="highlight js-code-highlight"&gt;
&lt;pre class="highlight plaintext"&gt;&lt;code&gt;header.payload.signature
&lt;/code&gt;&lt;/pre&gt;

&lt;/div&gt;



&lt;p&gt;Falaremos um pouco mais sobre cada uma das partes que compõe o token e abaixo segue um exemplo de um token jwt real retirado do site &lt;a href="https://jwt.io/" rel="noopener noreferrer"&gt;https://jwt.io/&lt;/a&gt;&lt;br&gt;
&lt;/p&gt;

&lt;div class="highlight js-code-highlight"&gt;
&lt;pre class="highlight plaintext"&gt;&lt;code&gt;eyJhbGciOiJIUzI1NiIsInR5cCI6IkpXVCJ9.eyJzdWIiOiIxMjM0NTY3ODkwIiwibmFtZSI6IkpvaG4gRG9lIiwiaWF0IjoxNTE2MjM5MDIyfQ.SflKxwRJSMeKKF2QT4fwpMeJf36POk6yJV_adQssw5c
&lt;/code&gt;&lt;/pre&gt;

&lt;/div&gt;



&lt;h3&gt;
  
  
  Header
&lt;/h3&gt;

&lt;div class="highlight js-code-highlight"&gt;
&lt;pre class="highlight plaintext"&gt;&lt;code&gt;eyJhbGciOiJIUzI1NiIsInR5cCI6IkpXVCJ9
&lt;/code&gt;&lt;/pre&gt;

&lt;/div&gt;

&lt;p&gt;O Header do JWT é onde armazenamos informações como o tipo de token (JWT) e o algoritmo usado para gerar a assinatura do nosso token.&lt;br&gt;
&lt;/p&gt;

&lt;div class="highlight js-code-highlight"&gt;
&lt;pre class="highlight plaintext"&gt;&lt;code&gt;{
  "alg": "HS256",
  "typ": "JWT"
}
alg = algorítmo utilizado para a geração do token
typ = tipo de token
&lt;/code&gt;&lt;/pre&gt;

&lt;/div&gt;



&lt;h3&gt;
  
  
  Payload
&lt;/h3&gt;

&lt;div class="highlight js-code-highlight"&gt;
&lt;pre class="highlight plaintext"&gt;&lt;code&gt;eyJzdWIiOiIxMjM0NTY3ODkwIiwibmFtZSI6IkpvaG4gRG9lIiwiaWF0IjoxNTE2MjM5MDIyfQ
&lt;/code&gt;&lt;/pre&gt;

&lt;/div&gt;

&lt;p&gt;O Payload é o lugar onde salvamos as informações do token: quando foi gerado, data de expiração, id do usuário que gerou, etc...&lt;/p&gt;

&lt;p&gt;Dentro do payload podemos inserir quaisquer dados que quisermos, porém abaixo fica um exemplo de uma convenção utilizada:&lt;br&gt;
&lt;/p&gt;

&lt;div class="highlight js-code-highlight"&gt;
&lt;pre class="highlight plaintext"&gt;&lt;code&gt;{
  "sub": "1234567890",
  "name": "John Doe",
  "iat": 1516239022
}

sub = Subject
iat = issued at, data de quando o token foi gerado.
&lt;/code&gt;&lt;/pre&gt;

&lt;/div&gt;



&lt;p&gt;Note que o payload cresce proprocionalmente à quantidade de itens inseridas, portanto não envie o banco de dados inteiro no seu payload.&lt;/p&gt;

&lt;p&gt;Tanto o Header quanto o Payload são encodados em base64, uma codificação simples que converte uma string pra outra string, onde é possível fazer o decode de forma fácil em qualquer lugar, portanto não é recomendado inserir dados sensíveis no token.&lt;/p&gt;

&lt;h3&gt;
  
  
  Assinatura
&lt;/h3&gt;

&lt;div class="highlight js-code-highlight"&gt;
&lt;pre class="highlight plaintext"&gt;&lt;code&gt;SflKxwRJSMeKKF2QT4fwpMeJf36POk6yJV_adQssw5c
&lt;/code&gt;&lt;/pre&gt;

&lt;/div&gt;

&lt;p&gt;A Assinatura é a parte mais importante do JWT pois ela é quem garante que o token foi gerado pela sua aplicação e que não foi modificado após ser gerado.&lt;/p&gt;

&lt;blockquote&gt;
&lt;p&gt;HS256 é uma sigla para Hash-based Message Authentication Code&lt;/p&gt;
&lt;/blockquote&gt;

&lt;p&gt;Pra gerar o hash e autenticar nossa assinatura é necessário o header, payload e uma chave secreta, que preferencialmente fica numa variável de ambiente no backend.&lt;br&gt;
&lt;/p&gt;

&lt;div class="highlight js-code-highlight"&gt;
&lt;pre class="highlight javascript"&gt;&lt;code&gt;&lt;span class="nf"&gt;hash&lt;/span&gt;&lt;span class="p"&gt;(&lt;/span&gt;&lt;span class="s2"&gt;`&lt;/span&gt;&lt;span class="p"&gt;${&lt;/span&gt;&lt;span class="nx"&gt;base64encodedHeader&lt;/span&gt;&lt;span class="p"&gt;}&lt;/span&gt;&lt;span class="s2"&gt;.&lt;/span&gt;&lt;span class="p"&gt;${&lt;/span&gt;&lt;span class="nx"&gt;base64encodedPayload&lt;/span&gt;&lt;span class="p"&gt;}&lt;/span&gt;&lt;span class="s2"&gt;`&lt;/span&gt;&lt;span class="p"&gt;,&lt;/span&gt; &lt;span class="dl"&gt;'&lt;/span&gt;&lt;span class="s1"&gt;secret_key&lt;/span&gt;&lt;span class="dl"&gt;'&lt;/span&gt;&lt;span class="p"&gt;);&lt;/span&gt;
&lt;/code&gt;&lt;/pre&gt;

&lt;/div&gt;



&lt;p&gt;A "autenticação" da assinatura é feita através do HMAC (Código de Autenticação de Mensagem Baseado em Hash), gerando a hash utilizando uma chave secreta e depois garantir que foi gerada pela nossa aplicação, utilizando algum algoritmo de criptografia (SHA256 por exemplo) &lt;/p&gt;

&lt;blockquote&gt;
&lt;p&gt;O HMAC é como uma função pura, o retorno é exatamente o mesmo dado os mesmos dados de entrada (header, payload e secret) com isso é possível validar a integridade da assinatura do token&lt;/p&gt;
&lt;/blockquote&gt;

&lt;h3&gt;
  
  
  Como validamos o token?
&lt;/h3&gt;

&lt;p&gt;Basicamente geramos o mesmo hash no backend: Ao receber o token JWT, extraímos o header, payload e geramos novamente a hash utilizando nossa secret_key, sendo assim possível comparar o token recebido na requisição com o token enviado pelo backend na autenticação do usuário.&lt;/p&gt;

&lt;p&gt;Dessa forma, a validação é feita utilizando as assinaturas geradas de ambos os tokens, caso o payload enviado pelo usuário tenha sido alterado a assinatura (HMAC) também será alterada, invalidando o token.&lt;/p&gt;

&lt;p&gt;Caso alguém tenha acesso à nossa secret_key, seria possível gerar um hash válido, por isso não devemos expor essa secret_key para ferramentas de controle de versão no nosso backend.&lt;/p&gt;

&lt;p&gt;&lt;a href="https://media.dev.to/dynamic/image/width=800%2Cheight=%2Cfit=scale-down%2Cgravity=auto%2Cformat=auto/https%3A%2F%2Fdev-to-uploads.s3.amazonaws.com%2Fuploads%2Farticles%2Fomehmg45b6reij6yo9je.png" class="article-body-image-wrapper"&gt;&lt;img src="https://media.dev.to/dynamic/image/width=800%2Cheight=%2Cfit=scale-down%2Cgravity=auto%2Cformat=auto/https%3A%2F%2Fdev-to-uploads.s3.amazonaws.com%2Fuploads%2Farticles%2Fomehmg45b6reij6yo9je.png" alt="Diagrama de validação do token JWT"&gt;&lt;/a&gt;&lt;/p&gt;

&lt;h2&gt;
  
  
  Primeiro envio do token
&lt;/h2&gt;

&lt;p&gt;O primeiro envio e geração do token é realizado quando o usuário se autentica na aplicação, retornamos o token para que o usuário salve para futuras requisições, como no localStorage ou nos cookies do navegador&lt;/p&gt;

&lt;p&gt;&lt;a href="https://media.dev.to/dynamic/image/width=800%2Cheight=%2Cfit=scale-down%2Cgravity=auto%2Cformat=auto/https%3A%2F%2Fdev-to-uploads.s3.amazonaws.com%2Fuploads%2Farticles%2F44k1q7aqpmkhjtc0t49r.png" class="article-body-image-wrapper"&gt;&lt;img src="https://media.dev.to/dynamic/image/width=800%2Cheight=%2Cfit=scale-down%2Cgravity=auto%2Cformat=auto/https%3A%2F%2Fdev-to-uploads.s3.amazonaws.com%2Fuploads%2Farticles%2F44k1q7aqpmkhjtc0t49r.png" alt="Diagrama de geração do token JWT"&gt;&lt;/a&gt;&lt;/p&gt;

&lt;blockquote&gt;
&lt;p&gt;Note que, independente do que você fizer, não é recomendado salvar o token JWT no localStorage ou sessionStorage. Caso algum dos scripts que você incluiu na sua aplicação esteja comprometido, pode acessar todos os tokens do usuário. É recomendado salvar dentro de um cookie httpOnly para manter seu token JWT seguro. Esse é um cookie especial que só é enviado em requisições HTTP para o servidor e não é acessível para o javascript rodando no navegador&lt;/p&gt;
&lt;/blockquote&gt;

</description>
      <category>webdev</category>
      <category>jwt</category>
      <category>backend</category>
    </item>
  </channel>
</rss>
