ajax向Django前后端提交请求和CSRF跨站请求伪造

1.ajax登录示例

urls.py

from django.conf.urls import url
from django.contrib import admin
from app01 import views
 
urlpatterns = [
    url(r'^admin/', admin.site.urls),
    url(r'^login_ajax/$', views.login_ajax, name='login_ajax'),
    url(r'^index/$', views.index, name='index'),
]

views.py

from django.shortcuts import render, HttpResponse, redirect
import json
 
 
def index(request):
    return HttpResponse('this is index')
 
 
def login_ajax(request):
    if request.method == "POST":
        user = request.POST.get("user")
        pwd = request.POST.get("pwd")
        ret = {"status": 0, 'url': ''}
        if user == "alex" and pwd == "123":
            ret['status'] = 1
            ret['url'] = '/index/'
        return HttpResponse(json.dumps(ret))
 
    return render(request, "login_ajax.html")

login.html登录页面

"en">

    "UTF-8">
    "x-ua-compatible" content="IE=edge">
    "viewport" content="width=device-width, initial-scale=1">
    
    "stylesheet" href="/static/plugins/bootstrap-3.3.7-dist/css/bootstrap.css">
    "stylesheet" href="/static/css/signin.css">


 
class="container">
 
    
class="form-signin" action="{% url 'login' %}" method="post">
        {% csrf_token %}
        
class="form-signin-heading">请登录
        for="inputUser" class="sr-only">用户名
        "text" id="inputUser" class="form-control" placeholder="用户名" required="" autofocus="" name="user">
        for="inputPassword" class="sr-only">密码
        "password" id="inputPassword" class="form-control" placeholder="密码" required="" name="pwd">
        
class="checkbox">
            
                "checkbox" value="remember-me"> 记住我
            
        
        class="btn btn-lg btn-primary btn-block" id="login" value="登陆">
    
 
 
 
 


 

View Code

静态文件需要配置，使用了jQuery和Bootstrap。

2.CSRF跨站请求伪造

一共四种方式

1，将 csrfmiddlewaretoken: $("[name='csrfmiddlewaretoken']").val() 放在POST的请求体中。

示例中就是使用的这种方式。

2，给ajax的请增加X-CSRFToken的请求头，对应的值只能是cookie中的csrftoken的值。

所以我们要从cookie中提取csrftoken的值，jQuery不能去cookie，我们使用jquery.cookie的插件。点击下载jquer.cookie插件。

HTML中导入jquery.cookie.js。

View Code

3，使用$.ajaxSetup()给全局的ajax添加默认参数。

可以按照方式一设置data，也可以按照方式二设置请求头。

$.ajaxSetup({
    data: {
        csrfmiddlewaretoken: $("[name='csrfmiddlewaretoken']").val(),
    }
});
或者
$.ajaxSetup({
    headers: {"X-CSRFToken": $.cookie('csrftoken')},
});

4，官方推荐方法（用到jquery.cookie插件）：

function csrfSafeMethod(method) {
    // these HTTP methods do not require CSRF protection
    return (/^(GET|HEAD|OPTIONS|TRACE)$/.test(method));
}
 
$.ajaxSetup({
    beforeSend: function (xhr, settings) {
        if (!csrfSafeMethod(settings.type) && !this.crossDomain) {
            xhr.setRequestHeader("X-CSRFToken", $.cookie('csrftoken'));
        }
    }
});

 

转载于:https://www.cnblogs.com/yzxing/p/9339081.html