首页 > 解决方案 > Django:使用 Bootstrap login.html 记录用户时遇到问题

问题描述

我正在使用 Django 3.0.2 + Boostrap。我创建了一个registration/login.html页面。该页面的内容如下所示。

该页面可以正确呈现,并且大部分都可以正常工作。但是,我无法通过此页面登录我的网站。我不断得到Your username and password did not match. Please try againadmin如果我使用相同的用户名/密码,我可以毫无问题地登录网站。我不确定我的login.html. 有任何想法吗?

{% extends "base.html" %}

{% block content %}

{% if form.errors %}
<p>Your username and password did not match. Please try again.</p>
{% endif %}

{% if next %}
    {% if user.is_authenticated %}
    <p>Your account does nohave access to this page. To proceed,please login with an account that has access.</p>
    {% else %}
    <p>Please login to see this page.</p>
    {% endif %}
{% endif %}

<div class="container-fluid">
    <div class="row justify-content-center">
        <div class="col-lg-6">
            <div class="p-5">

                <div class="text-center">
                    <h1 class="h4 text-gray-900 mb-4">Welcome Back!</h1>
                </div>

                <form class="user" method="post" action="{% url 'login' %}">
                    {% csrf_token %}
                    <div class="form-group">
                        <input type="text" class="form-control form-control-user" id="exampleInputUserName" placeholder="Username">
                    </div>
                    <div class="form-group">
                        <input type="password" class="form-control form-control-user" id="exampleInputPassword" placeholder="Password">
                    </div>
                    <input type="submit" class="btn btn-primary btn-user btn-block" value="Login">
                    <input type="hidden" name="next" value="{{ next }}">
                </form>

                <hr>

                <div class="text-center">
                    <a class="small" href="forgot-password.html">Forgot Password?</a>
                </div>
                <div class="text-center">
                    <a class="small" href="register.html">Create an Account!</a>
                </div>

            </div>
        </div>
    </div>
</div>

{% endblock %}

views.py 的内容:

from django.contrib.auth import logout


def logout_view(request):
    """Log out user from the website."""

    logout(request)

标签: djangobootstrap-4

解决方案


您的input类型缺少名称属性。根据Mozilla文档:

一个字符串,指定输入控件的名称。提交表单数据时,此名称与控件的值一起提交。

因此名称与表单一起提交。但是如果没有name属性呢?相同的文档说明:

将名称视为必需属性(即使不是)。如果输入没有指定名称,或者名称为空,则输入的值不会与表单一起提交。

所以您的用户名和密码不会发送到后端。

您需要为输入类型提供名称属性。

<form class="user" method="post" action="{% url 'login' %}">
      {% csrf_token %}
      <div class="form-group">
           <input type="text" class="form-control form-control-user" id="exampleInputUserName" placeholder="Username" `name="username"`>
       </div>
       <div class="form-group">
            <input type="password" class="form-control form-control-user" id="exampleInputPassword" placeholder="Password" name="password">
       </div>
       <input type="submit" class="btn btn-primary btn-user btn-block" value="Login">
       <input type="hidden" name="next" value="{{ next }}">
</form>

这是前端问题,与 Django 无关。


推荐阅读