Tutorial: Autenticar usuários com o Django no Visual Studio

Este artigo apresenta a Etapa 5 da série de tutoriais Trabalhar com a estrutura da Web Django no Visual Studio.

A autenticação é um requisito comum para aplicativos Web. O modelo Django Web Project no Visual Studio fornece todos os módulos necessários para autenticação no arquivo settings.py do projeto Django. A etapa 4 desta série de tutoriais cria um aplicativo Web Django usando este modelo. Na Etapa 5, você explora os recursos de autenticação do modelo e trabalha com os recursos no aplicativo em execução.

Na etapa 5 do tutorial, você aprenderá a:

Explore o fluxo de autenticação no modelo Django Web Project no Visual Studio
Examine o código que suporta o processo de autenticação
Modificar o código para permitir o acesso às interfaces de administrador do Django
Execute o aplicativo Web Django e use recursos de autenticação

Pré-requisitos

Uma solução Visual Studio e um aplicativo Web Django baseado no modelo Django Web Project (DjangoWeb). Etapa 4: Use o modelo completo do Django Web Project descreve como criar este aplicativo.
O aplicativo Web Django deve ter uma conta de superusuário (administrador). Etapa 4 (Criar superusuário Django) descreve como criar as credenciais de superusuário.
Revise a secção Pré-requisitos na Etapa 1 desta série de tutoriais para obter detalhes sobre versões de templates Django, projetos do Visual Studio versus projetos Django e desenvolvimento Python no Mac.

Explore o fluxo de autenticação

Esta seção explica o fluxo de autenticação padrão fornecido pelo modelo Django Web Project para um aplicativo Web Django.

No Visual Studio, selecione Depurar>Iniciar Depuração (F5) para iniciar o aplicativo Web Django (DjangoWeb).
Quando o aplicativo abrir no navegador, observe a opção Login à direita na barra de navegação:

O aplicativo Django em execução tem uma barra de navegação com três opções de página, Início, Sobree Contato, e uma opção de Iniciar sessão. A configuração de autenticação permite que qualquer usuário veja o conteúdo nas páginas "Página inicial", "Sobre" e "Contato".
Para acesso autenticado ao aplicativo web Django, um superusuário designado pode usar a opção Login, que abre a página "Login":
Depois que o superusuário entrar, ele poderá acessar visualizações de página restritas para o site e concluir tarefas de administração:
O superusuário pode usar a opção Terminar sessão para sair da aplicação web Django e retornar à página inicial da aplicação web Django como um utilizador não autenticado.

Nas seções a seguir, você modifica a configuração de autenticação para oferecer suporte ao acesso ao site administrativo do Django para o superusuário.

Examinar o código de autenticação

Agora que você entende os recursos gerais de autenticação de um aplicativo Web Django, está pronto para examinar o código subjacente fornecido pelo modelo Django Web Project:

No Gerenciador de Soluções, expanda a pasta app/modelos/app do projeto. As etapas a seguir revisam vários arquivos nesta pasta.
Abra o arquivo de modelo base, layout.html. Desloque-se para o elemento <div class="navbar ...> e localize a etiqueta {% include app/loginpartial.html %}.

A tag {% include %} instrui o sistema de modelos do Django a extrair o conteúdo do arquivo incluído neste ponto do modelo que o contém.

Abra o arquivo loginpartial.html. Observe como esse modelo usa a tag condicional {% if user.is_authenticated %} juntamente com uma tag {% else %} para renderizar diferentes elementos da interface do usuário, dependendo se o usuário está autenticado:

{% if user.is_authenticated %}
<form id="logoutForm" action="/logout" method="post" class="navbar-right">
    {% csrf_token %}
    <ul class="nav navbar-nav navbar-right">
        <li><span class="navbar-brand">Hello {{ user.username }}!</span></li>
        <li><a href="javascript:document.getElementById('logoutForm').submit()">Log off</a></li>
    </ul>
</form>

{% else %}

