Compartilhar via

Como: Usar recursos avançados do controle de login ASP.NET

  • Artigo

O controle Login é um controle composto que fornece todos os elementos de interface do usuário (UI) comum de um formulário de logon.O controle é modularizado, e cada parte pode ser personalizada individualmente.Estas partes incluem as caixas de texto Nome de usuário e senha, o botão Enviar, o botão para criar um novo usuário, a caixa de seleção Lembra-Me e informações de ajuda para o usuário.Você pode definir sua própria interface de usuário para o controle de Logon definindo novos elementos e reutilizando componentes padrão.Você também pode personalizar o texto da interface do usuário e a aparência (fontes e cores) do controle Login.Como alternativa, você pode alterar a aparência geral do controle Login aplicando um tema ASP.NET ou capa.

Além disso, você pode fazer uso de recursos mais avançados do Login controle, sistema autônomo, por exemplo, se sistema autônomo informações de logon fossem armazenadas em um cookie persistente no navegador ou se o controle de login é visível (em páginas Outros que a página de logon padrão) quando um usuário está conectado. Finalmente, você pode converter o controle de login em um modelo para ter controle completo sobre a aparência do controle.

Para controlar se o controle de Login está visível quando um usuário faz o logon

  1. Coloque um controle Login em uma página.

    Observação:

    Por padrão, o controle está configurado para trabalhar com uma página de logon chamada login.aspx.Você pode alterar o nome da página de logon no arquivo Web.config, definindo o LoginUrl propriedade das FormsAuthentication classe.

  2. Se você desejar que o controle Login seja exibido somente quando um usuário não estiver logado (o controle será sempre exibido na página de logon identificado pela propriedade LoginUrl), defina a propriedade VisibleWhenLoggedInfalse.

  1. Se você desejar que o controle exiba uma caixa de seleção Remember me next time, defina a propriedade DisplayRememberMe para true.Se um usuário marcar a Caixa de seleção Remember me next time quando ele ou ela faz logon, o símbolo de autenticação será armazenada em um cookie persistente no navegador.

  2. Se você desejar que a caixa de seleção Remember me next time seja selecionada por padrão, defina a propriedade RememberMeSet para true.

  3. Se você desejar que o identificador de autenticação seja armazenado em um cookie persistente sem dar ao usuário a opção para limpar a caixa de seleção Remember me next time, defina a propriedade RememberMeSet como true e defina a propriedade DisplayRememberMe como false.Isso não é recomendável para sites que podem ser acessados de computadores públicos que servem vários usuários, já que o símbolo de autenticação persistente de um usuário pode ser usado por um usuário indesejado.

  1. Para adicionar um link para o Login controle que leva o usuário para um URL onde ele pode criar uma nova conta de usuário conjunto o CreateUserText propriedade para o texto sistema autônomo, por exemplo, clicar aqui para registrar e o CreateUserUrl propriedade para a URL da página Ajuda, sistema autônomo ~/Register.aspx.

    Observação:

    Esta etapa e as etapas a seguir requerem que os URLs de destino em um local que não requer autenticação.

  2. Para adicionar um link para o Login controle que leva o usuário para uma URL para sistema autônomo usuários para recuperar suas senhas conjunto o PasswordRecoveryText propriedade para texto, sistema autônomo Esqueceu sua senha? e o PasswordRecoveryUrl propriedade para a URL da página Ajuda, sistema autônomo ~/RecoverPassword.aspx.

  3. Para adicionar um link para o Login controle que leva o usuário para um URL ajuda, defina o HelpPageText propriedade para o texto sistema autônomo necessita de ajuda? e o HelpPageUrl propriedade para a URL da página Ajuda, sistema autônomo ~/userhelp.aspx.

