Personalizar a interface de utilizador do Azure AD B2C para o Power Pages
Artigo
O Azure AD B2C suporta a personalização da interface do utilizador para a experiência de inscrição e de início de sessão. Com esta funcionalidade, pode configurar o inquilino Azure AD B2C com uma página de inscrição e de início de sessão personalizada criada dentro do seu site. Neste artigo, vai aprender a criar e configurar uma página Web personalizada de inscrição/início de sessão com HTML de exemplo no seu site para utilização com autenticação Azure AD B2C.
A partir do painel esquerdo, sob Site, selecione Modelos de Página.
Selecione Novo.
Introduza o Nome, como a Página Personalizada do Azure AD B2C.
Para Site, selecione o seu site.
Selecione Tipo como Modelo Web.
Para Modelo Web, selecione o modelo Web que criou anteriormente no passo 1.
Desmarque Utilizar Cabeçalho e Rodapé de Site.
Selecione Guardar e Fechar.
Passo 3: Criar uma página Web
A partir do painel esquerdo, sob Conteúdo, selecione Páginas Web.
Selecione Novo.
Introduza o Nome, como Iniciar sessão.
Para Site, selecione o seu site.
Para a Página Principal, selecione Home Page.
Introduza URL Parcial para a página Web, tal como azure-ad-b2c-sign-in.
Para Modelo de Página, selecione o modelo de página que criou anteriormente no passo 2.
Para Estado de Publicação selecione Publicado.
Selecione Guardar e Fechar.
Passo 4: Criar definições do site
As definições do site são necessárias para configurar a partilha de recursos de origem cruzada (CORS), para permitir que o Azure AD B2C solicite a página personalizada e injete a interface de início de sessão ou inscrição. Crie as definições do site seguintes.
Nome
valor
HTTP/Access-Control-Allow-Methods
GET, OPTIONS
HTTP/Access-Control-Allow-Origin
https://tenant-name.b2clogin.com Por exemplo, se o nome do inquilino for ContosoOrg, introduza https://contosoorg.b2clogin.com. Nota: Pode obter este valor copiando a parte do nome de domínio do URL do Emissor. Certifique-se de que exclui a parte de não domínio do valor de URL do Emissor, por exemplo, exclua /tfp/aaaabbbb-0000-cccc-1111-dddd2222eeee/b2c_1_contoso/v2.0.
Para criar definições do site:
A partir do painel esquerdo, sob Site, selecione Definições do Site.
Selecione Novo.
Introduza o Nome conforme indicado na tabela acima.
Para Site, selecione o seu site.
Introduza o Valor conforme indicado na tabela acima.
A partir do canto superior esquerdo do portal do Azure, selecione .
Selecione Todos os recursos.
Selecione o seu inquilino B2C.
Se ainda não estiver, selecione Descrição geral a partir do painel esquerdo.
A partir da secção intermédia direita do ecrã, selecione Abrir Inquilino B2C.
Esta ação abre o inquilino B2C num separador de browser separado.
No separador de browser de inquilino B2C, sob Políticas no painel esquerdo, selecione Fluxos de utilizador.
Selecione o fluxo de utilizador que criou para o Power Pages. Por exemplo, B2C_1_Contoso.
A partir do painel esquerdo, sob Personalizar, selecione Esquemas de página.
Sob Página de inscrição ou de início de sessão unificada, selecione Sim para Utilizar conteúdo da página personalizada.
Para URL de página personalizada, introduza o URL completo da página personalizada do seu site que criou no passo 3.
Por exemplo, para a página chamada azure-ad-b2c-sign-in no portal https://contoso.powerappsportals.com, utilize o URI da página personalizada como https://contoso.powerappsportals.com/azure-ad-b2c-sign-in.
O seu inquilino Azure AD B2C está agora configurado para utilizar a página personalizada para a experiência de inscrição e de início de sessão.