襄陽網站定制開發公司分享uniapp app直接上傳文件到阿里云oss中完整案例

1. 創建簽名文件

   common/bundle.js

2. //bundle.js
    
    
   var base64map = "ABCDEFGHIJKLMNOPQRSTUVWXYZabcdefghijklmnopqrstuvwxyz0123456789+/";
    
   // Global Crypto object
   var Crypto = {};
    
   // Crypto utilities
   var util = Crypto.util = {
    
       // Bit-wise rotate left
       rotl: function (n, b) {
           return (n << b) | (n >>> (32 - b));
       },
    
       // Bit-wise rotate right
       rotr: function (n, b) {
           return (n << (32 - b)) | (n >>> b);
       },
    
       // Swap big-endian to little-endian and vice versa
       endian: function (n) {
    
           // If number given, swap endian
           if (n.constructor == Number) {
               return util.rotl(n,  8) & 0x00FF00FF |
                      util.rotl(n, 24) & 0xFF00FF00;
           }
    
           // Else, assume array and swap all items
           for (var i = 0; i < n.length; i++)
               n[i] = util.endian(n[i]);
           return n;
    
       },
    
       // Generate an array of any length of random bytes
       randomBytes: function (n) {
           for (var bytes = []; n > 0; n--)
               bytes.push(Math.floor(Math.random() * 256));
           return bytes;
       },
    
       // Convert a string to a byte array
       stringToBytes: function (str) {
           var bytes = [];
           for (var i = 0; i < str.length; i++)
               bytes.push(str.charCodeAt(i));
           return bytes;
       },
    
       // Convert a byte array to a string
       bytesToString: function (bytes) {
           var str = [];
           for (var i = 0; i < bytes.length; i++)
               str.push(String.fromCharCode(bytes[i]));
           return str.join("");
       },
    
       // Convert a string to big-endian 32-bit words
       stringToWords: function (str) {
           var words = [];
           for (var c = 0, b = 0; c < str.length; c++, b += 8)
               words[b >>> 5] |= str.charCodeAt(c) << (24 - b % 32);
           return words;
       },
    
       // Convert a byte array to big-endian 32-bits words
       bytesToWords: function (bytes) {
           var words = [];
           for (var i = 0, b = 0; i < bytes.length; i++, b += 8)
               words[b >>> 5] |= bytes[i] << (24 - b % 32);
           return words;
       },
    
       // Convert big-endian 32-bit words to a byte array
       wordsToBytes: function (words) {
           var bytes = [];
           for (var b = 0; b < words.length * 32; b += 8)
               bytes.push((words[b >>> 5] >>> (24 - b % 32)) & 0xFF);
           return bytes;
       },
    
       // Convert a byte array to a hex string
       bytesToHex: function (bytes) {
           var hex = [];
           for (var i = 0; i < bytes.length; i++) {
               hex.push((bytes[i] >>> 4).toString(16));
               hex.push((bytes[i] & 0xF).toString(16));
           }
           return hex.join("");
       },
    
       // Convert a hex string to a byte array
       hexToBytes: function (hex) {
           var bytes = [];
           for (var c = 0; c < hex.length; c += 2)
               bytes.push(parseInt(hex.substr(c, 2), 16));
           return bytes;
       },
    
       // Convert a byte array to a base-64 string
       bytesToBase64: function (bytes) {
    
           // Use browser-native function if it exists
           // if (typeof btoa == "function") return btoa(util.bytesToString(bytes));
    
           var base64 = [],
               overflow;
    
           for (var i = 0; i < bytes.length; i++) {
               switch (i % 3) {
                   case 0:
                       base64.push(base64map.charAt(bytes[i] >>> 2));
                       overflow = (bytes[i] & 0x3) << 4;
                       break;
                   case 1:
                       base64.push(base64map.charAt(overflow | (bytes[i] >>> 4)));
                       overflow = (bytes[i] & 0xF) << 2;
                       break;
                   case 2:
                       base64.push(base64map.charAt(overflow | (bytes[i] >>> 6)));
                       base64.push(base64map.charAt(bytes[i] & 0x3F));
                       overflow = -1;
               }
           }
    
           // Encode overflow bits, if there are any
           if (overflow != undefined && overflow != -1)
               base64.push(base64map.charAt(overflow));
    
           // Add padding
           while (base64.length % 4 != 0) base64.push("=");
    
           return base64.join("");
    
       },
    
       // Convert a base-64 string to a byte array
       base64ToBytes: function (base64) {
    
           // Use browser-native function if it exists
           if (typeof atob == "function") return util.stringToBytes(atob(base64));
    
           // Remove non-base-64 characters
           base64 = base64.replace(/[^A-Z0-9+\/]/ig, "");
    
           var bytes = [];
    
           for (var i = 0; i < base64.length; i++) {
               switch (i % 4) {
                   case 1:
                       bytes.push((base64map.indexOf(base64.charAt(i - 1)) << 2) |
                                  (base64map.indexOf(base64.charAt(i)) >>> 4));
                       break;
                   case 2:
                       bytes.push(((base64map.indexOf(base64.charAt(i - 1)) & 0xF) << 4) |
                                  (base64map.indexOf(base64.charAt(i)) >>> 2));
                       break;
                   case 3:
                       bytes.push(((base64map.indexOf(base64.charAt(i - 1)) & 0x3) << 6) |
                                  (base64map.indexOf(base64.charAt(i))));
                       break;
               }
           }
    
           return bytes;
    
       }
    
   };
    
   // Crypto mode namespace
   Crypto.mode = {};
    
   //hmac
    
   var util = Crypto.util;
    
   Crypto.HMAC = function (hasher, message, key, options) {
    
       // Allow arbitrary length keys
       key = key.length > hasher._blocksize * 4 ?
             hasher(key, { asBytes: true }) :
             util.stringToBytes(key);
    
       // XOR keys with pad constants
       var okey = key,
           ikey = key.slice(0);
       for (var i = 0; i < hasher._blocksize * 4; i++) {
           okey[i] ^= 0x5C;
           ikey[i] ^= 0x36;
       }
    
       var hmacbytes = hasher(util.bytesToString(okey) +
                              hasher(util.bytesToString(ikey) + message, { asString: true }),
                              { asBytes: true });
       return options && options.asBytes ? hmacbytes :
              options && options.asString ? util.bytesToString(hmacbytes) :
              util.bytesToHex(hmacbytes);
    
   };
    
   //sha1
    
   // Shortcut
   var util = Crypto.util;
    
   // Public API
   var SHA1 = Crypto.SHA1 = function (message, options) {
       var digestbytes = util.wordsToBytes(SHA1._sha1(message));
       return options && options.asBytes ? digestbytes :
              options && options.asString ? util.bytesToString(digestbytes) :
              util.bytesToHex(digestbytes);
   };
    
   // The core
   SHA1._sha1 = function (message) {
    
       var m  = util.stringToWords(message),
           l  = message.length * 8,
           w  =  [],
           H0 =  1732584193,
           H1 = -271733879,
           H2 = -1732584194,
           H3 =  271733878,
           H4 = -1009589776;
    
       // Padding
       m[l >> 5] |= 0x80 << (24 - l % 32);
       m[((l + 64 >>> 9) << 4) + 15] = l;
    
       for (var i = 0; i < m.length; i += 16) {
    
           var a = H0,
               b = H1,
               c = H2,
               d = H3,
               e = H4;
    
           for (var j = 0; j < 80; j++) {
    
               if (j < 16) w[j] = m[i + j];
               else {
                   var n = w[j-3] ^ w[j-8] ^ w[j-14] ^ w[j-16];
                   w[j] = (n << 1) | (n >>> 31);
               }
    
               var t = ((H0 << 5) | (H0 >>> 27)) + H4 + (w[j] >>> 0) + (
                        j < 20 ? (H1 & H2 | ~H1 & H3) + 1518500249 :
                        j < 40 ? (H1 ^ H2 ^ H3) + 1859775393 :
                        j < 60 ? (H1 & H2 | H1 & H3 | H2 & H3) - 1894007588 :
                                 (H1 ^ H2 ^ H3) - 899497514);
    
               H4 =  H3;
               H3 =  H2;
               H2 = (H1 << 30) | (H1 >>> 2);
               H1 =  H0;
               H0 =  t;
    
           }
    
           H0 += a;
           H1 += b;
           H2 += c;
           H3 += d;
           H4 += e;
    
       }
    
       return [H0, H1, H2, H3, H4];
    
   };
    
   // Package private blocksize
   SHA1._blocksize = 16;
    
   //base64
    
       var Base64 = {
    
           // private property
           _keyStr : "ABCDEFGHIJKLMNOPQRSTUVWXYZabcdefghijklmnopqrstuvwxyz0123456789+/=",
    
           // public method for encoding
           encode : function (input) {
               var output = "";
               var chr1, chr2, chr3, enc1, enc2, enc3, enc4;
               var i = 0;
    
               input = Base64._utf8_encode(input);
    
               while (i < input.length) {
    
                   chr1 = input.charCodeAt(i++);
                   chr2 = input.charCodeAt(i++);
                   chr3 = input.charCodeAt(i++);
    
                   enc1 = chr1 >> 2;
                   enc2 = ((chr1 & 3) << 4) | (chr2 >> 4);
                   enc3 = ((chr2 & 15) << 2) | (chr3 >> 6);
                   enc4 = chr3 & 63;
    
                   if (isNaN(chr2)) {
                       enc3 = enc4 = 64;
                   } else if (isNaN(chr3)) {
                       enc4 = 64;
                   }
    
                   output = output +
                   this._keyStr.charAt(enc1) + this._keyStr.charAt(enc2) +
                   this._keyStr.charAt(enc3) + this._keyStr.charAt(enc4);
    
               }
    
               return output;
           },
    
           // public method for decoding
           decode : function (input) {
               var output = "";
               var chr1, chr2, chr3;
               var enc1, enc2, enc3, enc4;
               var i = 0;
    
               input = input.replace(/[^A-Za-z0-9\+\/\=]/g, "");
    
               while (i < input.length) {
    
                   enc1 = this._keyStr.indexOf(input.charAt(i++));
                   enc2 = this._keyStr.indexOf(input.charAt(i++));
                   enc3 = this._keyStr.indexOf(input.charAt(i++));
                   enc4 = this._keyStr.indexOf(input.charAt(i++));
    
                   chr1 = (enc1 << 2) | (enc2 >> 4);
                   chr2 = ((enc2 & 15) << 4) | (enc3 >> 2);
                   chr3 = ((enc3 & 3) << 6) | enc4;
    
                   output = output + String.fromCharCode(chr1);
    
                   if (enc3 != 64) {
                       output = output + String.fromCharCode(chr2);
                   }
                   if (enc4 != 64) {
                       output = output + String.fromCharCode(chr3);
                   }
    
               }
    
               output = Base64._utf8_decode(output);
    
               return output;
    
           },
    
           // private method for UTF-8 encoding
           _utf8_encode : function (string) {
               string = string.replace(/\r\n/g,"\n");
               var utftext = "";
    
               for (var n = 0; n < string.length; n++) {
    
                   var c = string.charCodeAt(n);
    
                   if (c < 128) {
                       utftext += String.fromCharCode(c);
                   }
                   else if((c > 127) && (c < 2048)) {
                       utftext += String.fromCharCode((c >> 6) | 192);
                       utftext += String.fromCharCode((c & 63) | 128);
                   }
                   else {
                       utftext += String.fromCharCode((c >> 12) | 224);
                       utftext += String.fromCharCode(((c >> 6) & 63) | 128);
                       utftext += String.fromCharCode((c & 63) | 128);
                   }
    
               }
    
               return utftext;
           },
    
           // private method for UTF-8 decoding
           _utf8_decode : function (utftext) {
               var string = "";
               var i = 0;
               var c = c1 = c2 = 0;
    
               while ( i < utftext.length ) {
    
                   c = utftext.charCodeAt(i);
    
                   if (c < 128) {
                       string += String.fromCharCode(c);
                       i++;
                   }
                   else if((c > 191) && (c < 224)) {
                       c2 = utftext.charCodeAt(i+1);
                       string += String.fromCharCode(((c & 31) << 6) | (c2 & 63));
                       i += 2;
                   }
                   else {
                       c2 = utftext.charCodeAt(i+1);
                       c3 = utftext.charCodeAt(i+2);
                       string += String.fromCharCode(((c & 15) << 12) | ((c2 & 63) << 6) | (c3 & 63));
                       i += 3;
                   }
    
               }
    
               return string;
           }
    
       }
    
   export {Crypto, Base64}

