Segurança

Introdução

A presente arquitetura orienta a utilização de OIDC (OpenID Connect), em que o frontend atua como entidade Client ou Relying Party, responsável por:

• Realizar comunicação com o provedor OIDC (Identity Provider, IdP ou OP) para autenticação na forma SSO (Single Sign-On) e obtenção dos tokens de autorização de acesso e de dados do usuário.

• De posse do Access Token, consumir os recursos protegidos do backend (então Resource Server), via webservices.

• Utilizar o ID Token e User Info para personalizar a inteface gráfica, se necessário, como por exemplo configurar menus, botões e elementos da UI conforme as permissões do usuário.

• Utilizar o Refresh Token para renovar periodicamente o Access Token.

O Cloudsupport for React contém frameworks e funcionalidades que abstraem e automatizam:

• O fluxo de SSO junto ao provedor OIDC.

• A inclusão do Access Token nas requisições para o backend.

• A renovação periódica do Access Token.

• A verificação se determinada permissão está presente no contexto do usuário autenticado.

A seguir são apresentadas as instruções para configuração e utilização de OIDC na presente arquitetura.

Consulte uma visão geral do padrão OIDC no capítulo de Segurança em Microsserviços.

Configurando o OIDC

A integração OIDC do Cloudsupport for React é configurada automaticamente se existirem as seguintes propriedades no profile:

{
    "defaultLoginSuccessUrl": "https://app.dominio.com:3000",
    "defaultLogoutSuccessUrl": "https://app.dominio.com:3000/loggedOut",
    "oidcAuthority": "https://sso.dominio.com/realms/realm-name",
    "oidcClientId": "client-name",
    "oidcScope": "openid profile email offline_access"
}

É possível configurar o OIDC via propriedade options.auth do componente EnableCloudsupport. Essa propriedade suporta todos os parâmetros de AuthProvider.

Para fins do ambiente de desenvolvimento, a autenticação OIDC pode ser simulada com a declaração da propriedade mockAuthContext no profile, conforme exemplo:

{
    "mockAuthContext": {
        "access_token": "eyJhbGciOiJSUzI1NiIsInR5cCIgOiAiS...",
        "profile": {
            "sub": "12345678-a123-b123-c123-dd1234567890...",
            "name": "Nome do Usuário",
            "email": "nomeusuario@dominio.com",
            "roles":[
                "roleName1",
                "roleName2",
                "roleName3"
            ]
        }
    }
}

Note que a arquitetura espera que as permissões do usuário constem no claim JWT de nome "roles".

Validando Autenticação

Para proteger páginas contra acesso não autenticado, o Cloudsupport for React oferece o componente de UI AuthRequired, a ser utilizado em arquivos de layout, que provoca o redirecionamento para o SSO OIDC caso não exista usuário autenticado.

O componente é disponibilizado em sua versão padrão no pacote Foundation e na versão para PrimeReact. Consulte a documentação:

• Prime AuthRequired
• Foundation AuthRequired

Validando Autorização

Para proteger elementos de UI contra acesso não autorizado, o Cloudsupport for React oferece os componentes abaixo, no pacote Foundation. Consulte a documentação:

• HasAuthority
• HasAnyAuthority

Também são oferecidos Hooks para verificação programática de permissões:

• hasAuthority
• hasAnyAuthority

Obtendo Dados do Usuário

Dados do usuário autenticado podem ser obtidos a partir dos Hooks a seguir, disponíveis no pacote Foudation:

• useAuth
• useAccessToken

Próximos Passos

A próxima leitura sugerida é a seção Configuração, que mostra como configurar a arquitetura na aplicação.

A seção Documentação da API contém a referência completa de todos os módulos e componentes da arquitetura.