阿里云 OSS 上传插件layui-aliossuploader升级为带进度条及单项回调

最近有个项目，要上传无数素材到阿里云，找了很多layui的上传组件，感觉要么复杂化，要么就是没带进度条，layui官方的进度条是带了，但是没有上传到阿里云oss的，而且在折腾成功之前，layui的file还在前面，截止2022年11月8日，layui官方才更新了，把file放到表单域的后面。 但是我是没有多少去折腾官方那种上传oss的。后面找到了这个layui-aliossuploader的第三方组件，一番折腾，感觉蛮好。美中不足的是，没有进度条。
去作者blog查看，作者也说不会… 经历痛苦的搜索之后…思来想去，不就是ajax 嘛，看能否从这入手，加上这个进度条。。。。 debug一下午后，奇迹般搞定了。

然后再回过头来看，我靠，如此简单？真的是自己太菜了!
搁这保存起来警示警示吧。
带进度条的 aliossuploader.js

layui.extend({
   }).define(['layer', 'upload','element'], function(exports) {
   
	var $ = layui.$,
		layer = layui.layer,
		upload = layui.upload,
		element=layui.element, //新加
		allUploaded = {
   },
		policyFailed = null,
		itemUploaded =null,
		uploadData = [],
		prefixPath,
		layerTitle,
		filesss = {
   },
		successCount = 0,
		uploadCount = 0,
		filesListView = null,
		multiple = false,
		multipleFileArray = [],
		multipleFileKeyArray = [],
		uplaod = layui.upload;
	//加载样式

	var Class = function(options) {
   
		var that = this;
		that.options = options;
		that.init();
	};

	Class.prototype.init = function() {
   
		var that = this,
			options = that.options;
		if (options.layerArea) {
   
			layerArea = options.layerArea;
		} else {
   
			layerArea = 'auto';
		}
		if (options.multiple) {
   
			multiple = true;
		}
		if (!that.strIsNull(that.options.fileType)) {
   
			fileType = that.options.fileType;
		}else{
   
			fileType = 'file';
		}
		if (!that.strIsNull(that.options.httpStr)) {
   
			httpStr = that.options.httpStr;
		} else {
   
			httpStr = 'https';
		}
		if (!that.strIsNull(that.options.policyFiled)) {
   
			policyFiled = that.options.policyFiled;
		} else {
   
			policyFiled = 'policy';
		}
		if (!that.strIsNull(that.options.accessidFiled)) {
   
			accessidFiled = that.options.accessidFiled;
		} else {
   
			accessidFiled = 'accessid';
		}
		if (!that.strIsNull(that.options.codeFiled)) {
   
			codeFiled = that.options.codeFiled;
		} else {
   
			codeFiled = '';
		}
		if (!that.strIsNull(that.options.codeStatus)) {
   
			codeStatus = that.options.codeStatus;
		} else {
   
			codeStatus = 0;
		}
		if (!that.strIsNull(that.options.signatureFiled)) {
   
			signatureFiled = that.options.signatureFiled;
		} else {
   
			signatureFiled = 'signature';
		}
		if (!that.strIsNull(that.options.region)) {
   
			region = that.options.region;
		}
		if (!that.strIsNull(that.options.prefixPath)) {
   
			prefixPath = that.options.prefixPath;
		} else {
   
			prefixPath = '';
		}
		if (!that.strIsNull(that.options.policyUrl)) {
   
			policyUrl = that.options.policyUrl;
		}
		if (typeof that.options.policyData != 'undefined') {
   
			policyData = that.options.policyData;
		} else {
   
			policyData = {
   };
		}
		if (
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
99
100
101
102
103
104
105
106
107
108
109
110
111
112
113
114
115
116
117
118
119