3. 封裝上傳文件

4. 創建上傳文件
   

   common/common.js

5. import {
   	Crypto,
   	Base64
   } from './bundle.js'; //引入上面的代碼
   
   export const alUploadImage = function(path, showLoading = true) {
   	return new Promise((resolve, reject) => {
   		let date = new Date(new Date().getTime() + 1000 * 3600);
   		let expiration = date.toISOString();
   		//let expiration = date.getFullYear()+'-'+(date.getMonth()+1)+'-'+date.getDate()+'T'+date.getHours()+':'+date.getMinutes()+':00.000Z';
   		let policyText = {
   			expiration, //設置該Policy的失效時間，超過這個失效時間之后，就沒有辦法通過這個policy上傳文件了
   			"conditions": [
   				["content-length-range", 0, 1048576000] // 設置上傳文件的大小限制
   			]
   		};
   		let bucketName = ''; //你的bucketName
   		let policyBase64 = Base64.encode(JSON.stringify(policyText))
   		let accessid = ''; //你的阿里oss accessid
   		let accesskey = ''; //你的阿里oss secret
   		let host = 'http://' + bucketName +
   		'.oss-cn-zhangjiakou.aliyuncs.com'; //上傳oss地址,注意地區對不對,我這示例給的是shanghai
   		let bytes = Crypto.HMAC(Crypto.SHA1, policyBase64, accesskey, {
   			asBytes: true
   		});
   		let signature = Crypto.util.bytesToBase64(bytes); //簽名
   		// 在阿里云存儲路徑=>文件地址,地址根據公司或本人要求生成，下方僅為示例
   		
   		// 截取年月日部分
   		var now = new Date().toISOString();
   		var yearMonthDate = now.split('T')[0];
   		const timestamp = new Date().getTime();
   		
   		let fileName = 'App/' + yearMonthDate+'/'+ timestamp+'.' + path
   			.split('.').pop(); //文件名 注意：相同文件名會覆蓋之前的文件
   		if (showLoading) uni.showLoading({
   			mask: true,
   			title: '上傳中..'
   		})
   		uni.uploadFile({
   			url: host,
   			filePath: path,
   			fileType: '',
   			name: 'file',
   			formData: {
   				name: fileName,
   				key: fileName, //文件名
   				policy: policyBase64, // 輸入你獲取的的policy
   				OSSAccessKeyId: accessid, // 輸入你的AccessKeyId
   				success_action_status: '200', // 讓服務端返回200,不然，默認會返回204
   				signature, // 輸入你獲取的的signature
   			},
   			success: (res) => {
   				if (showLoading) uni.hideLoading()
   				res.file = host + '/' + fileName
   				resolve(res)
   			},
   			fail: (res) => {
   				if (showLoading) uni.hideLoading()
   				reject(false)
   			}
   		})
   	})
   }

   
   

6. main.js 設置全局引用

   
   

7. import { alUploadImage } from 'common/data/common.js'
   Vue.prototype.$alUploadImage = alUploadImage