<ul class="nav navbar-nav navbar-right">
    <li><a href="{% url 'login' %}">Log in</a></li>
</ul>

{% endif %}

Quando a aplicação é iniciada, nenhum superutilizador é autenticado e o código do modelo renderiza apenas o link Iniciar sessão. O link tem como alvo o caminho de "login" relativo ao site especificado no arquivo de URL do projeto Django (DjangoWeb/DjangoWeb/urls.py), conforme descrito em Etapa 4 (Examinar padrões de rota de URL). A rota "login" é mapeada para a vista django.contrib.auth.views.login e a vista recebe os seguintes dados:
```
{
    'template_name': 'app/login.html',
    'authentication_form': app.forms.BootstrapAuthenticationForm,
    'extra_context':
    {
        'title': 'Log in',
        'year': datetime.now().year,
    }
}
```
Este código define três propriedades:
- template_name identifica o modelo para a página "Login" definida no arquivo app/login.html. Lembre-se, este link é relativo ao site. O caminho completo da pasta é app/templates/app/login.html.
- extra_context adiciona informações aos dados de contexto padrão fornecidos ao modelo. Neste contexto, as informações incluem o título "Log in", juntamente com a data e a hora.
- authentication_form especifica uma classe de formulário a ser usada com o procedimento de logon. No modelo, esse valor de propriedade aparece como o objeto form. O valor padrão é AuthenticationForm (de django.contrib.auth.views), mas o modelo de projeto do Visual Studio usa o formulário definido no ficheiro app/forms.py do projeto:
```
from django import forms
from django.contrib.auth.forms import AuthenticationForm
from django.utils.translation import ugettext_lazy as _

class BootstrapAuthenticationForm(AuthenticationForm):
    """Authentication form which uses bootstrap CSS."""
    username = forms.CharField(max_length=254,
                            widget=forms.TextInput({
                                'class': 'form-control',
                                'placeholder': 'User name'}))
    password = forms.CharField(label=_("Password"),
                            widget=forms.PasswordInput({
                                'class': 'form-control',
                                'placeholder':'Password'}))
```
  A classe de formulário deriva de AuthenticationForm e substitui especificamente os campos de nome de usuário e senha para adicionar texto de espaço reservado. O modelo do Visual Studio inclui esse código explícito na suposição de que você provavelmente deseja personalizar o formulário, como adicionar validação de força de senha.

Quando a interação do utilizador com a aplicação abre a página "Entrar", a aplicação renderiza o modelo de login.html. As variáveis {{ form.username }} e {{ form.password }} renderizam os formulários CharField da classe BootstrapAuthenticationForm. Há também uma seção interna para mostrar erros de validação e um elemento pronto para logins sociais se você optar por adicionar esses serviços:

{% extends "app/layout.html" %}

{% block content %}

<h2>{{ title }}</h2>
<div class="row">
    <div class="col-md-8">
        <section id="loginForm">
            <form action="." method="post" class="form-horizontal">
                {% csrf_token %}
                <h4>Use a local account to log in.</h4>
                <hr />
                <div class="form-group">
                    <label for="id_username" class="col-md-2 control-label">User name</label>
                    <div class="col-md-10">
                        {{ form.username }}
                    </div>
                </div>
                <div class="form-group">
                    <label for="id_password" class="col-md-2 control-label">Password</label>
                    <div class="col-md-10">
                        {{ form.password }}
                    </div>
                </div>
                <div class="form-group">
                    <div class="col-md-offset-2 col-md-10">
                        <input type="hidden" name="next" value="/" />
                        <input type="submit" value="Log in" class="btn btn-default" />
                    </div>
                </div>
                {% if form.errors %}
                <p class="validation-summary-errors">Please enter a correct user name and password.</p>
                {% endif %}
            </form>
        </section>
    </div>
    <div class="col-md-4">
        <section id="socialLoginForm"></section>
    </div>
</div>

{% endblock %}

