Flutter阿里云OSS存储插件aliyun_oss_flutter的使用

发布于 1周前 作者 phonegap100 来自 Flutter

Flutter阿里云OSS存储插件aliyun_oss_flutter的使用

插件介绍

aliyun_oss_flutter 是一个用于Flutter的阿里云OSS存储插件,可以帮助您将文件上传到阿里云OSS。首先需要在pubspec.yaml文件中添加依赖。

使用方法

1 依赖管理

dependencies:
  aliyun_oss_flutter: ^x.x.x

2 初始化OSSClient

import 'package:flutter/material.dart';
import 'package:aliyun_oss_flutter/aliyun_oss_flutter.dart';

void main() {
  // 初始化OSSClient
  OSSClient.init(
    endpoint: 'oss-cn-hangzhou.aliyuncs.com',
    bucket: 'xxxx',
    credentials: () {
      // Future Credentials
      return Credentials.fromJson(response.data);
      // Or Credentials Config
      return Credentials(
        accessKeyId: 'xxxx',
        accessKeySecret: 'xxxx',
      );
    },
  );

  runApp(...);
}

Future<void> upload() async {
  final object = await OSSClient().putObject(
    object: OSSObject
    bucket: xxx, // String?
    endpoint: xxx, // String,
    path: xxx, // String,
  );
}

3 示例代码

import 'package:flutter/material.dart';
import 'package:aliyun_oss_flutter/aliyun_oss_flutter.dart';

void main() {
  // 初始化OSSClient
  OSSClient.init(
    endpoint: 'oss-cn-hangzhou.aliyuncs.com', // 替换为您的OSS Endpoint
    bucket: 'your-bucket-name', // 替换为您的OSS Bucket名称
    credentials: () {
      // Future Credentials
      return Credentials.fromJson(response.data);
      // Or Credentials Config
      return Credentials(
        accessKeyId: 'your-access-key-id',
        accessKeySecret: 'your-access-key-secret',
      );
    },
  );

  runApp(...);
}

Future<void> upload() async {
  final object = await OSSClient().putObject(
    object: OSSObject
    bucket: 'your-bucket-name', // 替换为您的OSS Bucket名称
    endpoint: 'oss-cn-hangzhou.aliyuncs.com', // 替换为您的OSS Endpoint
    path: 'path/to/upload', // 您要上传文件的路径
  );
}

压缩需求

现版本已移除图片压缩、宽高获取,如需对视频、图片进行压缩可以使用media_asset_utils插件。推荐使用以下插件:

  • media_asset_utils:用于视频硬编码压缩以及图片仿微信Luban压缩。
  • Luban:用于视频缩略图获取。
  • video_info:用于视频和图片的width、height、orientation等信息获取。
  • image_picker_plus:用于保存到相册,支持Android Q+。

示例代码(包含媒体资产处理)

import 'package:flutter/material.dart';
import 'package:aliyun_oss_flutter/aliyun_oss_flutter.dart';
import 'package:image_picker/image_picker.dart';
import 'package:media_asset_utils/media_asset_utils.dart';
import 'package:luban/luban.dart';
import 'package:video_info/video_info.dart';

void main() {
  // 初始化OSSClient
  OSSClient.init(
    endpoint: 'oss-cn-hangzhou.aliyuncs.com', // 替换为您的OSS Endpoint
    bucket: 'your-bucket-name', // 替换为您的OSS Bucket名称
    credentials: () {
      // Future Credentials
      return Credentials.fromJson(response.data);
      // Or Credentials Config
      return Credentials(
        accessKeyId: 'your-access-key-id',
        accessKeySecret: 'your-access-key-secret',
      );
    },
  );

  runApp(...);
}

Future<void> upload() async {
  // 获取图片
  final picker = ImagePicker();
  final image = await picker.getImage(source: ImageSource.gallery);

  // 处理图片
  final mediaAssetUtils = MediaAssetUtils();
  final luban = Luban();

  // 图片压缩
  final compressedImage = await luban.compress(image.path, quality: 80);

  // 上传压缩后的图片到OSS
  final object = await OSSClient().putObject(
    object: OSSObject
    bucket: 'your-bucket-name', // 替换为您的OSS Bucket名称
    endpoint: 'oss-cn-hangzhou.aliyuncsc.com', // 替换为您的OSS Endpoint
    path: 'path/to/upload', // 您要上传文件的路径
  );
}

