javascript - Django AJAX 登录表单验证

Question

我正在尝试在 Django 中创建一个 AJAX 登录表单，这将涉及检查用户是否输入了正确的 username 和 password。这是我的代码:

urls.py

urlpatterns = [
    url(r'^$', views.boxes_view, name='news'),
    url(r'^user_login/', views.user_login, name='user_login'),
]

表单.py

class UserLoginForm(forms.Form):
    username = forms.CharField(max_length=25)
    password = forms.CharField(widget=forms.PasswordInput)

    class Meta:
        model = User

        fields = [
            'username',
            'password',
        ]

base.html

<form method="post" enctype="multipart/form-data" action="{% url 'user_login' %}" class="form_login">{% csrf_token %}
<div class="loginWrapper">
<div class="login">
    <div class="loginBox">
        {{ form_login.username|placeholder:"username"|add_class:"login_username" }}
        {{ form_login.password|placeholder:"password"|add_class:"login_password" }}

        <input type="submit" value="login"/>
    </div>
</div>
</div>
</form>

这是我的 jQuery 函数。它成功地将输入的 username 和 password 记录到控制台。

base.js

$('.form_login').on('submit', function(e) {

    $.ajax({
        type: 'POST',
        url: 'http://127.0.0.1:8000/user_login/',
        data: {'username': $('.login_username').val(),
                'password': $('.login_password').val()},
        success: function (data) {
            console.log(data)
                }
        }
    )
})

如何从 jQuery 函数获取 data 到我的 views.py？这是我当前的 View ，可以很好地让用户登录，但是如果输入了错误的凭据，它仍然会提交表单，这就是为什么我想实现 AJAX 以防止提交并在发生这种情况时列出错误。

views.py

def user_login(request):
    form_login = UserLoginForm(request.POST or None)
    if form_login.is_valid():
        username = form_login.cleaned_data['username']
        password = form_login.cleaned_data['password']
        user = authenticate(username=username, password=password)
        if user is not None and user.is_active:
            login(request, user)
        else:
            pass
    else:
        print(form_login.errors)
        print(form_login.non_field_errors)
        form_login = UserLoginForm()

    return redirect('/')

然后如何验证 views.py 中的 jQuery 数据？

Answer 1

首先，您不应该编写自己的注册/身份验证系统。那里有很多久经考验的解决方案。脑海中立刻浮现出 Django Allauth。

其次，如果您在使用 ajax 的同时发送登录数据，您会希望 View 返回一个 ajax 响应

    if user is not None and user.is_active:
        login(request, user)
        return JsonResponse({'status': 'ok'});
    else:
        return JsonResponse({'status': 'login failed'});

然后在您的表单无效部分中，您只是重定向到另一个页面。这对 ajax 不太适用。

else:
    return JsonResponse(form_login.errors.as_json())