--- title: JWT slug: jwt description: This document provides a detailed guide on using JWT (JSON Web Token) for secure information transmission in web applications. Learn how to create a flow using the JWT connector, configuring essential parameters. Unlock the power of JWT operations within docTags: createdAt: 2023-09-18T18:11:31.965Z --- ## Objetivo JWT (JSON Web Token) é uma maneira eficaz e segura de transmitir informações entre partes confiáveis em um formato autenticado e compacto. Ele é amplamente usado em aplicações web modernas como uma solução de autenticação e autorização. Com esse conector será possivel validar, criar e extrair valores de tokens JWTs fornecendo assim uma maior segurança e compatibilidade nos fluxos de integração. :::hint{type="info"} *Para mais informações consulte o site oficial do *[jwt.io](https://jwt.io/introduction) ::: ## Criando um fluxo utilizando Conector JWT 1- Este conector não precisa de conexão para ser usado. Basta configurar suas parametrizações de acordo com a lógica a ser implementada no fluxo. Para usá-lo, crie um fluxo e arraste o conector JWT para o canvas. OBS: [Acesse aqui](#) o passo a passo para criar um fluxo. 2- Após arrastar o conector para o canvas, selecione-o e na aba `Parametrizações`, preencha os seguintes parâmetros de configuração: - **Operação**: ação que será realizada. - **Decodificar Token: **requer o preenchimento do campo *Token* e da parte do token que será decodificado no campo *Decodificar*, tendo disponiveis as opções Reivindicações(claims) e Cabeçalho(header); - **Criar Token: **requer o preenchimento do campo *Chave Secreta *no qual será usado para assinatura do token, o campo *Método de Assinatura *(atualmente é suportado três tipos, sendo eles HS256, HS384 e HS512)*, *e por fim o campo *Reivindicações *usado para informar o payload que deseja criptografar, podendo ser eviado utilizando [De/para](#) ou [Template](#); - **Validar Token: ** requer o preenchimento dos campos *Chave Secreta *e *Token;* - **Buscar e extrair JWK:** requer o preenchimento do campo URL contendo as keys para extrair a chave publica. - **Criar Token JWE:** Informe a *Chave Publica*, o *JWT Assinado*, selecione o *Algoritimo de Gerenciamento de Chaves*, selecione a *Criptografia de Conteúdo* e caso necessário informe *Cabeçalhos* para criar um token JWE. - **Token JWT RSA assinado com Fluid-JWK:** Cria um token RSA assinado com uma chave privada da Fluid. Para isso é necessário informar o *Algoritimo de Gerenciamento de Chaves *e as *Reivindicações*(claims) necessárias. *Nota: Estes campos podem ser preenchidos usando *[Fluid Expression Language](#). 3- Na aba `Propriedades` dê um nome ao 'Passo' e se necessário detalhe uma descrição. ## Na prática Neste tópico criaremos um fluxo que irá demonstrar todas as operações disponíveis do conector JWT. O fluxo terá quatro passos, sendo eles **create**, **decode-claims**, **decode-header** e **validate**, onde será criado um token que irá ser decodificado e validado. ![](https://app.archbee.com/api/optimize/G1NTw6yAi4RDUYbsU8csp/Rhx9TmnJZ23l3Wj-2RDtK_image.png) ### 1º- Passo: create Assim ficará a `Parametrização` do nosso primeiro passo: ::Image[]{src="https://app.archbee.com/api/optimize/G1NTw6yAi4RDUYbsU8csp/9k9I5hQXxZEfNi0SJZhxj_image.png" size="50" width="426" height="708" position="center" darkWidth="426" darkHeight="708" showCaption="false"} As reinvidicações do token gerado estão sendo enviadas via [De/para](#) , que pegará um valor de entrada enviado no disparo do fluxo e criará um objeto para as reinvidicações do token. E assim ficou nosso de/para: ::Image[]{src="https://app.archbee.com/api/optimize/G1NTw6yAi4RDUYbsU8csp/4mHTFe4hV1S60ii_ZRNIE_image.png" size="50" width="247" height="94" position="center" darkWidth="247" darkHeight="94" showCaption="false"} Na aba `Propriedades` informamos o nome do passo: ::Image[]{src="https://app.archbee.com/api/optimize/G1NTw6yAi4RDUYbsU8csp/8-uagScbRlQuh3hsv5gP3_image.png" size="50" width="426" height="442" position="center" darkWidth="426" darkHeight="442" showCaption="false"} ### 2º- Passo: decode-claims Assim ficará a `Parametrização` nosso segundo passo: ::Image[]{src="https://app.archbee.com/api/optimize/G1NTw6yAi4RDUYbsU8csp/lJT2G6PK1h5N42P5b7qsg_image.png" size="50" width="422" height="612" position="center" darkWidth="422" darkHeight="612" showCaption="false"} Utilizamos uma função do [Fluid Expression Language](#) para buscar o valor do token criado no primeiro passo 'create'. Na aba `Propriedades` informamos o nome do passo: ::Image[]{src="https://app.archbee.com/api/optimize/G1NTw6yAi4RDUYbsU8csp/kVssqjg4nMzia_KsRVDu0_image.png" size="50" width="420" height="438" position="center" darkWidth="420" darkHeight="438" showCaption="false"} ### 3ºPasso: decode-header Assim ficará a `Parametrização` nosso terceiro passo: ::Image[]{src="https://app.archbee.com/api/optimize/G1NTw6yAi4RDUYbsU8csp/pNU9SkCj81bFP7Y8VDfBJ_image.png" size="50" width="423" height="614" position="center" darkWidth="423" darkHeight="614" showCaption="false"} Utilizamos uma função do [Fluid Expression Language](#) para buscar o valor do token criado no primeiro passo 'create'. Na aba `Propriedades` informamos o nome do passo: ::Image[]{src="https://app.archbee.com/api/optimize/G1NTw6yAi4RDUYbsU8csp/_R-J2CPpX4HLudspL6GRf_image.png" size="50" width="420" height="441" position="center" darkWidth="420" darkHeight="441" showCaption="false"} ### 4º - Passo: validate Assim ficará a `Parametrização` nosso quarto e ultimo passo: ::Image[]{src="https://app.archbee.com/api/optimize/G1NTw6yAi4RDUYbsU8csp/PeqcUVr0oZrESqiy-EzGX_image.png" size="50" width="424" height="593" position="center" darkWidth="424" darkHeight="593" showCaption="false"} Utilizamos uma função do [Fluid Expression Language](#) para buscar o valor do token criado no primeiro passo 'create'. Na aba `Propriedades` informamos o nome do passo: ::Image[]{src="https://app.archbee.com/api/optimize/G1NTw6yAi4RDUYbsU8csp/bFqUzp1M06tmHdwBg206d_image.png" size="50" width="422" height="443" position="center" darkWidth="422" darkHeight="443" showCaption="false"} ### Disparando o Fluxo Com os passos configurados, basta disparar o fluxo enviando o payload com o campo esperado no [De/para](#) do primeiro passo: ![](https://app.archbee.com/api/optimize/G1NTw6yAi4RDUYbsU8csp/h_JWyro0Gpy6LVJv_W-D9_image.png) Após o disparo, o resultado do fluxo será apresentado em tempo real no canvas: ![](https://app.archbee.com/api/optimize/G1NTw6yAi4RDUYbsU8csp/7-D1gb8lT3Z2nGo3Vmga9_image.png) **Detalhes passo create** ![](https://app.archbee.com/api/optimize/G1NTw6yAi4RDUYbsU8csp/rTu_erVTKrlFZsIg4eGnS_image.png) **Detalhes passo decode-claims** ![](https://app.archbee.com/api/optimize/G1NTw6yAi4RDUYbsU8csp/3d-5Tb0L9H2YjhuRF6AJ3_image.png) **Detalhes passo decode-header** ![](https://app.archbee.com/api/optimize/G1NTw6yAi4RDUYbsU8csp/lpQfRtCDpQZJIQC8kjDxA_image.png) **Detalhes passo validate** ![](https://app.archbee.com/api/optimize/G1NTw6yAi4RDUYbsU8csp/R4OuIvM-dDhKxbymlKqHL_image.png) **Verificando o token criado no **[jwt.io](https://jwt.io/) ![](https://app.archbee.com/api/optimize/G1NTw6yAi4RDUYbsU8csp/YTXovrHANccImTM1hIZ_O_image.png)