最近项目因为前期我未接触项目, 后期后台需要验证每个接口带token参数验证用户是否过期
通常我们在ajax success中对返回参数做处理。 但是封装js需要每个页面去调用,不可能在每个页面去对token是否过期做验证。
这里用到 jquery ajax中的dataFilter, 这里首先对ajax几种回调排一个序就很清楚了
** beforeSend: 在发送请求之前调用,并且传入一个XMLHttpRequest作为参数。 error :在请求出错时调用。传入XMLHttpRequest对象,描述错误类型的字符串以及一个异常对象(如果有的话) dataFilter: 在请求成功之后调用。传入返回的数据以及”dataType”参数的值。并且必须返回新的数据(可能是处理过的)传递给success回调函数。 success: 当请求之后调用。传入返回后的数据,以及包含成功代码的字符串。 complete: 当请求完成之后调用这个函数,无论成功或失败。传入XMLHttpRequest对象,以及一个包含成功或错误代码的字符串。 **
这里我们用到的就 dataFilter这个函数。
具体代码如下:
jQuery.extend({ newAjax: function(option) { var accessToken = localStorage.getItem('accessToken'); var args = { type: "get", cache: false, dataType: "json", //默认后不显示图片上传中 data: null, contentType: 'application/json', dataFilter: function(d) { // 处理返回参数,token 是否过期失效 d = JSON.parse(d) //console.log(d) if(d.error == 'invalid_token') { // TODO 这里是token失效的情况 跳登录页面; return; } d = JSON.stringify(d) return d; }, error: function(d) { console.log(d) } } $.each(option, function(key, value) { args[key] = value; }); if(!args.url || args.url == undefined) { throw new Error('ajax参数错误!'); }; args.url = /^http/.test(args.url) ? args.url : API_SERVER + args.url; //是否以http开头 args.url = /\?/g.test(args.url) ? args.url + "&access_token=" + accessToken : //TODO 加token args.url + "?access_token=" + accessToken; //TODO 加token $.ajax(args); } })具体页面调用如下:
$.newAjax({ url: url, type: 'post', data: JSON.stringify(param), success: function(d) { console.log(d); if(d.success == true) { } else { } }, error: function(d) { } })大致就是这样, 这次的封装也是对自己接受应急需求时的一个提升, 希望可以分享出来