Quando o usuário seleciona de login no formulário de página, o Django tenta autenticar as credenciais, como as credenciais do superusuário:
- Se a autenticação falhar, o usuário permanecerá na página "Login" e a tag form.errors será definida como true:
- Se a autenticação for bem-sucedida, o Django abre o URL relativo no campo next, <input type="hidden" name="next" value="/" />, que neste caso é a página "Home" (/).
Quando a aplicação renderiza a página "Início" depois de o utilizador ser autenticado, a propriedade user.is_authenticated é verdadeira quando o modelo loginpartial.html é renderizado. Nesse caso, a barra de navegação mostra uma mensagem Hello (nome de usuário) e a opção Log off substitui a opção Log in:

Você pode usar a propriedade user.is_authenticated em outras partes do código do aplicativo para verificar a autenticação.

Acessar interfaces de administrador do Django

Para verificar se o usuário autenticado está autorizado a acessar recursos específicos, você precisa recuperar permissões específicas do usuário do seu banco de dados.

O superusuário ou administrador, em particular, está autorizado a acessar as interfaces de administrador do Django integradas usando as URLs relativas ao site /admin/ e /admin/doc/. Para obter mais informações, consulte Usando o sistema de autenticação Django (Django docs).

Para habilitar o acesso às interfaces de administrador do Django, siga estas etapas:

Instale o pacote docutils Python em seu ambiente. Para obter instruções, consulte Instalar pacotes para o ambiente Python.
No Explorador de Soluções, expanda a pasta do projeto Django, DjangoWeb/DjangoWeb/. As etapas a seguir atualizam vários arquivos nessa pasta.
Abra o arquivo urls.py do projeto Django e modifique o conteúdo da seguinte maneira:
1. Na parte superior do ficheiro, adicione a seguinte importação de pacote para URLs ao fim da lista atual:
```
from django.conf.urls import include
```
2. Após a lista de importação, adicione a seguinte instrução:
```
admin.autodiscover()
```
3. Localize a definição de urlpatterns e adicione a seguinte entrada de caminho antes de a entrada 'admin/':
```
path('admin/doc/', include('django.contrib.admindocs.urls')),
```
Abra o arquivo settings.py do projeto Django e localize a coleção INSTALLED_APPS. Adicione a seguinte entrada imediatamente após a entrada app:
```
'django.contrib.admindocs',
```
Pare e reinicie o aplicativo Web Django.
No campo Endereço URL do navegador, altere a exibição de página do aplicativo para a rota /admin/ ou /admin/doc/. Essas páginas fornecem ao superusuário acesso a tarefas administrativas do Django, como criar contas de usuário ou grupo, alterar a senha e visualizar a documentação do Django:

Explore o comportamento de encerramento de sessão

Há duas maneiras de o superusuário fazer logoff e encerrar a sessão autenticada. O aplicativo web Django inclui a opção Terminar sessão na barra de navegação e o site administrativo Django fornece a opção Terminar sessão.

Sair do site administrativo do Django

Se o superusuário estiver visualizando páginas no site administrativo do Django, ele poderá selecionar Sair na barra de navegação do site. O navegador é atualizado para mostrar a página "Desconectado" do site:

Nesta página, o utilizador tem duas opções, Início e Entrar novamente. Ambas as opções retornam o usuário para a página "Home" do site administrativo do Django (/admin), onde o usuário é solicitado a reinserir suas credenciais.

Faça logoff do aplicativo Web Django

Se o superusuário estiver a visualizar páginas na aplicação web do Django, como "Sobre" ou "Contato", poderá selecionar Terminar sessão na barra de navegação. O comportamento ao encerrar sessão é mínimo. Ele simplesmente termina a sessão autenticada e navega o usuário de volta para a página "Home" do aplicativo.

Você pode melhorar o comportamento de encerramento de sessão para que seja mais informativo para o usuário.

