"use strict"; const {Fragment: _Fragment, jsx: _jsx, jsxs: _jsxs} = arguments[0]; const {useMDXComponents: _provideComponents} = arguments[0]; const headings = [{ "data": { "id": "introdução", "hProperties": { "id": "introdução" } }, "depth": 2, "value": "Introdução" }, { "data": { "id": "oauth-20-vs-openid-connect", "hProperties": { "id": "oauth-20-vs-openid-connect" } }, "depth": 2, "value": "OAuth 2.0 vs. OpenID Connect" }, { "data": { "id": "oauth-20", "hProperties": { "id": "oauth-20" } }, "depth": 3, "value": "OAuth 2.0" }, { "data": { "id": "openid-connect-oidc", "hProperties": { "id": "openid-connect-oidc" } }, "depth": 3, "value": "OpenID Connect (OIDC)" }, { "data": { "id": "tipos-de-aplicativos", "hProperties": { "id": "tipos-de-aplicativos" } }, "depth": 2, "value": "Tipos de aplicativos" }, { "data": { "id": "aplicativos-web-rodando-em-um-servidor", "hProperties": { "id": "aplicativos-web-rodando-em-um-servidor" } }, "depth": 3, "value": "Aplicativos web rodando em um servidor" }, { "data": { "id": "aplicativos-de-página-única-spas", "hProperties": { "id": "aplicativos-de-página-única-spas" } }, "depth": 3, "value": "Aplicativos de página única (SPAs)" }, { "data": { "id": "aplicativos-móveis", "hProperties": { "id": "aplicativos-móveis" } }, "depth": 3, "value": "Aplicativos móveis" }, { "data": { "id": "aplicativos-de-máquina-a-máquina-m2m", "hProperties": { "id": "aplicativos-de-máquina-a-máquina-m2m" } }, "depth": 3, "value": "Aplicativos de máquina a máquina (M2M)" }, { "data": { "id": "aplicativos-rodando-em-dispositivos-iot", "hProperties": { "id": "aplicativos-rodando-em-dispositivos-iot" } }, "depth": 3, "value": "Aplicativos rodando em dispositivos IoT" }, { "data": { "id": "proteja-sua-api", "hProperties": { "id": "proteja-sua-api" } }, "depth": 2, "value": "Proteja sua API" }, { "data": { "id": "design-de-autorização", "hProperties": { "id": "design-de-autorização" } }, "depth": 3, "value": "Design de autorização" }, { "data": { "id": "tokens-de-acesso", "hProperties": { "id": "tokens-de-acesso" } }, "depth": 3, "value": "Tokens de acesso" }, { "data": { "id": "indicadores-de-recursos", "hProperties": { "id": "indicadores-de-recursos" } }, "depth": 3, "value": "Indicadores de recursos" }, { "data": { "id": "juntando-tudo", "hProperties": { "id": "juntando-tudo" } }, "depth": 2, "value": "Juntando tudo" }, { "data": { "id": "notas-finais", "hProperties": { "id": "notas-finais" } }, "depth": 2, "value": "Notas finais" }]; const readingTime = { "minutes": 13, "words": 3865, "text": "13 min read" }; const frontmatter = undefined; function _createMdxContent(props) { const _components = { a: "a", blockquote: "blockquote", code: "code", h2: "h2", h3: "h3", li: "li", ol: "ol", p: "p", pre: "pre", span: "span", strong: "strong", ul: "ul", ..._provideComponents(), ...props.components }, {LogtoCloudButton} = _components; if (!LogtoCloudButton) _missingMdxReference("LogtoCloudButton", true); return _jsxs(_Fragment, { children: [_jsxs(_components.h2, { id: "introdução", children: ["Introdução", _jsx(_components.a, { "aria-hidden": "true", tabIndex: "-1", href: "#introdução", children: _jsx(_components.span, { children: "#" }) })] }), "\n", _jsx(_components.p, { children: "Aplicativos baseados em nuvem são a tendência hoje em dia. Embora o tipo de aplicativo varie (web, mobile, desktop, etc.), todos eles têm um backend em nuvem que fornece serviços como armazenamento, computação e bancos de dados. Na maioria das vezes, esses aplicativos precisam autenticar usuários e autorizá-los a acessar certos recursos." }), "\n", _jsx(_components.p, { children: "Embora seja possível criar mecanismos caseiros de autenticação e autorização, a segurança tornou-se uma das principais preocupações ao desenvolver aplicativos em nuvem. Felizmente, nossa indústria possui padrões testados em batalhas como OAuth 2.0 e OpenID Connect para nos ajudar a implementar autenticação e autorização seguras." }), "\n", _jsx(_components.p, { children: "Este post tem as seguintes suposições:" }), "\n", _jsxs(_components.ol, { children: ["\n", _jsx(_components.li, { children: "Você tem uma compreensão básica do desenvolvimento de aplicativos (web, mobile, ou qualquer outro tipo)." }), "\n", _jsx(_components.li, { children: "Você já ouviu falar dos conceitos de autenticação e autorização." }), "\n", _jsxs(_components.li, { children: ["Você já ouviu falar sobre ", _jsx(_components.a, { href: "https://auth.wiki/oauth-2.0", children: "OAuth 2.0" }), " e ", _jsx(_components.a, { href: "https://auth.wiki/openid-connect", children: "OpenID Connect" }), "."] }), "\n"] }), "\n", _jsx(_components.p, { children: "Sim, \"ouvir falar\" é suficiente para os itens 2 e 3. Este post usará exemplos do mundo real para explicar conceitos e ilustrar o processo com diagramas. Vamos começar!" }), "\n", _jsxs(_components.h2, { id: "oauth-20-vs-openid-connect", children: ["OAuth 2.0 vs. OpenID Connect", _jsx(_components.a, { "aria-hidden": "true", tabIndex: "-1", href: "#oauth-20-vs-openid-connect", children: _jsx(_components.span, { children: "#" }) })] }), "\n", _jsx(_components.p, { children: "Se você está familiarizado com OAuth 2.0 e OpenID Connect, também pode continuar lendo porque abordaremos alguns exemplos do mundo real nesta seção; se você é novo nesses padrões, também é seguro continuar, pois vamos apresentá-los de maneira simples." }), "\n", _jsxs(_components.h3, { id: "oauth-20", children: ["OAuth 2.0", _jsx(_components.a, { "aria-hidden": "true", tabIndex: "-1", href: "#oauth-20", children: _jsx(_components.span, { children: "#" }) })] }), "\n", _jsxs(_components.p, { children: [_jsx(_components.a, { href: "https://auth.wiki/oauth-2.0", children: "OAuth 2.0" }), " é uma estrutura de autorização que permite a um aplicativo obter acesso limitado a recursos protegidos em outro aplicativo em nome de um usuário ou do próprio aplicativo. A maioria dos serviços populares como Google, Facebook e GitHub usam OAuth 2.0 para login social (por exemplo, \"Entrar com Google\")."] }), "\n", _jsx(_components.p, { children: "Por exemplo, você tem um aplicativo web MyApp que deseja acessar o Google Drive do usuário. Em vez de pedir ao usuário para compartilhar suas credenciais do Google Drive, MyApp pode usar OAuth 2.0 para solicitar acesso ao Google Drive em nome do usuário. Aqui está um fluxo simplificado:" }), "\n", _jsx(_components.pre, { children: _jsx(_components.code, { className: "language-mermaid", children: "sequenceDiagram\n participant User\n participant MyApp\n participant Google\n\n User->>MyApp: Abrir MyApp e
clicar em \"Conectar Google Drive\"\n MyApp->>Google: Redirecionar para Google\n Google->>User: Entrar no Google\n User->>Google: Entrar\n Google->>User: Pedir permissão
para acessar o Google Drive\n User->>Google: Conceder acesso ao MyApp\n Google->>MyApp: Redirecionar para MyApp
com dados de autorização (por exemplo, token de acesso)\n MyApp->>Google: Acessar o Google Drive do usuário\n" }) }), "\n", _jsxs(_components.p, { children: ["Neste fluxo, MyApp nunca vê as credenciais do Google Drive do usuário. Em vez disso, recebe um ", _jsx(_components.a, { href: "https://auth.wiki/access-token", children: "token de acesso" }), " do Google que permite acessar o Google Drive em nome do usuário."] }), "\n", _jsxs(_components.p, { children: ["Em termos de OAuth 2.0, MyApp é o ", _jsx(_components.a, { href: "https://auth.wiki/client", children: "cliente" }), ", Google é tanto o ", _jsx(_components.a, { href: "https://auth.wiki/authorization-server", children: "servidor de autorização" }), " quanto o ", _jsx(_components.a, { href: "https://auth.wiki/resource-server", children: "servidor de recursos" }), " por simplicidade. No mundo real, geralmente temos servidores de autorização e de recursos separados para oferecer uma experiência de single sign-on (SSO). Por exemplo, o Google é o servidor de autorização e pode ter vários servidores de recursos como Google Drive, Gmail e YouTube."] }), "\n", _jsx(_components.p, { children: "Observe que o fluxo de autorização real é mais complexo do que isso. OAuth 2.0 possui diferentes tipos de concessão, escopos e outros conceitos que você deve estar ciente. Vamos deixar isso de lado por enquanto e seguir para o OpenID Connect." }), "\n", _jsxs(_components.h3, { id: "openid-connect-oidc", children: ["OpenID Connect (OIDC)", _jsx(_components.a, { "aria-hidden": "true", tabIndex: "-1", href: "#openid-connect-oidc", children: _jsx(_components.span, { children: "#" }) })] }), "\n", _jsxs(_components.p, { children: ["OAuth 2.0 é ótimo para autorização, mas você pode notar que ele não tem uma maneira de identificar o usuário (ou seja, autenticação). ", _jsx(_components.a, { href: "https://auth.wiki/openid-connect", children: "OpenID Connect" }), " é uma camada de identidade sobre o OAuth 2.0 que adiciona capacidades de autenticação."] }), "\n", _jsx(_components.p, { children: "No exemplo acima, MyApp precisa saber quem é o usuário antes de iniciar o fluxo de autorização. Observe que há dois usuários envolvidos aqui: o usuário do MyApp e o usuário do Google Drive. Neste caso, MyApp precisa conhecer o usuário do próprio aplicativo." }), "\n", _jsx(_components.p, { children: "Vamos ver um exemplo direto, assumindo que os usuários podem entrar no MyApp usando nome de usuário e senha:" }), "\n", _jsx(_components.pre, { children: _jsx(_components.code, { className: "language-mermaid", children: "sequenceDiagram\n participant User\n participant MyApp\n participant IdP as Provedor de Identidade (IdP)\n\n User->>MyApp: Abrir MyApp e
clicar em \"Entrar\"\n MyApp->>IdP: Redirecionar para IdP\n IdP->>User: Pedir nome de usuário e senha\n User->>IdP: Inserir nome de usuário e senha\n IdP->>IdP: Autenticar usuário\n IdP->>MyApp: Redirecionar para MyApp
com dados de autenticação e
autorização (por exemplo, ID token)\n MyApp->>User: Exibir perfil do usuário
(via ID token ou endpoint userinfo)\n" }) }), "\n", _jsxs(_components.p, { children: ["Como estamos autenticando o usuário do nosso próprio aplicativo, normalmente não há necessidade de pedir permissão como o Google fez no fluxo do OAuth 2.0. Enquanto isso, precisamos de algo que possa identificar o usuário. OpenID Connect introduz os conceitos como ", _jsx(_components.strong, { children: "ID token" }), " e ", _jsx(_components.strong, { children: "endpoint userinfo" }), " para nos ajudar com isso."] }), "\n", _jsxs(_components.blockquote, { children: ["\n", _jsxs(_components.p, { children: ["Você pode notar que o ", _jsx(_components.strong, { children: _jsx(_components.a, { href: "https://auth.wiki/identity-provider", children: "provedor de identidade (IdP)" }) }), " é um novo participante autônomo no fluxo. É o mesmo que o ", _jsx(_components.strong, { children: "servidor de autorização" }), " no OAuth 2.0, mas para maior clareza, usamos o termo IdP para mostrar que ele é responsável por autenticação de usuário e gerenciamento de identidade."] }), "\n"] }), "\n", _jsx(_components.p, { children: "Quando seu negócio cresce, você pode ter vários aplicativos que compartilham o mesmo banco de dados de usuários. Assim como o OAuth 2.0, o OpenID Connect permite que você tenha um único servidor de autorização que pode autenticar usuários para vários aplicativos. Se o usuário já está logado em um aplicativo, não precisa digitar suas credenciais novamente quando outro aplicativo redirecioná-lo para o IdP. O fluxo pode ser feito automaticamente sem interação do usuário. Isso é chamado single sign-on (SSO)." }), "\n", _jsx(_components.p, { children: "Novamente, este é um fluxo altamente simplificado e há mais detalhes sob o capô. Por enquanto, vamos seguir para a próxima seção para evitar sobrecarga de informação." }), "\n", _jsxs(_components.h2, { id: "tipos-de-aplicativos", children: ["Tipos de aplicativos", _jsx(_components.a, { "aria-hidden": "true", tabIndex: "-1", href: "#tipos-de-aplicativos", children: _jsx(_components.span, { children: "#" }) })] }), "\n", _jsxs(_components.p, { children: ["Na seção anterior, usamos aplicativos web como exemplos, enquanto o mundo é mais diverso do que isso. Para um provedor de identidade, a linguagem de programação exata, estrutura ou plataforma que você usa não importa muito. Na prática, uma diferença notável é se o aplicativo é um ", _jsx(_components.a, { href: "https://auth.wiki/client#public-clients", children: "cliente público" }), " ou um ", _jsx(_components.a, { href: "https://auth.wiki/client#private-clients", children: "cliente privado (confiável)" }), ":"] }), "\n", _jsxs(_components.ul, { children: ["\n", _jsxs(_components.li, { children: [_jsx(_components.strong, { children: "Cliente público" }), ": Um cliente que não pode manter suas credenciais confidenciais, o que significa que o proprietário do recurso (usuário) pode acessá-las. Por exemplo, um aplicativo web rodando em um navegador (por exemplo, single-page application)."] }), "\n", _jsxs(_components.li, { children: [_jsx(_components.strong, { children: "Cliente privado" }), ": Um cliente que tem a capacidade de manter suas credenciais confidenciais sem expô-las aos (proprietários de recursos) usuários. Por exemplo, um aplicativo web rodando em um servidor (por exemplo, aplicativo web do lado do servidor) ou um serviço API."] }), "\n"] }), "\n", _jsx(_components.p, { children: "Com isso em mente, vamos ver como OAuth 2.0 e OpenID Connect podem ser usados em diferentes tipos de aplicativos." }), "\n", _jsxs(_components.blockquote, { children: ["\n", _jsx(_components.p, { children: "\"Aplicativo\" e \"cliente\" podem ser usados de forma intercambiável no contexto deste post." }), "\n"] }), "\n", _jsxs(_components.h3, { id: "aplicativos-web-rodando-em-um-servidor", children: ["Aplicativos web rodando em um servidor", _jsx(_components.a, { "aria-hidden": "true", tabIndex: "-1", href: "#aplicativos-web-rodando-em-um-servidor", children: _jsx(_components.span, { children: "#" }) })] }), "\n", _jsx(_components.p, { children: "O aplicativo roda em um servidor e serve páginas HTML para os usuários. Muitas estruturas web populares como Express.js, Django e Ruby on Rails se enquadram nesta categoria; e estruturas backend-for-frontend (BFF) como Next.js e Nuxt.js também estão incluídas. Esses aplicativos possuem as seguintes características:" }), "\n", _jsxs(_components.ol, { children: ["\n", _jsx(_components.li, { children: "Como um servidor apenas permite acesso privado (não há como usuários públicos verem o código do servidor ou as credenciais), ele é considerado um cliente privado." }), "\n", _jsx(_components.li, { children: "O fluxo geral de autenticação do usuário é o mesmo que discutimos na seção \"OpenID Connect\"." }), "\n", _jsx(_components.li, { children: "O aplicativo pode usar o ID token emitido pelo provedor de identidade (ou seja, o provedor OpenID Connect) para identificar o usuário e exibir conteúdo específico do usuário." }), "\n", _jsxs(_components.li, { children: ["Para manter o aplicativo seguro, geralmente ele usa o ", _jsx(_components.strong, { children: "fluxo de código de autorização" }), " para a autenticação do usuário e para obter tokens."] }), "\n"] }), "\n", _jsx(_components.p, { children: "Enquanto isso, o aplicativo pode precisar acessar outros serviços de API internos em uma arquitetura de microsserviços; ou é um aplicativo monolítico que precisa de controle de acesso para diferentes partes do aplicativo. Vamos discutir isso na seção \"Proteja sua API\"." }), "\n", _jsxs(_components.h3, { id: "aplicativos-de-página-única-spas", children: ["Aplicativos de página única (SPAs)", _jsx(_components.a, { "aria-hidden": "true", tabIndex: "-1", href: "#aplicativos-de-página-única-spas", children: _jsx(_components.span, { children: "#" }) })] }), "\n", _jsx(_components.p, { children: "O aplicativo roda no navegador de um usuário e se comunica com o servidor via APIs. React, Angular e Vue.js são estruturas populares para construir SPAs. Esses aplicativos possuem as seguintes características:" }), "\n", _jsxs(_components.ol, { children: ["\n", _jsx(_components.li, { children: "Como o código do aplicativo é visível para o público, ele é considerado um cliente público." }), "\n", _jsx(_components.li, { children: "O fluxo geral de autenticação do usuário é o mesmo que discutimos na seção \"OpenID Connect\"." }), "\n", _jsx(_components.li, { children: "O aplicativo pode usar o ID token emitido pelo provedor de identidade (ou seja, o provedor OpenID Connect) para identificar o usuário e exibir conteúdo específico do usuário." }), "\n", _jsxs(_components.li, { children: ["Para manter o aplicativo seguro, geralmente ele usa o ", _jsx(_components.strong, { children: "fluxo de código de autorização com PKCE (Prova de Chave para Troca de Código)" }), " para a autenticação do usuário e para obter tokens."] }), "\n"] }), "\n", _jsx(_components.p, { children: "Geralmente, SPAs precisam acessar outros serviços de API para busca e atualização de dados. Vamos discutir isso na seção \"Proteja sua API\"." }), "\n", _jsxs(_components.h3, { id: "aplicativos-móveis", children: ["Aplicativos móveis", _jsx(_components.a, { "aria-hidden": "true", tabIndex: "-1", href: "#aplicativos-móveis", children: _jsx(_components.span, { children: "#" }) })] }), "\n", _jsx(_components.p, { children: "O aplicativo roda em um dispositivo móvel (iOS, Android, etc.) e se comunica com o servidor via APIs. Na maioria dos casos, esses aplicativos têm as mesmas características que SPAs." }), "\n", _jsxs(_components.h3, { id: "aplicativos-de-máquina-a-máquina-m2m", children: ["Aplicativos de máquina a máquina (M2M)", _jsx(_components.a, { "aria-hidden": "true", tabIndex: "-1", href: "#aplicativos-de-máquina-a-máquina-m2m", children: _jsx(_components.span, { children: "#" }) })] }), "\n", _jsxs(_components.p, { children: ["Aplicações ", _jsx(_components.a, { href: "https://auth.wiki/machine-to-machine", children: "máquina a máquina" }), " são ", _jsx(_components.a, { href: "https://auth.wiki/client", children: "clientes" }), " que rodam em um servidor (máquina) e se comunicam com outros servidores. Esses aplicativos possuem as seguintes características:"] }), "\n", _jsxs(_components.ol, { children: ["\n", _jsx(_components.li, { children: "Como aplicativos web rodando em um servidor, aplicativos M2M são clientes privados." }), "\n", _jsx(_components.li, { children: "O aplicativo pode não precisar identificar o usuário; em vez disso, precisa autenticar a si mesmo para acessar outros serviços." }), "\n", _jsx(_components.li, { children: "O aplicativo pode usar o token de acesso emitido pelo provedor de identidade (ou seja, o provedor OAuth 2.0) para acessar outros serviços." }), "\n", _jsxs(_components.li, { children: ["Para manter o aplicativo seguro, normalmente ele usa o ", _jsx(_components.strong, { children: "fluxo de credenciais do cliente" }), " para obter tokens de acesso."] }), "\n"] }), "\n", _jsx(_components.p, { children: "Ao acessar outros serviços, o aplicativo pode precisar fornecer o token de acesso no cabeçalho da solicitação. Vamos discutir isso na seção \"Proteja sua API\"." }), "\n", _jsxs(_components.h3, { id: "aplicativos-rodando-em-dispositivos-iot", children: ["Aplicativos rodando em dispositivos IoT", _jsx(_components.a, { "aria-hidden": "true", tabIndex: "-1", href: "#aplicativos-rodando-em-dispositivos-iot", children: _jsx(_components.span, { children: "#" }) })] }), "\n", _jsx(_components.p, { children: "O aplicativo roda em um dispositivo IoT (por exemplo, dispositivos domésticos inteligentes, wearables, etc.) e se comunica com o servidor via APIs. Esses aplicativos possuem as seguintes características:" }), "\n", _jsxs(_components.ol, { children: ["\n", _jsx(_components.li, { children: "Dependendo da capacidade do dispositivo, ele pode ser um cliente público ou privado." }), "\n", _jsx(_components.li, { children: "O fluxo geral de autenticação pode ser diferente do que discutimos na seção \"OpenID Connect\" de acordo com a capacidade do dispositivo. Por exemplo, alguns dispositivos podem não ter uma tela para os usuários inserirem suas credenciais." }), "\n", _jsx(_components.li, { children: "Se o dispositivo não precisar identificar o usuário, pode não precisar usar tokens de ID ou endpoints userinfo; em vez disso, pode ser tratado como um aplicativo máquina a máquina (M2M)." }), "\n", _jsxs(_components.li, { children: ["Para manter o aplicativo seguro, ele pode usar o ", _jsx(_components.strong, { children: "fluxo de código de autorização com PKCE (Prova de Chave para Troca de Código)" }), " para autenticação de usuário e obter tokens ou o ", _jsx(_components.strong, { children: "fluxo de credenciais do cliente" }), " para obter tokens de acesso."] }), "\n"] }), "\n", _jsx(_components.p, { children: "Ao se comunicar com o servidor, o dispositivo pode precisar fornecer o token de acesso no cabeçalho da solicitação. Vamos discutir isso na seção \"Proteja sua API\"." }), "\n", _jsxs(_components.h2, { id: "proteja-sua-api", children: ["Proteja sua API", _jsx(_components.a, { "aria-hidden": "true", tabIndex: "-1", href: "#proteja-sua-api", children: _jsx(_components.span, { children: "#" }) })] }), "\n", _jsxs(_components.p, { children: ["Com OpenID Connect, é possível identificar o usuário e buscar dados específicos do usuário via ", _jsx(_components.a, { href: "https://auth.wiki/id-token", children: "tokens de ID" }), " ou ", _jsx(_components.a, { href: "https://auth.wiki/userinfo-endpoint", children: "endpoints userinfo" }), ". Esse processo é chamado de autenticação. Mas você provavelmente não quer expor todos os seus recursos a todos os usuários autenticados, por exemplo, apenas administradores podem acessar a página de gestão de usuários."] }), "\n", _jsx(_components.p, { children: "É aqui que a autorização entra em ação. Lembre-se que OAuth 2.0 é uma estrutura de autorização, e OpenID Connect é uma camada de identidade sobre o OAuth 2.0; o que significa que você também pode usar OAuth 2.0 quando OpenID Connect já está em funcionamento." }), "\n", _jsxs(_components.p, { children: ["Vamos lembrar o exemplo que usamos na seção \"OAuth 2.0\": MyApp deseja acessar o Google Drive do usuário. Não é prático permitir que o MyApp acesse todos os arquivos do usuário no Google Drive. Em vez disso, o MyApp deve reivindicar explicitamente o que deseja acessar (por exemplo, acesso somente leitura a arquivos em uma pasta específica). Em termos de OAuth 2.0, isso é chamado de ", _jsx(_components.strong, { children: "escopo" }), "."] }), "\n", _jsxs(_components.blockquote, { children: ["\n", _jsx(_components.p, { children: "Você pode ver o termo \"permissão\" usado de forma intercambiável com \"escopo\" no contexto do OAuth 2.0, já que às vezes \"escopo\" é ambíguo para usuários não técnicos." }), "\n"] }), "\n", _jsx(_components.p, { children: "Quando o usuário concede acesso ao MyApp, o servidor de autorização emite um token de acesso com o escopo solicitado. O token de acesso é então enviado ao servidor de recursos (Google Drive) para acessar os arquivos do usuário." }), "\n", _jsx(_components.pre, { children: _jsx(_components.code, { className: "language-mermaid", children: "sequenceDiagram\n participant User\n participant MyApp\n participant Google\n\n User->>MyApp: Abrir MyApp e
clicar em \"Conectar Google Drive\"\n MyApp->>Google: Redirecionar para Google\n Google->>User: MyApp deseja acessar seu
Google Drive com escopo \"somente leitura\"\n User->>Google: Ok, conceder acesso ao MyApp\n Google->>MyApp: Redirecionar para MyApp
com dados de autorização (por exemplo, token de acesso)\n MyApp->>Google: Acessar o Google Drive do usuário
com token de acesso e escopo\n" }) }), "\n", _jsx(_components.p, { children: "Naturalmente, podemos substituir o Google Drive pelos nossos próprios serviços de API. Por exemplo, MyApp precisa acessar o OrderService para buscar o histórico de pedidos do usuário. Desta vez, como a autenticação do usuário já é feita pelo provedor de identidade e ambos, MyApp e OrderService, estão sob nosso controle, podemos pular a etapa de pedir ao usuário para conceder acesso; MyApp pode enviar diretamente a solicitação ao OrderService com o token de acesso emitido pelo provedor de identidade." }), "\n", _jsx(_components.pre, { children: _jsx(_components.code, { className: "language-mermaid", children: "sequenceDiagram\n participant User\n participant MyApp\n participant OrderService\n\n User->>MyApp: Abrir histórico de pedidos\n MyApp->>OrderService: Buscar meu histórico de pedidos (com token de acesso)\n OrderService->>MyApp: Retornar histórico de pedidos\n MyApp->>User: Exibir histórico de pedidos\n" }) }), "\n", _jsxs(_components.p, { children: ["O token de acesso pode conter um escopo ", _jsx(_components.code, { children: "read:order" }), " para indicar que o usuário pode ler seu histórico de pedidos."] }), "\n", _jsxs(_components.p, { children: ["Agora, digamos que o usuário insere acidentalmente uma URL de página de administrador no navegador. Como o usuário não é um administrador, não há escopo ", _jsx(_components.code, { children: "admin" }), " no token de acesso. O OrderService rejeitará a solicitação e retornará uma mensagem de erro."] }), "\n", _jsx(_components.pre, { children: _jsx(_components.code, { className: "language-mermaid", children: "sequenceDiagram\n participant User\n participant MyApp\n participant OrderService\n\n User->>MyApp: Abrir página de administração\n MyApp->>OrderService: Buscar página de administração (com token de acesso)\n OrderService->>MyApp: Erro: Acesso negado\n MyApp->>User: Exibir mensagem de erro\n" }) }), "\n", _jsx(_components.p, { children: "Nesse caso, o OrderService pode retornar um código de status 403 Forbidden para indicar que o usuário não está autorizado a acessar a página de administração." }), "\n", _jsx(_components.p, { children: "Para aplicativos máquina a máquina (M2M), nenhum usuário está envolvido no processo. Aplicativos podem solicitar diretamente tokens de acesso ao provedor de identidade e usá-los para acessar outros serviços. O mesmo conceito se aplica: o token de acesso contém os escopos necessários para acessar os recursos." }), "\n", _jsx(_components.pre, { children: _jsx(_components.code, { className: "language-mermaid", children: "sequenceDiagram\n participant MyApp\n participant OrderService\n\n MyApp->>OrderService: Buscar todos os pedidos (com token de acesso)\n OrderService->>MyApp: Retornar todos os pedidos\n" }) }), "\n", _jsxs(_components.h3, { id: "design-de-autorização", children: ["Design de autorização", _jsx(_components.a, { "aria-hidden": "true", tabIndex: "-1", href: "#design-de-autorização", children: _jsx(_components.span, { children: "#" }) })] }), "\n", _jsxs(_components.p, { children: ["Podemos ver duas coisas importantes a considerar ao projetar ", _jsx(_components.a, { href: "https://auth.wiki/authorization", children: "autorização" }), " para proteger seus serviços de API:"] }), "\n", _jsxs(_components.ol, { children: ["\n", _jsxs(_components.li, { children: [_jsx(_components.strong, { children: "Escopos" }), ": Defina o que o cliente pode acessar. Escopos podem ser detalhados (por exemplo, ", _jsx(_components.code, { children: "read:order" }), ", ", _jsx(_components.code, { children: "write:order" }), ") ou mais gerais (por exemplo, ", _jsx(_components.code, { children: "order" }), ") dependendo de seus requisitos."] }), "\n", _jsxs(_components.li, { children: [_jsx(_components.strong, { children: "Controle de acesso" }), ": Defina quem pode ter escopos específicos. Por exemplo, apenas administradores podem ter o escopo ", _jsx(_components.code, { children: "admin" }), "."] }), "\n"] }), "\n", _jsxs(_components.p, { children: ["Sobre ", _jsx(_components.a, { href: "https://auth.wiki/access-control", children: "controle de acesso" }), ", algumas abordagens populares são:"] }), "\n", _jsxs(_components.ul, { children: ["\n", _jsxs(_components.li, { children: [_jsx(_components.strong, { children: "Controle de acesso baseado em papéis (RBAC)" }), ": Atribuir papéis aos usuários e definir quais papéis podem acessar quais recursos. Por exemplo, um papel de administrador pode acessar a página de administração."] }), "\n", _jsxs(_components.li, { children: [_jsx(_components.strong, { children: "Controle de acesso baseado em atributos (ABAC)" }), ": Definir políticas com base em atributos (por exemplo, departamento do usuário, localização, etc.) e tomar decisões de controle de acesso com base nesses atributos. Por exemplo, um usuário do departamento \"Engenharia\" pode acessar a página de engenharia."] }), "\n"] }), "\n", _jsx(_components.p, { children: "Vale mencionar que para ambas as abordagens, a maneira padrão de verificar o controle de acesso é verificar os escopos dos tokens de acesso, em vez de papéis ou atributos. Papéis e atributos podem ser muito dinâmicos, e escopos são mais estáticos, o que torna muito mais fácil gerenciar." }), "\n", _jsxs(_components.p, { children: ["Para informações detalhadas sobre controle de acesso, você pode se referir a ", _jsx(_components.a, { href: "https://blog.logto.io/rbac-and-abac", children: "RBAC e ABAC: Os modelos de controle de acesso que você deve conhecer" }), "."] }), "\n", _jsxs(_components.h3, { id: "tokens-de-acesso", children: ["Tokens de acesso", _jsx(_components.a, { "aria-hidden": "true", tabIndex: "-1", href: "#tokens-de-acesso", children: _jsx(_components.span, { children: "#" }) })] }), "\n", _jsxs(_components.p, { children: ["Embora tenhamos mencionado o termo \"", _jsx(_components.a, { href: "https://auth.wiki/access-token", children: "token de acesso" }), "\" muitas vezes, ainda não discutimos como obter um. No OAuth 2.0, um token de acesso é emitido pelo servidor de autorização (provedor de identidade) após um fluxo de autorização bem-sucedido."] }), "\n", _jsx(_components.p, { children: "Vamos dar uma olhada mais de perto no exemplo do Google Drive e assumir que estamos usando o fluxo de código de autorização:" }), "\n", _jsx(_components.pre, { children: _jsx(_components.code, { className: "language-mermaid", children: "sequenceDiagram\n autonumber\n participant User\n participant MyApp\n participant Google\n\n User->>MyApp: Abrir MyApp e
clicar em \"Conectar Google Drive\"\n MyApp->>Google: Redirecionar para Google\n Google->>User: Entrar no Google\n User->>Google: Entrar\n Google->>User: Pedir permissão
para acessar o Google Drive\n User->>Google: Conceder acesso ao MyApp\n Google->>MyApp: Redirecionar para MyApp
com dados de autorização (por exemplo, código de autorização)\n MyApp->>Google: Usar código de autorização para
trocar por token de acesso\n Google->>MyApp: Retornar token de acesso\n MyApp->>Google: Acessar o Google Drive do usuário com token de acesso\n" }) }), "\n", _jsx(_components.p, { children: "Há algumas etapas importantes no fluxo para a emissão de tokens de acesso:" }), "\n", _jsxs(_components.ul, { children: ["\n", _jsxs(_components.li, { children: ["Etapa 2 (Redirecionar para Google): MyApp redireciona o usuário para o Google com uma ", _jsx(_components.strong, { children: "solicitação de autorização" }), ". Normalmente, essa solicitação inclui as seguintes informações:", "\n", _jsxs(_components.ul, { children: ["\n", _jsx(_components.li, { children: "Qual cliente (MyApp) está iniciando a solicitação" }), "\n", _jsx(_components.li, { children: "Quais escopos MyApp está solicitando" }), "\n", _jsx(_components.li, { children: "Para onde o Google deve redirecionar o usuário após a autorização ser concluída" }), "\n"] }), "\n"] }), "\n", _jsxs(_components.li, { children: ["Etapa 5 (Pedir permissão para acessar o Google Drive): O Google pede para o usuário conceder acesso ao MyApp. O usuário pode escolher conceder ou negar acesso. Essa etapa é chamada de ", _jsx(_components.strong, { children: "consentimento" }), "."] }), "\n", _jsxs(_components.li, { children: ["Etapa 7 (Redirecionar para MyApp com dados de autorização): Esta etapa é nova no diagrama. Em vez de retornar o token de acesso diretamente, o Google retorna um ", _jsx(_components.strong, { children: "código de autorização" }), " de uso único ao MyApp para uma troca mais segura. Este código é usado para obter o token de acesso."] }), "\n", _jsxs(_components.li, { children: ["Etapa 8 (Usar código de autorização para trocar por token de acesso): Esta é também uma nova etapa. MyApp envia o código de autorização para o Google para trocar por um token de acesso. Como provedor de identidade, o Google comporá o contexto da solicitação e decidirá se deve emitir um token de acesso:", "\n", _jsxs(_components.ul, { children: ["\n", _jsx(_components.li, { children: "O cliente (MyApp) é quem afirma ser" }), "\n", _jsx(_components.li, { children: "O usuário concedeu acesso ao cliente" }), "\n", _jsx(_components.li, { children: "O usuário é quem afirma ser" }), "\n", _jsx(_components.li, { children: "O usuário possui os escopos necessários" }), "\n", _jsx(_components.li, { children: "O código de autorização é válido e não expirou" }), "\n"] }), "\n"] }), "\n"] }), "\n", _jsx(_components.p, { children: "O exemplo acima assume que o servidor de autorização (provedor de identidade) e o servidor de recursos são o mesmo (Google). Se eles forem separados, tomando como exemplo o MyApp e o OrderService, o fluxo será assim:" }), "\n", _jsx(_components.pre, { children: _jsx(_components.code, { className: "language-mermaid", children: "sequenceDiagram\n autonumber\n participant User\n participant MyApp\n participant IdP as Provedor de Identidade (IdP)\n participant OrderService\n\n User->>MyApp: Abrir MyApp e
clicar em \"Entrar\"\n MyApp->>IdP: Redirecionar para IdP\n IdP->>User: Pedir nome de usuário e senha\n User->>IdP: Inserir nome de usuário e senha\n IdP->>IdP: Autenticar usuário\n IdP->>MyApp: Redirecionar para MyApp
com dados de autorização (por exemplo, código de autorização)\n MyApp->>IdP: Usar código de autorização para
trocar por tokens (ID token, token de acesso)\n IdP->>MyApp: Retornar tokens\n MyApp->>OrderService: Buscar meu histórico de pedidos (com token de acesso)\n OrderService->>OrderService: Verificar token de acesso\n OrderService->>MyApp: Retornar histórico de pedidos\n" }) }), "\n", _jsx(_components.p, { children: "Neste fluxo, o servidor de autorização (IdP) emite tanto um ID token quanto um token de acesso para o MyApp (etapa 8). O ID token é usado para identificar o usuário, e o token de acesso é usado para acessar outros serviços como o OrderService. Como ambos MyApp e OrderService são serviços de primeira parte, geralmente não pedem ao usuário para conceder acesso; em vez disso, confiam no controle de acesso no provedor de identidade para determinar se o usuário pode acessar os recursos (ou seja, se o token de acesso contém os escopos necessários)." }), "\n", _jsx(_components.p, { children: "Finalmente, vamos ver como o token de acesso é usado em aplicativos máquina a máquina (M2M). Como nenhum usuário está envolvido no processo e o aplicativo é confiável, ele pode solicitar diretamente um token de acesso ao provedor de identidade:" }), "\n", _jsx(_components.pre, { children: _jsx(_components.code, { className: "language-mermaid", children: "sequenceDiagram\n autonumber\n participant MyApp\n participant IdP as Provedor de Identidade (IdP)\n participant OrderService\n\n MyApp->>IdP: Solicitar token de acesso\n IdP->>MyApp: Retornar token de acesso\n MyApp->>OrderService: Buscar todos os pedidos (com token de acesso)\n OrderService->>OrderService: Verificar token de acesso\n OrderService->>MyApp: Retornar todos os pedidos\n" }) }), "\n", _jsx(_components.p, { children: "O controle de acesso ainda pode ser aplicado aqui. Para o OrderService, não importa quem é o usuário ou qual aplicação está solicitando os dados; ele só se importa com o token de acesso e os escopos que ele contém." }), "\n", _jsxs(_components.blockquote, { children: ["\n", _jsxs(_components.p, { children: ["Tokens de acesso são geralmente codificados como JSON Web Tokens (JWT). Para saber mais sobre JWT, você pode consultar ", _jsx(_components.a, { href: "https://blog.logto.io/what-is-jwt", children: "O que é JSON Web Token (JWT)?" }), "."] }), "\n"] }), "\n", _jsxs(_components.h3, { id: "indicadores-de-recursos", children: ["Indicadores de recursos", _jsx(_components.a, { "aria-hidden": "true", tabIndex: "-1", href: "#indicadores-de-recursos", children: _jsx(_components.span, { children: "#" }) })] }), "\n", _jsx(_components.p, { children: "OAuth 2.0 introduz o conceito de escopos para controle de acesso. No entanto, você pode rapidamente perceber que os escopos não são suficientes:" }), "\n", _jsxs(_components.ul, { children: ["\n", _jsxs(_components.li, { children: ["OpenID Connect define um conjunto de escopos padrão como ", _jsx(_components.code, { children: "openid" }), ", ", _jsx(_components.code, { children: "offline_access" }), " e ", _jsx(_components.code, { children: "profile" }), ". Pode ser confuso misturar esses escopos padrão com seus escopos personalizados."] }), "\n", _jsx(_components.li, { children: "Você pode ter vários serviços de API que compartilham o mesmo nome de escopo, mas têm significados diferentes." }), "\n"] }), "\n", _jsxs(_components.p, { children: ["Uma solução comum é adicionar sufixos (ou prefixos) aos nomes dos escopos para indicar o recurso (serviço de API). Por exemplo, ", _jsx(_components.code, { children: "read:order" }), " e ", _jsx(_components.code, { children: "read:product" }), " são mais claros do que ", _jsx(_components.code, { children: "read" }), " e ", _jsx(_components.code, { children: "read" }), ". Uma extensão do OAuth 2.0 ", _jsx(_components.a, { href: "https://tools.ietf.org/html/rfc8707", children: "RFC 8707" }), " introduz um novo parâmetro ", _jsx(_components.code, { children: "resource" }), " para indicar o ", _jsx(_components.strong, { children: "servidor de recursos" }), " que o cliente deseja acessar."] }), "\n", _jsxs(_components.p, { children: ["Na realidade, os serviços de API geralmente são definidos por URLs, então é mais natural usar URLs como ", _jsx(_components.a, { href: "https://auth.wiki/resource-indicator", children: "indicadores de recurso" }), ". Por exemplo, a API do OrderService pode ser representada como:"] }), "\n", _jsx(_components.pre, { children: _jsx(_components.code, { children: "https://api.example.com/orders\n" }) }), "\n", _jsxs(_components.p, { children: ["Como você pode ver, o parâmetro traz a conveniência de usar URLs reais de recurso nas solicitações de autorização e tokens de acesso. Vale mencionar que o RFC 8707 pode não ser implementado por todos os provedores de identidade. Você deve verificar a documentação do seu provedor de identidade para ver se ele suporta o parâmetro ", _jsx(_components.code, { children: "resource" }), " (Logto suporta)."] }), "\n", _jsxs(_components.p, { children: ["Em resumo, o parâmetro ", _jsx(_components.code, { children: "resource" }), " pode ser usado em solicitações de autorização e tokens de acesso para indicar o recurso que o cliente deseja acessar."] }), "\n", _jsxs(_components.blockquote, { children: ["\n", _jsxs(_components.p, { children: ["Não há restrição sobre a acessibilidade dos indicadores de recurso, ou seja, o indicador de recurso não precisa ser uma URL real que aponta para um serviço de API. Assim, o nome \"indicador de recurso\" reflete adequadamente seu papel no processo de autorização. Você pode usar URLs virtuais para representar recursos que deseja proteger. Por exemplo, você pode definir uma URL virtual ", _jsx(_components.code, { children: "https://api.example.com/admin" }), " em sua aplicação monolítica para representar o recurso que apenas administradores podem acessar."] }), "\n"] }), "\n", _jsxs(_components.h2, { id: "juntando-tudo", children: ["Juntando tudo", _jsx(_components.a, { "aria-hidden": "true", tabIndex: "-1", href: "#juntando-tudo", children: _jsx(_components.span, { children: "#" }) })] }), "\n", _jsx(_components.p, { children: "Neste ponto, cobrimos os básicos do OAuth 2.0 e OpenID Connect, e como usá-los em diferentes tipos de aplicativos e cenários. Embora tenhamos discutido separadamente, você pode combiná-los de acordo com seus requisitos de negócios. A arquitetura geral pode ser tão simples quanto esta:" }), "\n", _jsx(_components.pre, { children: _jsx(_components.code, { className: "language-mermaid", children: "flowchart LR\n MyApp --- IdP\n" }) }), "\n", _jsx(_components.p, { children: "Ou um pouco mais complexa:" }), "\n", _jsx(_components.pre, { children: _jsx(_components.code, { className: "language-mermaid", children: "flowchart LR\n WA[Aplicação web] --- IdP[Provedor de identidade]\n MA[Aplicação móvel] --- IdP\n OS[OrderService] --- IdP\n AS[AdminService] --- IdP\n WA --- OS\n MA --- OS\n SA[Aplicação de página única] --- IdP\n SA --- AS\n OS --- AS\n" }) }), "\n", _jsx(_components.p, { children: "À medida que sua aplicação cresce, você verá que o provedor de identidade (IdP) desempenha um papel crítico na arquitetura; mas não está relacionado diretamente aos seus objetivos de negócios. Embora seja uma ótima ideia deixá-lo nas mãos de um fornecedor confiável, precisamos escolher o provedor de identidade com sabedoria. Um bom provedor de identidade pode simplificar muito o processo, reduzir o esforço de desenvolvimento e salvar você de armadilhas de segurança em potencial." }), "\n", _jsxs(_components.h2, { id: "notas-finais", children: ["Notas finais", _jsx(_components.a, { "aria-hidden": "true", tabIndex: "-1", href: "#notas-finais", children: _jsx(_components.span, { children: "#" }) })] }), "\n", _jsxs(_components.p, { children: ["Para aplicativos modernos em nuvem, o provedor de identidade (ou servidor de autorização) é o centro para ", _jsx(_components.a, { href: "https://auth.wiki/authentication", children: "autenticação" }), " de usuários, ", _jsx(_components.a, { href: "https://auth.wiki/iam", children: "gerenciamento de identidade" }), " e ", _jsx(_components.a, { href: "https://auth.wiki/access-control", children: "controle de acesso" }), ". Embora tenhamos discutido muitos conceitos neste post, ainda há muitas nuances a se considerar ao implementar um sistema assim. Se você estiver interessado em aprender mais, pode navegar em nosso blog para mais artigos aprofundados."] }), "\n", _jsx(LogtoCloudButton, {})] }); } function MDXContent(props = {}) { const {wrapper: MDXLayout} = { ..._provideComponents(), ...props.components }; return MDXLayout ? _jsx(MDXLayout, { ...props, children: _jsx(_createMdxContent, { ...props }) }) : _createMdxContent(props); } return { headings, readingTime, frontmatter, default: MDXContent }; function _missingMdxReference(id, component) { throw new Error("Expected " + (component ? "component" : "object") + " `" + id + "` to be defined: you likely forgot to import, pass, or provide it."); }