由于支持问题,未使用 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;
}

  

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

Django之ajax(jquery)封装(包含 将 csrftoken 写入请求头方法)的更多相关文章

  1. 基于jquery封装通用的控制显示隐藏的方法

    应用场景 在项目中会存在大量这样的需求: 1.选择不同的radio单选框,页面上的部分内容随之显示隐藏 2.选择不同的option下拉框内容,页面上的部分内容随之显示隐藏 如果每次遇到这类需求都单独写 ...

  2. js实现原生Ajax的封装及ajax原理详解

    原理及概念 AJAX即“Asynchronous Javascript And XML”(异步JavaScript和XML),是一种用于创建快速动态网页的技术. 动态网页:是指可以通过服务器语言结合数 ...

  3. 采用jquery同django实现ajax通信

    在网页访问中通过HTTP协议中的get/post文件发送数据或请求.在浏览器中输入url后,浏览器就会帮助我们完成请求的发送和返回,并刷新更新界面.但是,如果我们不想更新界面,仅仅是发送一个get/p ...

  4. Ajax的封装,以及利用jquery的ajax获取天气预报

    1.Ajax的封装 function ajax(type,url,param,sync,datetype,callback){//第一个参数是获取数据的类型,第二个参数是传入open的url,第三个是 ...

  5. 原生态AJAX详解和jquery对AJAX的封装

    AJAX: A :Asynchronous [eI`sinkrenes] 异步 J :JavaScript    JavaScript脚本语言 A: And X :XML 可扩展标记语言 AJAX现在 ...

  6. 不借助jquery封装好的ajax,你能用js手写ajax框架吗

    不借助jquery封装好的ajax,你能手写ajax框架吗?最基础的ajax框架,一起来围观吧. .创建XMLHttpRequest对象 var xhr = new XMLHttpRequest(); ...

  7. 模仿jQuery的ajax的封装

    /* * 我们使用了ajax 的xmlHttpRequest 跟服务器进行交互. * * 交互了有四个基本步骤 * 1:创建对象 * 2:建立连接 * 3:发送请求 * 4:接收数据 * * 这些操作 ...

  8. Jquery封装ajax

    Jquery封装ajax   Load方法     <!-- 将jquery.js导入进来 -->     <script type="text/javascript&qu ...

  9. Jquery Ajax简单封装(集中错误、请求loading处理)

    Jquery Ajax简单封装(集中错误.请求loading处理) 对Jquery Ajax做了简单封装,错误处理,请求loading等,运用到项目中集中处理会很方便. 技术层面没有什么好说的,请求是 ...

随机推荐

  1. 【LeetCode】347. Top K Frequent Elements 解题报告(Python & C++)

    作者: 负雪明烛 id: fuxuemingzhu 个人博客: http://fuxuemingzhu.cn/ 目录 题目描述 解题方法 解题方法 字典 优先级队列 日期 题目地址:https://l ...

  2. 【剑指Offer】数字在排序数组中出现的次数 解题报告(Python)

    [剑指Offer]数字在排序数组中出现的次数 解题报告(Python) 标签(空格分隔): 剑指Offer 题目地址:https://www.nowcoder.com/ta/coding-interv ...

  3. codeforce 597C-Subsequences(dp+树状数组)

    题目和南阳那道题一样链接http://www.cnblogs.com/zzuli2sjy/p/4943774.html 代码: 1 #include<stdio.h> 2 #include ...

  4. SOFA 通信

    私有通信协议设计: 我们的分布式架构,所需要的内部通信模块,采用了私有协议来设计和研发. 可以有效地利用协议里的各个字段 灵活满足各种通信功能需求:比如 CRC 校验,Server Fail-Fast ...

  5. Ubuntu安装Git及Git配置

    1.检查Git是否已经安装 使用git version,若不显示版本号则Git未安装,下面是我安装好后显示的版本号 2.安装Git sudo apt-get install git Centos使用y ...

  6. Sublime Text 3结合Chrome实现网页的自动刷新

    我们在编写前端代码时,写好一部分代码时想要看一看代码的实现效果,每次都要手动刷新会非常麻烦,神器来了,LiveReload插件实现网页的实时刷新,操作方法如下: 1. 官网下载Sublime Text ...

  7. Theoretically Principled Trade-off between Robustness and Accuracy

    目录 概 主要内容 符号说明 Error Classification-calibrated surrogate loss 引理2.1 定理3.1 定理3.2 由此导出的TRADES算法 实验概述 代 ...

  8. centos一步一步搭建tendermint

    一.必要条件 1.安装go 请根据官方文档安装:https://golang.org/doc/install 要特别注意的是: /etc/profile 添加以下内容: export GOPATH=/ ...

  9. 使用.NET 6开发TodoList应用(22)——实现缓存

    系列导航及源代码 使用.NET 6开发TodoList应用文章索引 需求 有的时候为了减少客户端请求相同资源的逻辑重复执行,我们会考虑使用一些缓存的方式,在.NET 6中,我们可以借助框架提供的中间件 ...

  10. Pytest_配置文件-pytest.ini(4)

    pytest配置文件可以改变pytest的默认运行方式,它是一个固定的文件名称pytest.ini. 存放路径为项目的根目录 解决中文报错 在讲解配置文件的可用参数前,我们先解决一个高概率会遇到的问题 ...