Formulários HTML customizados podem ser criados para segurança do usuário durante o estágio de autorização no OAuth.
A configuração do provedor OAuth Nativo inclui a autorização do usuário ao usar os tipos de concessão de senha Implícita, Código de Acesso ou Proprietário do Recurso. Você pode selecionar como autorizar os usuários do aplicativo e uma das opções é o formulário HTML personalizado. Para mais informações, consulte Configurando um provedor OAuth nativo ao usar o API Manager ou Configurando um provedor OAuth nativo ao usar o Cloud Manager. Este tópico descreve como criar o formulário HTML personalizado para autorização.
Sobre esta tarefa
Nas definições OAuth de três etapas (fluxo implícito, fluxo de senha do proprietário do recurso e fluxo de código de acesso (autorização)), o usuário concede permissão a um aplicativo para acessar seus dados por meio de um formulário de autorização. É possível apresentar um formulário customizado ou padrão. Seu formulário customizado deve preencher determinados requisitos.
Importante: os campos usados pelo IBM® API Connect para injetar informações em seu formulário têm nomes de campos com distinção entre maiúsculas e minúsculas.
Para criar um formulário de autorização customizado para seu provedor OAuth nativo, conclua as etapas a seguir:
- Crie um documento XHTML bem formado Isso é analisado pelo site API Connect para injetar campos ocultos.
- Para o seu formulário XHTML, configure o método como POST, o tipo de codificação como application/x-www-form-urlencodede a ação como authorize Inclua quaisquer outros parâmetros requeridos.
Por exemplo,
<form method="POST" enctype="application/x-www-form-urlencoded" action="authorize">
- Inclua a linha <AZ-INJECT-HIDDEN-INPUT-FIELDS/>.. Essa linha é um espaço reservado que o site API Connect substitui por campos de entrada necessários para a conclusão do processo do OAuth.
- Crie dois botões com o código a seguir para que o usuário possa conceder ou negar permissão. Edite
o texto para adequar às suas preferências.
<button class="cancel" type="submit" name="approve" value="false">No Thanks</button>
<button class="submit" type="submit" name="approve" value="true">Allow Access</button>
- Opcional: Exibir uma mensagem de erro quando um erro no formulário customizado impedir que ela seja exibida para o usuário corretamente. Use a tag
<AZ-INTERNAL-CUSTOM-FORM-ERROR/>; o texto da mensagem é gerado
automaticamente. Você deve detectar esses erros durante o teste para evitar que essa mensagem de erro seja exibida para o usuário.
- Opcional: Você pode adicionar ao formulário elementos HTML que carregam recursos de fontes externas, como imagens ou JavaScript.
Por exemplo,<script src="http://www.example.com/example.js"
/>
- Insira espaçamento e elementos extras conforme sua necessidade. A conclusão das etapas 1 a 6 resulta em um formulário semelhante ao exemplo a seguir:
<html lang="en" xml:lang="en">
<head><title>Request for permission</title></head>
<body class="customconsent">
<div>
<div>
<form method="post" enctype="application/x-www-form-urlencoded" action="authorize">
<AZ-INJECT-HIDDEN-INPUT-FIELDS/>
<p>Greeting..</p><DISPLAY-RESOURCE-OWNER/>
<p>This app </p><OAUTH-APPLICATION-NAME/><p> would like to access your data.</p>
<div>
<button class="cancel" type="submit" name="approve" value="false">No Thanks</button>
<button class="submit" type="submit" name="approve" value="true">Allow Access</button>
</div>
</form>
</div>
<AZ-INTERNAL-CUSTOM-FORM-ERROR/>
</div>
</body>
</html>
- Disponibilize seu formulário em uma URL de sua escolha.
- Se ainda não tiver feito isso, configure o provedor Native OAuth para usar um formulário HTML personalizado para autorização de segurança do usuário. Forneça o endereço URL como o ponto de extremidade no qual seu formulário está disponível. Para obter mais informações, consulte Configurando um provedor OAuth nativo ao usar o API Manager ou Configurando um provedor OAuth nativo ao usar o Cloud Manager.