Para adicionar imagens ao controle de Login

  • Para usar uma imagem em vez de um botão Log In, defina a propriedade LoginButtonImageUrl para a URL de seu arquivo de imagem de login, tal como ~/images/Login.gif .

    Você também pode incluir imagens com os links para criar URL de usuário, URL de recuperação de senha e URL de Ajuda usando as propriedades PasswordRecoveryIconUrl, CreateUserIconUrl e HelpPageIconUrl, respectivamente.

Convertendo o Controle de Logon em um Modelo

Você pode converter o controle Login em um modelo que está definido na marcação como uma tabela que contém controles ASP.NET, tais como Label e TextBox.Em seguida, você pode usar esses elementos ou adicionar seus próprios para criar um modelo personalizado para o controle Login.Observe que as mesmas identificações de controle são usadas para os controles que constituem o modelo de Logon como o modelo padrão.

Para usarum modelo com o controle de Login

  1. Coloque um controle Login em uma página no modo de Design.

  2. Clique com o botão direito do mouse no controle e selecione Convert to Template a partir de menu de atalho.

Como o controle Login é convertido depende da declaração DOCTYPE.Se a declaração DOCTYPE for definida para XHTML 1.0 Transitional (<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">), os estilos serão aplicados à tabela que é criada quando o controle Login é convertido em um modelo.Se a declaração DOCTYPE não é definida como XHTML 1.0 Transitional ou estiver ausente, nenhuma informação de estilo é mantida para a tabela externa que é gerada.

Por exemplo, se você definir a tamanho da fonte relativa no controle Login e converter o controle em um modelo, o tamanho da fonte relativa não é mantido para a tabela.O exemplo a seguir mostra um controle Login com um tamanho da fonte definido como Extragrande.

<asp:login id="Login2"  font-size="X-Large" BackColor="#F7F6F3" BorderColor="#E6E2D8" BorderPadding="4" BorderStyle="Solid" BorderWidth="1px" Font-Names="Verdana" ForeColor="#333333">
    <TitleTextStyle BackColor="#5D7B9D" Font-Bold="True" Font-Size="0.9em" ForeColor="White" />
    <InstructionTextStyle Font-Italic="True" ForeColor="Black" />
   <TextBoxStyle Font-Size="0.8em" />
    <LoginButtonStyle BackColor="#FFFBFF" BorderColor="#CCCCCC" BorderStyle="Solid" BorderWidth="1px"
    Font-Names="Verdana" Font-Size="0.8em" ForeColor="#284775" />
</asp:login>

Quando o controle Login no código acima é convertido em um modelo, a tabela criada não tem qualquer um dos estilos aplicados.O exemplo a seguir é um trecho do código gerado a partir do controle acima quando ele é convertido para um modelo.

<asp:login id="Login2"  font-size="X-Large" BackColor="#F7F6F3" BorderColor="#E6E2D8" BorderPadding="4" BorderStyle="Solid" BorderWidth="1px" Font-Names="Verdana" ForeColor="#333333">
    <TitleTextStyle BackColor="#5D7B9D" Font-Bold="True" Font-Size="0.9em" ForeColor="White" />
    <InstructionTextStyle Font-Italic="True" ForeColor="Black" />
    <TextBoxStyle Font-Size="0.8em" />
    <LoginButtonStyle BackColor="#FFFBFF" BorderColor="#CCCCCC" BorderStyle="Solid" BorderWidth="1px"
    Font-Names="Verdana" Font-Size="0.8em" ForeColor="#284775" />
    <LayoutTemplate>
    <table border="0" cellpadding="4" cellspacing="0" style="border-collapse: collapse">
...

Se você desejar que os atributos de estilo também se apliquem à tabela criada quando você converter o controle Login em um modelo, certifique-se de que o DOCTYPE para a página está definido como XHTML 1.0 Transitional antes de selecionar Convert to Template no menu de controle no modo de Design.

Consulte também

Conceitos

Personalizando a Aparência dos Controles de Login do ASP.NET

Visão Geral de Temas e Aparências ASP.NET

Outros recursos

Controles de Login na caixa de ferramentas