关于WebUploader上传文件插件的headers.token拦截问题
WebUploader 事件说明
uploadBeforeSend |
|
当某个文件的分块在发送前触发,主要用来询问是否要添加附带参数,大文件在开起分片上传的前提下此事件可能会触发多次。 |
angularjs中添加一个拦截器,比如说一下例子:
//增加一个提交token sxApp.factory('sessionInjector', function ($rootScope,locals) { // Service logic$rootScope.sysuser.token var sessionInjector = { request: function(config) { config.headers.token = locals.getObject("accessToken"); if(config.method=="POST"){ ... ... } return config; } }; return sessionInjector; });
这里的 headers.token 对WebUploader插件不起作用,这时就需要在WebUploader中对header进行配置,找到webuploader.js中的uploadBeforeSend 方法,在上传操作方法_doSend 中定义的header中,添加headers.token = GlobalConfig.token;这一句代码
/** * @event uploadBeforeSend * @param {Object} object * @param {Object} data 默认的上传参数,可以扩展此对象来控制上传参数。 * @param {Object} headers 可以扩展此对象来控制上传头部。 * @description 当某个文件的分块在发送前触发,主要用来询问是否要添加附带参数,大文件在开起分片上传的前提下此事件可能会触发多次。 * @for Uploader */ // 做上传操作。 _doSend: function( block ) { var me = this, owner = me.owner, opts = me.options, file = block.file, tr = new Transport( opts ), data = $.extend({}, opts.formData ), headers = $.extend({}, opts.headers ), requestAccept, ret; headers.token = GlobalConfig.token; block.transport = tr; tr.on( 'destroy', function() { delete block.transport; me._popBlock( block ); Base.nextTick( me.__tick ); });
注意:由于angularjs和jQuery之间传值比较麻烦,在这里就申明了一个全局变量GlobalConfig.token,在angularjs和jQuery之间传值。
在config.js中申明一个全局变量:
function GlobalConfig(){ } GlobalConfig.token=""; (function(){ })();
在app.js中传值:
GlobalConfig.token = locals.getObject("accessToken");