首先编写一个公共的脚本,便于整个项目方便调用请求,这里就命名为common.js ,代码如下:
(function () {
let common = {
//访问后台服务
ajax: function (options, callback) {
$.ajax({
url: options.url,
data: options.data || {},
type: options.type || 'get',
dataType: 'json',
processData: typeof (options.processData) == 'undefined' ? true : options.processData, //用于对data参数进行序列化处理
cache: typeof (options.cache) == 'undefined' ? true : options.cache, //设置为false将不会从浏览器缓存中加载请求信息
contentType: typeof (options.contentType) == 'undefined' ? 'application/x-www-form-urlencoded; charset=UTF-8' : options.contentType,
success: function (res) {
callback(res);
},
error: function (res) {
alert('网络异常');
callback(res)
}
})
},
//向阿里OSS发起请求
uploadOssFiles(options,callback) {
let self = this;
let formData = new FormData();
formData.append('OSSAccessKeyId', options.data.accessid) //拥有者的Access Key I
formData.append('policy', options.data.policy) //policy规定了请求的表单域的合法性
formData.append('signature', options.data.signature) //根据Access Key Secret和policy计算的签名信息,OSS验证该签名信息从而验证该Post请求的合法性
//---以上都是阿里的认证策略
formData.append("key", options.data.fullPathName); //文件名字,可设置路径
formData.append("success_action_status", '200'); // 让服务端返回200,不然,默认会返回204
formData.append("callback", options.data.callback);
formData.append('file', options.data.file); //上传的file文件必须拼接放在最后面(很重要)
let params = {
url: options.data.host,
type: 'post',
data: formData,
processData: false, //默认true,设置为 false,不需要进行序列化处理
cache: false, //设置为false将不会从浏览器缓存中加载请求信息
contentType: false, //避免服务器不能正常解析文件
}
this.tipMessage()
common.ajax(params, function (res) {
layer.close(self.loading)
if(res && res.Status && res.Status.toLowerCase() == 'ok'){
layer.msg('上传成功', {icon: 1, time: 2500, offset: ['300px', '600px']});
}else{
layer.msg('上传失败', {icon: 2, time: 2500, offset: ['300px', '600px']});
}
callback(res)
})
},
//上传提示语
tipMessage() {
this.loading = layer.load(2, {
content: '上传中...',
success: function (layero) {
layero.find('.layui-layer-content').css({
'padding-top': '39px',
'width': '60px',
'left': '-200px'
});
}
})
},
}
window.common = common;
})();
OK,收工!如果可以实现记得点赞分享,谢谢老铁~