django2 中 ajax 的 csrf 令牌

Question

我正在学习 Django2，并尝试使用 csrf_token 和 ajax 制作登录页面。

我希望如果用户没有lgoin，那将转到登录页面并在login.If用户登录成功之前发送一个变量next作为页面的标签，我可以转转到首页或标记为 next 的页面。

我阅读了 Django2 的文档，并尝试编写如下代码，但是，当我单击 "LOGIN" 按钮时，它只是刷新登录页面并且没有出现错误

一头雾水，想不通already.Please求助

登录浏览量：

def login(request):
    if request.is_ajax():
        uf = UserForm(request.POST)
        if uf.is_valid():
            # get info from form
            username = uf.cleaned_data['username']
            password = uf.cleaned_data['password']
            user = auth.authenticate(request, username=username, password=password)
            if user is not None:  # user match
                auth.login(request, user)
                if request.GET.get('next'):
                    next_url = request.GET.get('next')
                    return JsonResponse({'redirect_url': next_url})
                    # return redirect(request.GET.get('next'))
                else:
                    return JsonResponse({'redirect_url': 'home'})
            else:  # user not match
                error_msg = ["username or pwd mistake"]
                return JsonResponse({'error_msg': error_msg})
    else:
        uf = UserForm()
    return render(request, 'login.html', {'uf': uf})

html :

    <form>
      {% csrf_token %}
       {{ uf.username }}
       {{ uf.password }}
      <div id="errorMsg"></div>
        <button type="submit" class="btn btn-default" id="loginButton">login</button>
     <input type="hidden" name="next" id="redirect-next" value="{{ next|escape }}"/>
   </form>

JQuery:

       $("#loginButton").click(function () {
    $.ajax({
        url: "",
        type: 'POST',
        dataType: "json",
        data: {username: $("#inputEmail3").val(), password: $("#inputPassword3").val()},
        beforeSend: function (xhr, settings) {
            var csrftoken = Cookies.get('csrftoken');
            function csrfSafeMethod(method) {
                // these HTTP methods do not require CSRF protection
                return (/^(GET|HEAD|OPTIONS|TRACE)$/.test(method));
            }
            if (!csrfSafeMethod(settings.type) && !this.crossDomain) {
                xhr.setRequestHeader("X-CSRFToken", csrftoken);
            }
        },
        success: function (result) {
            if (result.error_msg) {
                $('#errorMsg').show().text('user info error') //print an alert on the page
            }
            else {
                location.href = result.redirect_url //turn to homepage or page before login
            }
        }
    })
});

Answer 1

这可能与此有关issue

当您的按钮尝试提交表单但您希望它由脚本处理时。

尝试将按钮类型更改为

type="button"

Answer 2

你不需要像这样写一个你自己的登录视图。 Django 提供了更简单的方法来实现它。

首先确保您的 settings.py

中包含以下内容

MIDDLEWARE_CLASSES = [
    ...
    'django.contrib.auth.middleware.AuthenticationMiddleware',
    ...
]
INSTALLED_APPS = [
    ...
    'django.contrib.auth',
    'django.contrib.contenttypes',
    ...
]

将所有登录 URL 添加到您的主 urls.py:

from django.urls import path
from django.conf.urls import include


urlpatterns = [
....
    path('accounts/', include('django.contrib.auth.urls')),
....
]

不要忘记运行 python manage.py migrate 创建 auth 应用程序所需的表。现在应用程序和 URL 已准备就绪，需要创建模板。该应用程序的所有模板都应放在 templates 目录下名为 registration 的文件夹下。目录结构应该是这样的。

your_django_app/
    templates/
        registration/
            login.html
    __init__.py
    apps.py
    settings.py
    urls.py
    views.py
    wsgi.py

login.html 的内容应该是这样的：

<form id="loginform" action="{% url 'login' %}" method="POST">
{% csrf_token %}
{% if next %}
    <input type="hidden" name="next" value="{{ next }}" />
{% endif %}
    <input name="username" id="id_username" type="text">
    <label>Username</label>
    <input name="password" id="id_password" type="password">
    <label>Password</label>
{% if form.errors %}
    Error! Wrong credentials.
{% endif %}
    <button type="submit">Login</button>
</form>

在此之后将这些包含在您的 settings.py 文件中，以便在登录后正确重定向用户。

LOGIN_REDIRECT_URL = '/'
LOGIN_URL = '/accounts/login'

你们都准备好了。请确保在运行ning python manage.py createsuperuser 尝试之前至少创建一个用户。对于所有需要用户登录才能查看的页面，您可以在其各自的视图函数上方使用 @login_required 装饰器，在显示页面之前将他们重定向到登录页面。示例：

from django.shortcuts import render
from django.contrib.auth.decorators import login_required

@login_required
def home(request):
    return render(request, 'home/index.html')

Answer 3

这里有一个使用ajax解析csrf_token的简短方法：

脚本标签内。

    $.ajax({
           url: window.location.pathname,
           type: 'POST',
           data: {
                 ......,
                // Note this step.
                'csrfmiddlewaretoken': "{{ csrf_token }}"
                },
                success: function() {
                   .....
                }
    });

希望一切顺利，因为我在我的 2 个基于 Django 的项目中使用它来解析 csrf_token。干杯！

django2 中 ajax 的 csrf 令牌

csrf token for ajax in django2

ajax

django

django-csrf