ajax封装请求头,Django之ajax(jquery)封装（包含 将 csrftoken 写入请求头方法）

由于支持问题，未使用 es6 语法

_ajax.js

/**

* 发起请求

* @param url 请求地址

* @param data 请求数据 { } json格式

* @param type 请求类型 get|post

* @param success 请求成功回调方法(如果支持es6，使用 Promise 更方便)

* @param fail 请求失败回调方法

*/

function jqAjax(url, data, type, success, fail) {

_ajaxSetup(); // 先将 csrftoken 写入请求头，避免被django拒绝

$.ajax({

"url": url,

"type": type,

"data": data,

"timeout": 5000,

"beforeSend": function (xhr) {

},

"success": function (res) {

if (res.code === 200) {

if (success) {

console.log(res);

success(res.data)

}

} else {

if (fail) {

fail(res)

}

console.log(res.code + "：" + res.message)

}

},

"error": function (e) {

console.log(e)

if (fail) {

fail(e)

}

}

});

}

/**

* 快捷发起get请求

* @param url 地址(因为是django项目的静态文件，地址不需要加ip与端口)

* @param data 数据 { } json

* @param success 请求成功方法

* @param fail 请求失败的方法

* @private

*/

function _get(url, data, success) {

jqAjax(url, data, "get", success)

}

/**

* 快捷发起post请求

* @param url 地址(因为是django项目的静态文件，地址不需要加ip与端口)

* @param data 数据 { } json

* @param success 请求成功方法

* @param fail 请求失败的方法

* @private

*/

function _post(url, data, success) {

jqAjax(url, data, "post", success)

}

// 下面两个方法主要处理django中的csrftoken验证问题

// 将csrftoken写入当前请求头

function _ajaxSetup() {

$.ajaxSetup({

beforeSend: function (xhr, settings) {

//console.log(getCookie('csrftoken'));

if (!/^(GET|HEAD|OPTIONS|TRACE)$/.test(settings.type) && !this.crossDomain) {

xhr.setRequestHeader("X-CSRFToken", getCookie('csrftoken'));

}

}

});

}

function getCookie(name) {

var cookieValue = null;

if (document.cookie && document.cookie !== '') {

var cookies = document.cookie.split(';');

for (var i = 0; i < cookies.length; i++) {

var cookie = jQuery.trim(cookies[i]);

// Does this cookie string begin with the name we want?

if (cookie.substring(0, name.length + 1) === (name + '=')) {

cookieValue = decodeURIComponent(cookie.substring(name.length + 1));

break;

}

}

}

return cookieValue;

}

如果你希望成功，当以恒心为良友，以经验为参谋，以当心为兄弟，以希望为哨兵。——爱迪生