No Gerenciador de Soluções , expanda a pasta app/templates/app do projeto e abra o arquivo loginpartial.html.
No ficheiro de modelo, observe que o link Log off realiza simplesmente uma operação HTTP POST (action="/logout" method="post") para o caminho de URL relativo do site "/login" (href="{% url 'login' %}").
```
{% if user.is_authenticated %}
<form id="logoutForm" action="/logout" method="post" class="navbar-right">
   {% csrf_token %}
   <ul class="nav navbar-nav navbar-right">
      <li><span class="navbar-brand">Hello {{ user.username }}!</span></li>
      <li><a href="javascript:document.getElementById('logoutForm').submit()">Log off</a></li>
   </ul>
</form>

{% else %}

<ul class="nav navbar-nav navbar-right">
   <li><a href="{% url 'login' %}">Log in</a></li>
</ul>

{% endif %}
```
A função integrada de visualização django.contrib.auth.views.logout lida com este processo de terminar sessão.

O comportamento atual não exibe nenhuma interface que informe o utilizador de que está desconectado. O processo simplesmente navega o usuário de volta para a página "Home" do aplicativo web Django de acordo com o padrão de caminho 'logout/' definido no arquivo URL do projeto Django (DjangoWeb/DjangoWeb/urls.py):
```
 path('logout/', LogoutView.as_view(next_page='/'), name='logout'),
```
Para exibir uma confirmação de log off mais informativa, pode criar uma página "Fazer log off" para a aplicação.
Na pasta app/templates/app, crie um novo arquivo de modelo HTML chamado loggedoff.html.

Adicione o seguinte conteúdo ao novo arquivo de modelo:

{% extends "app/layout.html" %}
{% block content %}
<h3>You have been logged off</h3>
{% endblock %}

No arquivo de URL do projeto Django, DjangoWeb/DjangoWeb/urls.py, altere o padrão de URL para o caminho 'logout/' da seguinte maneira:
```
path('logout/', LogoutView.as_view(template_name='app/loggedoff.html'), name='logout'),
```
O código atualizado adiciona uma propriedade template_name para trabalhar com o novo template HTML para a página "Terminada a sessão".
Pare e reinicie o aplicativo Web Django. Inicie sessão novamente e, em seguida, selecione Terminar sessão. Desta vez, o aplicativo mostra uma mensagem mais informativa para o usuário para confirmar que ele está desconectado:
Pare o servidor e feche as janelas do navegador do aplicativo.

Salvar projeto no controle do código-fonte

Se tiveres comprometido a tua solução do Visual Studio com o controlo de versão ao longo desta série de tutoriais, agora é um bom momento para realizar outro commit. Siga as instruções em Etapa 2 (confirmar alterações no controle do código-fonte) nesta série de tutoriais.

Sua solução deve corresponder ao código-fonte do tutorial no GitHub: Microsoft/python-sample-vs-learning-django.

Usar a tag {% csrf_token %} nos elementos do formulário

A tag {% csrf_token %} inclui o de proteção de falsificação de solicitação entre sites (csrf) integrado do Django (Django docs). Normalmente, você adiciona essa marca a qualquer elemento que envolva métodos de solicitação POST, PUT ou DELETE, como um formulário. A função de renderização do modelo (render) insere a proteção necessária.

Revisão do tutorial

Parabéns por concluir este tutorial sobre Django no Visual Studio.

Neste tutorial, você aprendeu como:

Crie diferentes tipos de projetos Django usando vários modelos no Visual Studio
Criar um aplicativo Web Django com várias páginas
Utilizar modelos para criar diferentes rotas e vistas de página
Servir arquivos estáticos, adicionar páginas e usar herança de modelo
Fornecer acesso autenticado a páginas e recursos restritos do aplicativo e interfaces administrativas do Django

Autenticação de usuário no Django (docs.djangoproject.com)
Tutorial de código-fonte no GitHub (Microsoft/python-sample-vs-learning-django)

Comentários

Esta página foi útil?

Last updated on 2025-08-08