标签:
github地址:https://github.com/oncoy/alone
有问题请邮箱联系:oncoy5@163.com
针对AJAX请求做个整理。让AJAX变得模块化。统一管理。调用。方便测试。简称:AJAX模块化分割器(工具),就问还有谁~还有谁~
回调执行顺序:前端req -> trade模版req -> 发送请求并执行 loading -> trade模版res -> 前端res
为了解决什么问题而存在:
1.前后端交互协调是大坑。前后端协调传递的json数据的时候,如果前后端没有任何一方先提供好接口,都0基础同时开发。那么问题来了。你就会遇到数据格式过不统一。那么你的trade模版可由后端自己维护。我们前端就不用管他到底返回什么接口了。我们只把接口测试文档写在里面了。到后期合并接口的时候。让后端或则前端自己进行修改就行了。就不用去改变页面业务代码的数据结构了。
2.请求接口模块化。接口文档按照不同的模块分离出来。你需要那个模块的接口。配置那个接口路径。就可以调用了。方便统一管理和修改
下面省略一千条问题解答~
更多方式请参照demo
/*配置路径*/ alone.config({ //最开始的路径都是以alone.js文件存放路径为基准的相对路径操作。" ../ " 返回上一级 //这是配置和绑定请求的路径 - 比如:ajaxAdmin.js control: { ‘model‘: ‘../ajaxModel/model.js‘ // —— 当前路径都是以alone.js存放路径为基准的 , ‘model2‘: ‘../ajaxModel/model2.js‘ } }); //--------------------------------- 调用 --------------------------------- /* * 调用方式一 : 走路由控制 */ //这里我们测试。所以我们只调用开启的测试模式的接口 alone.on(‘model/getAlone1‘, { ‘name1‘: ‘a‘, ‘age‘: 17 }, function (data, res) { //回调函数执行 console.log(data);//最后生成的对象数据 console.log(res);//最后生成的对象数据 console.log(this);//当前域 }, this); /* * 调用方式二 : 直接访问路径。不走路由控制 */ alone.on({ url: ‘https://www.baidu.com/‘, type: ‘post‘ }, ‘name1=a&age=17‘, function (data, res) { //回调函数执行 console.log(data);//最后生成的对象数据 console.log(res);//最后生成的对象数据 console.log(this);//当前域 }, this, ‘jsonp‘);
/* * 缺参模型:———— 常用模式 * * 1、请求别名 * 2、响应回调参数。 - res为响应对象 * 3、请求路径。 - 请求路径 * 4、请求类型。- 默认 GET * 5、测试用。 - 值为‘true‘ 。不做真正的提交。直接进入返回回调 */ trade(‘getAlone1‘, function (res) { //-- res:响应对象 /* 设置并且执行回调 - req.data : 返回参数 */ res.setData({ name: ‘admin‘, age: 16 });//测试的时候自己设置返回数据。然后后端自己根据这里的模版。修改返回值 }, ‘a.html‘, ‘post‘, true);
标签:
原文地址:http://www.cnblogs.com/oncoy/p/4775267.html