更多关于Flutter阿里云OSS存储插件aliyun_oss_flutter的使用的实战系列教程也可以访问 https://www.itying.com/category-92-b0.html

1 回复

更多关于Flutter阿里云OSS存储插件aliyun_oss_flutter的使用的实战系列教程也可以访问 https://www.itying.com/category-92-b0.html


当然,以下是如何在Flutter应用中使用aliyun_oss_flutter插件来与阿里云OSS(对象存储服务)进行交互的代码示例。这个示例将展示如何初始化OSS客户端、上传文件以及获取文件URL。

首先,确保你已经在pubspec.yaml文件中添加了aliyun_oss_flutter依赖:

dependencies:
  flutter:
    sdk: flutter
  aliyun_oss_flutter: ^最新版本号  # 请替换为实际的最新版本号

然后,运行flutter pub get来安装依赖。

接下来,按照以下步骤在你的Flutter应用中使用这个插件:

1. 初始化OSS客户端

你需要提供你的阿里云AccessKeyId、AccessKeySecret、Endpoint以及Bucket名称。出于安全考虑,建议不要直接在代码中硬编码这些敏感信息,而是使用环境变量或安全的密钥管理服务。

import 'package:aliyun_oss_flutter/aliyun_oss_flutter.dart';
import 'package:flutter/material.dart';

void main() {
  runApp(MyApp());
}

class MyApp extends StatelessWidget {
  @override
  Widget build(BuildContext context) {
    return MaterialApp(
      home: Scaffold(
        appBar: AppBar(
          title: Text('阿里云OSS示例'),
        ),
        body: OSSExample(),
      ),
    );
  }
}

class OSSExample extends StatefulWidget {
  @override
  _OSSExampleState createState() => _OSSExampleState();
}

class _OSSExampleState extends State<OSSExample> {
  late OSS ossClient;

  @override
  void initState() {
    super.initState();
    // 初始化OSS客户端
    String accessKeyId = 'yourAccessKeyId';
    String accessKeySecret = 'yourAccessKeySecret';
    String endpoint = 'yourEndpoint'; // 例如:http://oss-cn-hangzhou.aliyuncs.com
    String bucketName = 'yourBucketName';

    ossClient = OSS(
      accessKeyId: accessKeyId,
      accessKeySecret: accessKeySecret,
      endpoint: endpoint,
      bucketName: bucketName,
    );
  }

  @override
  Widget build(BuildContext context) {
    return Center(
      child: Column(
        mainAxisAlignment: MainAxisAlignment.center,
        children: <Widget>[
          ElevatedButton(
            onPressed: () async {
              await uploadFile(context);
            },
            child: Text('上传文件'),
          ),
        ],
      ),
    );
  }

  Future<void> uploadFile(BuildContext context) async {
    // 这里你需要选择一个文件,这里假设文件路径为filePath
    String filePath = '/path/to/your/file.jpg'; // 替换为你的文件路径
    String objectKey = 'example/file.jpg'; // 存储到OSS中的路径和文件名

    try {
      var result = await ossClient.putObjectFromFile(filePath, objectKey);
      print('上传成功: ${result.data}');
      // 获取文件URL
      String url = await ossClient.signUrl(objectKey, OSSHttpMethod.GET, expiration: 3600);
      print('文件URL: $url');
      ScaffoldMessenger.of(context).showSnackBar(SnackBar(content: Text('上传成功,URL已打印到控制台')));
    } catch (e) {
      print('上传失败: $e');
      ScaffoldMessenger.of(context).showSnackBar(SnackBar(content: Text('上传失败')));
    }
  }
}

注意事项

  1. 敏感信息:在实际项目中,不要直接在代码中硬编码AccessKeyId和AccessKeySecret。使用环境变量或密钥管理服务来安全地管理这些敏感信息。
  2. 文件选择:上述代码示例中假设了一个文件路径,你需要实现一个文件选择器来让用户选择文件。Flutter的image_picker插件或file_picker插件可以帮助你实现这一功能。
  3. 错误处理:在实际应用中,添加更详细的错误处理逻辑以提供更好的用户体验。
  4. 权限管理:确保你的阿里云OSS Bucket和OSS客户端配置有正确的权限,以允许你进行所需的操作。

这个示例展示了如何使用aliyun_oss_flutter插件来初始化OSS客户端、上传文件以及获取文件的访问URL。根据具体需求,你可以进一步扩展和优化这个示例。

回到顶部