class IdaUploader { constructor (settings) { this.options = { url: '', formData: null, headers: {}, //自定义headers withCredentials:false,//支持发送 cookie 凭证信息 isPreview: true, //是否开启本地预览 previewData: null, maxSize: 0, //允许上传的文件最大字节,0为不限制 acceptType: [], //允许上传的文件类型,如'image/jpeg' showMsgFn: null, onStart: null, onProgress: null, onPreview: null, onSuccess: null, onFailure: null, xhrStatus:200, //默认上传成功是200 readyState:4, xmlError:null, typeError:null, limitError:null }; Object.assign(this.options, settings); this[this.options.isPreview ? 'preview' : 'uploader']() } triggerFunc(func) { if (typeof(func)==='function') { return func.bind(this); } else { console.warn(func + 'is not a function!'); return function() {}; } } showMsg (msg) { if (typeof(this.options.showMsgFn)=='function') { this.options.showMsgFn(msg); } else { console.log(msg); } } check (file) { if(Array.isArray(file)){ for(let key in file){ if (this.options.maxSize && (file[key].size > this.options.maxSize)) { this.showMsg(this.options.limitError); return false; } if (this.options.acceptType.length && this.options.acceptType.indexOf(file[key].type) === -1) { this.showMsg(this.options.typeError); return false; } } }else{ if (this.options.maxSize && (file.size > this.options.maxSize)) { this.showMsg(this.options.limitError); return false; } if (this.options.acceptType.length && this.options.acceptType.indexOf(file.type) === -1) { this.showMsg(this.options.typeError); return false; } } return true; } preview () { const file = Array.from(this.options.previewData); if (!this.check(file)) return; let promArray = [] file.map(item=>{ let temp = new Promise((resolve,reject)=>{ const reader = new FileReader(); reader.readAsDataURL(item); reader.onload = (e) => { this.uploader(); resolve(e) } }) promArray.push(temp) }); Promise.all(promArray).then(res=>{ console.log(res) let out = []; if(res){ res.map(item=>{ out.push(item.target.result) }) } this.triggerFunc.call(this.options, this.options.onPreview)(out); }) } uploader () { const xhr = new XMLHttpRequest(); let options = this.options; let formData = options.formData; if (xhr.upload) { xhr.upload.addEventListener('progress', (e) => { this.triggerFunc.call(options, options.onProgress)(formData, e.loaded, e.total); }, false); xhr.onreadystatechange = (e) => { if (xhr.readyState === 4) { if (xhr.status === options.xhrState) { this.triggerFunc.call(options, options.onSuccess)(formData, xhr.responseText); } else { this.triggerFunc.call(options, options.onFailure)(formData, xhr.responseText); } } }; xhr.withCredentials = options.withCredentials; xhr.open('POST', options.url, true); // headers for (let key in options.headers) { xhr.setRequestHeader(key, options.headers[key]) } this.triggerFunc.call(options, options.onStart)(); xhr.send(formData); if(options.clearInput){ options.$el.value = '' ; } } else { this.showMsg(this.xmlError) } } } export default IdaUploader;