uniapp 阿里云oss 上传及遇到的问题解决

uniapp开发移动APP
h5端的可以使用 ali-oss来实现文件的上传
app端 window许多对象不能使用 就意味着pc的插件组件 在app端不一定适用

1.前端实现oss直传
1.通过uni自带的uploadFile来上传文件

1. import Oss from '@/js/oss.js'; 
2.  
3. uni.uploadFile({ 
4.     url: 'https://bucketname.aliyuncs.com',//输入你的bucketname.endpoint 
5.     filePath: this.$refs.uUpload.lists[0].url,//文件路径可以是临时路径 blob 
6.     fileType: 'image', 
7.     name: 'file', 
8.     formData: { 
9.         name: nameStr, 
10.         key: nameStr, 
11.         policy: Oss.policy, // policy 
12.         OSSAccessKeyId: Oss.OSSAccessKeyId, // 输入你的AccessKeyId 
13.         success_action_status: '200', 
14.         signature: Oss.signature // signature 
15.     }, 
16.     success: res => { 
17.         console.log(res) 
18.     } 
19. }) 

2.Oss 加密算法文件
 

1. /** 
2.   * base 64 
3.   */ 
4.   
5.  var Base64 = { 
6.         // private property 
7.         _keyStr : "ABCDEFGHIJKLMNOPQRSTUVWXYZabcdefghijklmnopqrstuvwxyz0123456789+/=", 
8.         // public method for encoding 
9.         encode : function (input) { 
10.             var output = ""; 
11.             var chr1, chr2, chr3, enc1, enc2, enc3, enc4; 
12.             var i = 0; 
13.  
14.             input = Base64._utf8_encode(input); 
15.  
16.             while (i < input.length) { 
17.  
18.                 chr1 = input.charCodeAt(i++); 
19.                 chr2 = input.charCodeAt(i++); 
20.                 chr3 = input.charCodeAt(i++); 
21.  
22.                 enc1 = chr1 >> 2; 
23.                 enc2 = ((chr1 & 3) << 4) | (chr2 >> 4); 
24.                 enc3 = ((chr2 & 15) << 2) | (chr3 >> 6); 
25.                 enc4 = chr3 & 63; 
26.  
27.                 if (isNaN(chr2)) { 
28.                     enc3 = enc4 = 64; 
29.                 } else if (isNaN(chr3)) { 
30.                     enc4 = 64; 
31.                 } 
32.  
33.                 output = output + 
34.                 this._keyStr.charAt(enc1) + this._keyStr.charAt(enc2) + 
35.                 this._keyStr.charAt(enc3) + this._keyStr.charAt(enc4); 
36.             } 
37.             return output; 
38.         }, 
39.         // public method for decoding 
40.         decode : function (input) { 
41.             var output = ""; 
42.             var chr1, chr2, chr3; 
43.             var enc1, enc2, enc3, enc4; 
44.             var i = 0; 
45.             input = input.replace(/[^A-Za-z0-9\+\/\=]/g, ""); 
46.             while (i < input.length) { 
47.                 enc1 = this._keyStr.indexOf(input.charAt(i++)); 
48.                 enc2 = this._keyStr.indexOf(input.charAt(i++)); 
49.                 enc3 = this._keyStr.indexOf(input.charAt(i++)); 
50.                 enc4 = this._keyStr.indexOf(input.charAt(i++)); 
51.  
52.                 chr1 = (enc1 << 2) | (enc2 >> 4); 
53.                 chr2 = ((enc2 & 15) << 4) | (enc3 >> 2); 
54.                 chr3 = ((enc3 & 3) << 6) | enc4; 
55.                 output = output + String.fromCharCode(chr1); 
56.                 if (enc3 != 64) { 
57.                     output = output + String.fromCharCode(chr2); 
58.                 } 
59.                 if (enc4 != 64) { 
60.                     output = output + String.fromCharCode(chr3); 
61.                 } 
62.             } 
63.             output = Base64._utf8_decode(output); 
64.             return output; 
65.         }, 
66.         // private method for UTF-8 encoding 
67.         _utf8_encode : function (string) { 
68.             string = string.replace(/\r\n/g,"\n"); 
69.             var utftext = ""; 
70.  
71.             for (var n = 0; n < string.length; n++) { 
72.  
73.                 var c = string.charCodeAt(n); 
74.  
75.                 if (c < 128) { 
76.                     utftext += String.fromCharCode(c); 
77.                 } 
78.                 else if((c > 127) && (c < 2048)) { 
79.                     utftext += String.fromCharCode((c >> 6) | 192); 
80.                     utftext += String.fromCharCode((c & 63) | 128); 
81.                 } 
82.                 else { 
83.                     utftext += String.fromCharCode((c >> 12) | 224); 
84.                     utftext += String.fromCharCode(((c >> 6) & 63) | 128); 
85.                     utftext += String.fromCharCode((c & 63) | 128); 
86.                 } 
87.             } 
88.  
89.             return utftext; 
90.         }, 
91.         // private method for UTF-8 decoding 
92.         _utf8_decode : function (utftext) { 
93.             var string = ""; 
94.             var i = 0; 
95.             var c = c1 = c2 = 0; 
96.  
97.             while ( i < utftext.length ) { 
98.  
99.                 c = utftext.charCodeAt(i); 
100.  
101.                 if (c < 128) { 
102.                     string += String.fromCharCode(c); 
103.                     i++; 
104.                 } 
105.                 else if((c > 191) && (c < 224)) { 
106.                     c2 = utftext.charCodeAt(i+1); 
107.                     string += String.fromCharCode(((c & 31) << 6) | (c2 & 63)); 
108.                     i += 2; 
109.                 } 
110.                 else { 
111.                     c2 = utftext.charCodeAt(i+1); 
112.                     c3 = utftext.charCodeAt(i+2); 
113.                     string += String.fromCharCode(((c & 15) << 12) | ((c2 & 63) << 6) | (c3 & 63)); 
114.                     i += 3; 
115.                 } 
116.             } 
117.             return string; 
118.         } 
119.  
120.     } 
121. /* 
122.  * Crypto-JS v1.1.0 
123.  * http://code.google.com/p/crypto-js/ 
124.  * Copyright (c) 2009, Jeff Mott. All rights reserved. 
125.  * http://code.google.com/p/crypto-js/wiki/License 
126.  */ 
127. var base64map = "ABCDEFGHIJKLMNOPQRSTUVWXYZabcdefghijklmnopqrstuvwxyz0123456789+/"; 
128. // Global Crypto object 
129. var Crypto = {}; 
130. // Crypto utilities 
131. var util = Crypto.util = { 
132.     // Bit-wise rotate left 
133.     rotl: function (n, b) { 
134.         return (n << b) | (n >>> (32 - b)); 
135.     }, 
136.     // Bit-wise rotate right 
137.     rotr: function (n, b) { 
138.         return (n << (32 - b)) | (n >>> b); 
139.     }, 
140.     // Swap big-endian to little-endian and vice versa 
141.     endian: function (n) { 
142.         // If number given, swap endian 
143.         if (n.constructor == Number) { 
144.             return util.rotl(n,  8) & 0x00FF00FF | 
145.                    util.rotl(n, 24) & 0xFF00FF00; 
146.         } 
147.         // Else, assume array and swap all items 
148.         for (var i = 0; i < n.length; i++) 
149.             n[i] = util.endian(n[i]); 
150.         return n; 
151.     }, 
152.     // Generate an array of any length of random bytes 
153.     randomBytes: function (n) { 
154.         for (var bytes = []; n > 0; n--) 
155.             bytes.push(Math.floor(Math.random() * 256)); 
156.         return bytes; 
157.     }, 
158.     // Convert a string to a byte array 
159.     stringToBytes: function (str) { 
160.         var bytes = []; 
161.         for (var i = 0; i < str.length; i++) 
162.             bytes.push(str.charCodeAt(i)); 
163.         return bytes; 
164.     }, 
165.     // Convert a byte array to a string 
166.     bytesToString: function (bytes) { 
167.         var str = []; 
168.         for (var i = 0; i < bytes.length; i++) 
169.             str.push(String.fromCharCode(bytes[i])); 
170.         return str.join(""); 
171.     }, 
172.     // Convert a string to big-endian 32-bit words 
173.     stringToWords: function (str) { 
174.         var words = []; 
175.         for (var c = 0, b = 0; c < str.length; c++, b += 8) 
176.             words[b >>> 5] |= str.charCodeAt(c) << (24 - b % 32); 
177.         return words; 
178.     }, 
179.     // Convert a byte array to big-endian 32-bits words 
180.     bytesToWords: function (bytes) { 
181.         var words = []; 
182.         for (var i = 0, b = 0; i < bytes.length; i++, b += 8) 
183.             words[b >>> 5] |= bytes[i] << (24 - b % 32); 
184.         return words; 
185.     }, 
186.     // Convert big-endian 32-bit words to a byte array 
187.     wordsToBytes: function (words) { 
188.         var bytes = []; 
189.         for (var b = 0; b < words.length * 32; b += 8) 
190.             bytes.push((words[b >>> 5] >>> (24 - b % 32)) & 0xFF); 
191.         return bytes; 
192.     }, 
193.     // Convert a byte array to a hex string 
194.     bytesToHex: function (bytes) { 
195.         var hex = []; 
196.         for (var i = 0; i < bytes.length; i++) { 
197.             hex.push((bytes[i] >>> 4).toString(16)); 
198.             hex.push((bytes[i] & 0xF).toString(16)); 
199.         } 
200.         return hex.join(""); 
201.     }, 
202.     // Convert a hex string to a byte array 
203.     hexToBytes: function (hex) { 
204.         var bytes = []; 
205.         for (var c = 0; c < hex.length; c += 2) 
206.             bytes.push(parseInt(hex.substr(c, 2), 16)); 
207.         return bytes; 
208.     }, 
209.     // Convert a byte array to a base-64 string 
210.     bytesToBase64: function (bytes) { 
211.         // Use browser-native function if it exists   
212.         // app打包后 oss 403  注释这一行就好了 
213.         // if (typeof btoa == "function") return btoa(util.bytesToString(bytes)); 
214.         var base64 = [], 
215.             overflow; 
216.         for (var i = 0; i < bytes.length; i++) { 
217.             switch (i % 3) { 
218.                 case 0: 
219.                     base64.push(base64map.charAt(bytes[i] >>> 2)); 
220.                     overflow = (bytes[i] & 0x3) << 4; 
221.                     break; 
222.                 case 1: 
223.                     base64.push(base64map.charAt(overflow | (bytes[i] >>> 4))); 
224.                     overflow = (bytes[i] & 0xF) << 2; 
225.                     break; 
226.                 case 2: 
227.                     base64.push(base64map.charAt(overflow | (bytes[i] >>> 6))); 
228.                     base64.push(base64map.charAt(bytes[i] & 0x3F)); 
229.                     overflow = -1; 
230.             } 
231.         } 
232.         // Encode overflow bits, if there are any 
233.         if (overflow != undefined && overflow != -1) 
234.             base64.push(base64map.charAt(overflow)); 
235.         // Add padding 
236.         while (base64.length % 4 != 0) base64.push("="); 
237.         return base64.join(""); 
238.     }, 
239.     // Convert a base-64 string to a byte array 
240.     base64ToBytes: function (base64) { 
241.         // Use browser-native function if it exists 
242.         if (typeof atob == "function") return util.stringToBytes(atob(base64)); 
243.         // Remove non-base-64 characters 
244.         base64 = base64.replace(/[^A-Z0-9+\/]/ig, ""); 
245.         var bytes = []; 
246.         for (var i = 0; i < base64.length; i++) { 
247.             switch (i % 4) { 
248.                 case 1: 
249.                     bytes.push((base64map.indexOf(base64.charAt(i - 1)) << 2) | 
250.                                (base64map.indexOf(base64.charAt(i)) >>> 4)); 
251.                     break; 
252.                 case 2: 
253.                     bytes.push(((base64map.indexOf(base64.charAt(i - 1)) & 0xF) << 4) | 
254.                                (base64map.indexOf(base64.charAt(i)) >>> 2)); 
255.                     break; 
256.                 case 3: 
257.                     bytes.push(((base64map.indexOf(base64.charAt(i - 1)) & 0x3) << 6) | 
258.                                (base64map.indexOf(base64.charAt(i)))); 
259.                     break; 
260.             } 
261.         } 
262.         return bytes; 
263.     } 
264. }; 
265. // Crypto mode namespace 
266. Crypto.mode = {}; 
267. var util = Crypto.util; 
268. // Public API 
269. var SHA1 = Crypto.SHA1 = function (message, options) { 
270.     var digestbytes = util.wordsToBytes(SHA1._sha1(message)); 
271.     return options && options.asBytes ? digestbytes : 
272.            options && options.asString ? util.bytesToString(digestbytes) : 
273.            util.bytesToHex(digestbytes); 
274. }; 
275. // The core 
276. SHA1._sha1 = function (message) { 
277.     var m  = util.stringToWords(message), 
278.         l  = message.length * 8, 
279.         w  =  [], 
280.         H0 =  1732584193, 
281.         H1 = -271733879, 
282.         H2 = -1732584194, 
283.         H3 =  271733878, 
284.         H4 = -1009589776; 
285.     // Padding 
286.     m[l >> 5] |= 0x80 << (24 - l % 32); 
287.     m[((l + 64 >>> 9) << 4) + 15] = l; 
288.     for (var i = 0; i < m.length; i += 16) { 
289.         var a = H0, 
290.             b = H1, 
291.             c = H2, 
292.             d = H3, 
293.             e = H4; 
294.         for (var j = 0; j < 80; j++) { 
295.             if (j < 16) w[j] = m[i + j]; 
296.             else { 
297.                 var n = w[j-3] ^ w[j-8] ^ w[j-14] ^ w[j-16]; 
298.                 w[j] = (n << 1) | (n >>> 31); 
299.             } 
300.             var t = ((H0 << 5) | (H0 >>> 27)) + H4 + (w[j] >>> 0) + ( 
301.                      j < 20 ? (H1 & H2 | ~H1 & H3) + 1518500249 : 
302.                      j < 40 ? (H1 ^ H2 ^ H3) + 1859775393 : 
303.                      j < 60 ? (H1 & H2 | H1 & H3 | H2 & H3) - 1894007588 : 
304.                               (H1 ^ H2 ^ H3) - 899497514); 
305.             H4 =  H3; 
306.             H3 =  H2; 
307.             H2 = (H1 << 30) | (H1 >>> 2); 
308.             H1 =  H0; 
309.             H0 =  t; 
310.         } 
311.         H0 += a; 
312.         H1 += b; 
313.         H2 += c; 
314.         H3 += d; 
315.         H4 += e; 
316.     } 
317.     return [H0, H1, H2, H3, H4]; 
318.  
319. }; 
320. // Package private blocksize 
321. SHA1._blocksize = 16; 
322. /* 
323.  * Crypto-JS v1.1.0 
324.  * http://code.google.com/p/crypto-js/ 
325.  * Copyright (c) 2009, Jeff Mott. All rights reserved. 
326.  * http://code.google.com/p/crypto-js/wiki/License 
327.  */ 
328. var util = Crypto.util; 
329.  
330. Crypto.HMAC = function (hasher, message, key, options) { 
331.  
332.     // Allow arbitrary length keys 
333.     key = key.length > hasher._blocksize * 4 ? 
334.           hasher(key, { asBytes: true }) : 
335.           util.stringToBytes(key); 
336.  
337.     // XOR keys with pad constants 
338.     var okey = key, 
339.         ikey = key.slice(0); 
340.     for (var i = 0; i < hasher._blocksize * 4; i++) { 
341.         okey[i] ^= 0x5C; 
342.         ikey[i] ^= 0x36; 
343.     } 
344.  
345.     var hmacbytes = hasher(util.bytesToString(okey) + 
346.                            hasher(util.bytesToString(ikey) + message, { asString: true }), 
347.                            { asBytes: true }); 
348.     return options && options.asBytes ? hmacbytes : 
349.            options && options.asString ? util.bytesToString(hmacbytes) : 
350.            util.bytesToHex(hmacbytes); 
351.  
352. }; 
353.  
354.  
355.  
356.  
357. const accessid= 'xxxxxxxxxxxxxxx'; //aliyun id 
358. const accesskey= 'xxxxxxxxxxxxxxxxxxxxxxxxxx';//aliyun key 
359. const host = 'https://ruiscloud.oss-cn-zhangjiakou.aliyuncs.com'; 
360.  
361.  
362. let now ,timestamp = Date.parse(new Date()) / 1000;  
363.  
364. var policyText = { 
365.     "expiration": "2031-10-01T12:00:00.000Z", //设置该Policy的失效时间，超过这个失效时间之后，就没有办法通过这个policy上传文件了 
366.     "conditions": [ 
367.     ["content-length-range", 0, 1048576000] // 设置上传文件的大小限制 
368.     ] 
369. }; 
370.  
371. var policyBase64 = Base64.encode(JSON.stringify(policyText)) 
372. var message = policyBase64 
373. var bytes = Crypto.HMAC(Crypto.SHA1, message, accesskey, { asBytes: true }) ; 
374. var signature = Crypto.util.bytesToBase64(bytes); 
375.  
376. export default { 
377.     signature, 
378.     policy:policyBase64, 
379.     OSSAccessKeyId:accessid 
380. } 

2.通过后端接口的形式
这种方式就不多说了主要是跟后端 字段约定，按照相应的进行传值就行。

遇到的问题
h5上传ok 打包成app上传阿里云就报403 问题参考
答：注释if (typeof btoa == "function") return btoa(util.bytesToString(bytes));
在Crypto.util.bytesToBase64的工具函数中