对于Ajax请求来说,将CSRF令牌作为POST数据传递到每个POST请求中稍显不便。因此,Django允许利用CSRF令牌值在Ajax请求中设置自定义X-CSRFToken头。这可设置jQuery或者其他JavaScript库,并自动在每个请求中设定X-CSRFToken头。
为了在所有请求中包含令牌,需要执行下列各项步骤:
(1)从csrftoken Cookie中检索CSRF令牌,该令牌在CSRF处于活动状态时被设置。
(2)利用X-CSRFToken头在Ajax请求中发送该令牌。
关于CSRF和Ajax的更多信息,读者可访问:https://docs.djangoproject.com/zh-hans/2.2/ref/csrf/
示例:
<script src="https://cdn.bootcdn.net/ajax/libs/js-cookie/2.2.1/js.cookie.js"></script>
<script>
var csrftoken = Cookies.get('csrftoken')
function csrfSafeMethod(method){
return (/^(GET|HEAD|OPTIONS|TRACE)$/.test(method));
}
$.ajaxSetup({
beforeSend: function (xhr, settings) {
if (!csrfSafeMethod(settings.type) && !this.crossDomain) {
xhr.setRequestHeader("X-CSRFToken", csrftoken);
}
}
})
// 你的ajax请求
$(document).ready(function(){
.......
})
</script>
上述代码解释如下:
(1)此处从公共CDN中加载了JS Cookie,进而可方便地与Cookie交互。JS Cookie是一类处理Cookie的轻量级JavaScript。读者可访问https://github.com/js-cookie/js-cookie以了解更多内容。
(2)利用Cookies.get()读取csrftoken Cookie值。
(3)定义csrfSafeMethod()函数以检测HTTP方法是否安全。相应地,安全的方法并不需要使用CSRF保护--它们是GRT,HEAD,OPTIONS和TRACE。
(4)利用$.ajaxSetup()设置jQuery Ajax请求。在每个Ajax请求被执行之前,将检测请求方法是否安全,且当前请求不可跨域。若请求处于不安全状态,则利用从Cookie中获取的值设置XCSRFToken头。这一设置将应用于通过jQuery执行的全部Ajax请求。
CSRF令牌将包含在所有使用不安全HTTP方法(如POST,或者PUT)的Ajax请求中。