flutter直接上傳文件到阿裡雲oss
代碼實現
以下是我寫的一個上傳oss的類,隻需要替換ossAccessKeyId, ossAccessKeySecret, bucket, url, expiration這幾個參數就可以直接實現上傳
import 'dart:convert'; import 'dart:io'; import 'dart:math'; import 'package:crypto/crypto.dart'; import 'package:dio/dio.dart'; class UploadOss { static String ossAccessKeyId = 'ossAccessKeyId'; static String ossAccessKeySecret = 'ossAccessKeySecret'; // oss設置的bucket的名字 static String bucket = 'bucketName'; // 發送請求的url,根據你自己設置的是哪個城市的 static String url = 'https://$bucket.oss-cn-hangzhou.aliyuncs.com'; // 過期時間 static String expiration = '2025-01-01T12:00:00.000Z'; /** * @params file 要上傳的文件對象 * @params rootDir 阿裡雲oss設置的根目錄文件夾名字 * @param fileType 文件類型例如jpg,mp4等 * @param callback 回調函數我這裡用於傳cancelToken,方便後期關閉請求 * @param onSendProgress 上傳的進度事件 */ static Future<String> upload({ File file , String rootDir = 'moment', String fileType, Function callback, Function onSendProgress}) async { String policyText = '{"expiration": "$expiration","conditions": [{"bucket": "$bucket" },["content-length-range", 0, 1048576000]]}'; // 獲取簽名 String signature = getSignature(policyText); BaseOptions options = new BaseOptions(); options.responseType = ResponseType.plain; //創建dio對象 Dio dio = new Dio(options); // 生成oss的路徑和文件名我這裡目前設置的是moment/20201229/test.mp4 String pathName = '$rootDir/${getDate()}/${getRandom(12)}.${fileType == null ? getFileType(file.path) : fileType}'; // 請求參數的form對象 FormData data = new FormData.fromMap({ 'key': pathName, 'policy': getSplicyBase64(policyText), 'OSSAccessKeyId': ossAccessKeyId, 'success_action_status': '200', //讓服務端返回200,不然,默認會返回204 'signature': signature, 'contentType': 'multipart/form-data', 'file': MultipartFile.fromFileSync(file.path), }); Response response; CancelToken uploadCancelToken = CancelToken(); callback ?? callback(uploadCancelToken); try { // 發送請求 response = await dio.post(url, data: data, cancelToken: uploadCancelToken, onSendProgress: (int count, int data) { onSendProgress(count, data); }); // 成功後返回文件訪問路徑 return '$url/$pathName'; } catch(e) { throw(e.message); } } /* * 生成固定長度的隨機字符串 * */ static String getRandom(int num) { String alphabet = 'qwertyuiopasdfghjklzxcvbnmQWERTYUIOPASDFGHJKLZXCVBNM'; String left = ''; for (var i = 0; i < num; i++) { // right = right + (min + (Random().nextInt(max - min))).toString(); left = left + alphabet[Random().nextInt(alphabet.length)]; } return left; } /* * 根據圖片本地路徑獲取圖片名稱 * */ static String getImageNameByPath(String filePath) { // ignore: null_aware_before_operator return filePath?.substring(filePath?.lastIndexOf("/")+1,filePath?.length); } /** * 獲取文件類型 */ static String getFileType(String path) { print(path); List<String> array = path.split('.'); return array[array.length -1]; } /// 獲取日期 static String getDate() { DateTime now = DateTime.now(); return '${now.year}${now.month}${now.day}'; } // 獲取plice的base64 static getSplicyBase64(String policyText) { //進行utf8編碼 List<int> policyText_utf8 = utf8.encode(policyText); //進行base64編碼 String policy_base64 = base64.encode(policyText_utf8); return policy_base64; } /// 獲取簽名 static String getSignature(String policyText) { //進行utf8編碼 List<int> policyText_utf8 = utf8.encode(policyText); //進行base64編碼 String policy_base64 = base64.encode(policyText_utf8); //再次進行utf8編碼 List<int> policy = utf8.encode(policy_base64); //進行utf8 編碼 List<int> key = utf8.encode(ossAccessKeySecret); //通過hmac,使用sha1進行加密 List<int> signature_pre = Hmac(sha1, key).convert(policy).bytes; //最後一步,將上述所得進行base64 編碼 String signature = base64.encode(signature_pre); return signature; } }
調用上傳的例子
其他參事自己根據自己情況上傳
Future<String> uploadFile(File file, { Function onSendProgress, Function callback}) async { final String url = await UploadOss.upload(file: file, onSendProgress: onSendProgress, callback: callback); return url; }
另一種方法
目前阿裡沒有針對Flutter有官方SDK可集成, 但是有人對Flutter的上傳有封裝庫https://pub.dev/packages/aly_oss#-example-tab-, 所以我們隻能通過post提交PostObject的形式來上傳;
準備工作:
1、獲取OSS憑證地址(your oss_sts_server), 通知get直接獲取static String ossServerUrl = ‘http://…/sts-server/sts.php’;
2、上傳的存儲地址(桶名):static String ossEndPointCdn = ‘<your endpointcdn>’;
// 通過ossServerUrl直接get獲取到如下數據 { "StatusCode": 200, "AccessKeyId": "STS.NSsrKZes4cqm.....", "AccessKeySecret": "7eGnLZaEFsRCGYJAnrtdE9n.....", "Expiration": "2020-04-08T03:44:21Z", "SecurityToken": "CAISlQJ1q6Ft5B2y....." } //表單需要的參數: AccessKeyId、AccessKeySecret、SecurityToken; FormData formdata = new FormData.from({ //文件名,隨意 'Filename': OssUtil.instance.getImageName(filePath), //"可以填寫文件夾名(對應於oss服務中的文件夾)/" + fileName 'key': uploadName,//上傳後的文件名 'policy': OssUtil.policy, //Bucket 擁有者的AccessKeyId。 'OSSAccessKeyId': data['AccessKeyId'], //讓服務端返回200,不然,默認會返回204 'success_action_status': '200', 'signature': OssUtil.instance.getSignature(data['AccessKeySecret']), //臨時用戶授權時必須,需要攜帶後臺返回的security-token 'x-oss-security-token': data['SecurityToken'], 'file': new UploadFileInfo( file, OssUtil.instance.getImageNameByPath(filePath)) //必須放在參數最後 }); //然後通過存儲地址直接把表單(formdata)上傳上去; Dio dio=Dio(); dio.options.responseType=ResponseType.plain; Response response=awaitdio.post(<ossEndPointCdn>,data:formData); ......
tips: 上傳成功後圖片地址 imageUrl = ossEndPointCdn + ‘/’ + uploadName;
給一個工具類
import 'dart:convert'; import 'package:crypto/crypto.dart'; import 'dart:math'; class OssUtil { 獲取 //驗證文本域 static String _policyText = '{"expiration": "2069-05-22T03:15:00.000Z","conditions": [["content-length-range", 0, 1048576000]]}';//UTC時間+8=北京時間 //進行utf8編碼 // ignore: non_constant_identifier_names static List<int> _policyText_utf8 = utf8.encode(_policyText); //進行base64編碼 static String policy= base64.encode(_policyText_utf8); //再次進行utf8編碼 // ignore: non_constant_identifier_names static List<int> _policy_utf8 = utf8.encode(policy); // 工廠模式 factory OssUtil() => _getInstance(); static OssUtil get instance => _getInstance(); static OssUtil _instance; OssUtil._internal(); static OssUtil _getInstance() { if (_instance == null) { _instance = new OssUtil._internal(); } return _instance; } /* *獲取signature簽名參數 */ String getSignature(String _accessKeySecret){ //進行utf8 編碼 // ignore: non_constant_identifier_names List<int> AccessKeySecretUtf8 = utf8.encode(_accessKeySecret); //通過hmac,使用sha1進行加密 List<int> signaturePre = new Hmac(sha1, AccessKeySecretUtf8).convert(_policy_utf8).bytes; //最後一步,將上述所得進行base64 編碼 String signature = base64.encode(signaturePre); return signature; } // ignore: slash_for_doc_comments /** * 生成上傳上傳圖片的名稱 ,獲得的格式:photo/20171027175940_oCiobK * 可以定義上傳的路徑uploadPath(Oss中保存文件夾的名稱) * @param uploadPath 上傳的路徑 如:/photo * @return photo/20171027175940_oCiobK */ String getImageUploadName(String uploadPath,String filePath) { String imageMame = ""; var timestamp = new DateTime.now().millisecondsSinceEpoch; imageMame =timestamp.toString()+"_"+getRandom(6); if(uploadPath!=null&&uploadPath.isNotEmpty){ imageMame=uploadPath+"/"+imageMame; } String imageType=filePath?.substring(filePath?.lastIndexOf("."),filePath?.length); return imageMame+imageType; } String getImageName(String filePath) { String imageMame = ""; var timestamp = new DateTime.now().millisecondsSinceEpoch; imageMame =timestamp.toString()+"_"+getRandom(6); String imageType=filePath?.substring(filePath?.lastIndexOf("."),filePath?.length); return imageMame+imageType; } /* * 生成固定長度的隨機字符串 * */ String getRandom(int num) { String alphabet = 'qwertyuiopasdfghjklzxcvbnmQWERTYUIOPASDFGHJKLZXCVBNM'; String left = ''; for (var i = 0; i < num; i++) { // right = right + (min + (Random().nextInt(max - min))).toString(); left = left + alphabet[Random().nextInt(alphabet.length)]; } return left; } /* * 根據圖片本地路徑獲取圖片名稱 * */ String getImageNameByPath(String filePath) { // ignore: null_aware_before_operator return filePath?.substring(filePath?.lastIndexOf("/")+1,filePath?.length); } }
以上就是flutter直接上傳文件到阿裡雲oss的實現步驟的詳細內容,更多關於flutter 上傳文件到阿裡雲oss的資料請關註WalkonNet其它相關文章!
推薦閱讀:
- 阿裡雲OSS實踐文件直傳基於服務端
- java實現後臺處理base64圖片還原為文件
- vue上傳文件formData上傳的解決全流程
- python des,aes,rsa加解密的實現
- 使用AJAX實現上傳文件