Flutter腾讯云COS存储插件tencent_cos_sdk_chassis的使用

Flutter腾讯云COS存储插件tencent_cos_sdk_chassis的使用

Dart

易于扩展的腾讯云 COS Dart SDK。

使用

import 'package:tencent_cos_sdk_chassis/tencent_cos_sdk_chassis.dart';

/// 初始化
final cosClient = COSClient(
        config: COSConfig(
          secretId: '',
          secretKey: '',
          appid: '',
          region: '',
        ),);

/// 使用 API
cosClient.getObject()

扩展 API

因为腾讯云 COS SDK 的 API 相当多,而目前我需要使用的并不多,所以该仓库已实现的 API 只有几个。不过得益于易于扩展的底层设计, 你可以方便的扩展自己需要的 API。

下图展示了基本的架构:

disign

具体的实现方式请参考 lib/apis 目录下的文件,其都是通过 extension 实现的。

致谢

本仓库签名相关实现参考了 tencent_cos


以下是一个完整的示例Demo,展示如何在Flutter项目中使用tencent_cos_sdk_chassis插件来实现上传、下载、删除对象等操作。

示例代码

import 'package:example/pages/delete_object_page.dart';
import 'package:example/pages/get_object_page.dart';
import 'package:example/pages/get_object_url_page.dart';
import 'package:example/pages/pub_object_page.dart';
import 'package:example/proxy.dart';
import 'package:flutter/material.dart';
import 'package:flutter_dotenv/flutter_dotenv.dart';
import 'package:get_it/get_it.dart';
import 'package:tencent_cos_sdk_chassis/tencent_cos_sdk_chassis.dart';

final getIt = GetIt.instance;

void main() async {
  WidgetsFlutterBinding.ensureInitialized();

  await dotenv.load(fileName: 'dev.env');

  getIt.registerSingleton<COSClient>(
    COSClient(
        config: COSConfig(
          secretId: dotenv.get('secretId'),
          secretKey: dotenv.get('secretKey'),
          appid: dotenv.get('appid'),
          region: dotenv.get('region'),
          scheme: 'http',
        ),
        loggerLevel: Level.all),
  );

  runApp(const MyApp());
}

class MyApp extends StatelessWidget {
  const MyApp({super.key});

  [@override](/user/override)
  Widget build(BuildContext context) {
    return MaterialApp(
      title: 'Tencent COS Plus',
      theme: ThemeData(
        colorScheme: ColorScheme.fromSeed(seedColor: Colors.deepPurple),
        useMaterial3: true,
      ),
      home: const MyHomePage(title: 'Tencent COS Plus'),
    );
  }
}

class MyHomePage extends StatefulWidget {
  const MyHomePage({super.key, required this.title});

  final String title;

  [@override](/user/override)
  State<MyHomePage> createState() => _MyHomePageState();
}

class _MyHomePageState extends State<MyHomePage> {
  handleToPage(Widget component) {
    Navigator.push(
        context,
        MaterialPageRoute(
          builder: (context) => Scaffold(
            appBar: AppBar(),
            body: component,
          ),
        ));
  }

  [@override](/user/override)
  void initState() {
    super.initState();
    MyProxy.startProxy();
  }

  [@override](/user/override)
  Widget build(BuildContext context) {
    return Scaffold(
      appBar: AppBar(
        title: Text(widget.title),
      ),
      body: Column(
        children: [
          ListTile(
            title: const Row(
              children: [
                Icon(Icons.image_outlined),
                Text(' 获取链接测试'),
              ],
            ),
            onTap: () => handleToPage(const GetObjectUrlPage()),
          ),
          ListTile(
            title: const Row(
              children: [
                Icon(Icons.delete_forever_outlined),
                Text(' 删除对象测试'),
              ],
            ),
            onTap: () => handleToPage(const DeleteObjectPage()),
          ),
          ListTile(
            title: const Row(
              children: [
                Icon(Icons.download_done_outlined),
                Text(' 下载对象测试'),
              ],
            ),
            onTap: () => handleToPage(const GetObjectPage()),
          ),
          ListTile(
            title: const Row(
              children: [
                Icon(Icons.upload_file_outlined),
                Text(' 上传对象测试'),
              ],
            ),
            onTap: () => handleToPage(const PutObjectPage()),
          ),
        ],
      ),
    );
  }
}

详细页面实现

GetObjectUrlPage
import 'package:flutter/material.dart';
import 'package:tencent_cos_sdk_chassis/tencent_cos_sdk_chassis.dart';

class GetObjectUrlPage extends StatefulWidget {
  [@override](/user/override)
  _GetObjectUrlPageState createState() => _GetObjectUrlPageState();
}

class _GetObjectUrlPageState extends State<ObjectUrlPage> {
  String url = '';

  [@override](/user/override)
  void initState() {
    super.initState();
    getCOSUrl();
  }

  Future<void> getCOSUrl() async {
    final cosClient = getIt.get<COSClient>();
    final result = await cosClient.getObjectUrl(
      bucket: 'your-bucket-name',
      key: 'your-object-key',
    );
    setState(() {
      url = result;
    });
  }

  [@override](/user/override)
  Widget build(BuildContext context) {
    return Scaffold(
      appBar: AppBar(
        title: Text('获取链接测试'),
      ),
      body: Center(
        child: Text(url),
      ),
    );
  }
}
DeleteObjectPage
import 'package:flutter/material.dart';
import 'package:tencent_cos_sdk_chassis/tencent_cos_sdk_chassis.dart';

class DeleteObjectPage extends StatefulWidget {
  [@override](/user/override)
  _DeleteObjectPageState createState() => _DeleteObjectPageState();
}

class _DeleteObjectPageState extends State<DeleteObjectPage> {
  bool isLoading = false;

  [@override](/user/override)
  void initState() {
    super.initState();
    deleteObject();
  }

  Future<void> deleteObject() async {
    final cosClient = getIt.get<COSClient>();
    setState(() {
      isLoading = true;
    });
    try {
      await cosClient.deleteObject(
        bucket: 'your-bucket-name',
        key: 'your-object-key',
      );
      ScaffoldMessenger.of(context).showSnackBar(
        SnackBar(content: Text('删除成功')),
      );
    } catch (e) {
      ScaffoldMessenger.of(context).showSnackBar(
        SnackBar(content: Text('删除失败: $e')),
      );
    } finally {
      setState(() {
        isLoading = false;
      });
    }
  }

  [@override](/user/override)
  Widget build(BuildContext context) {
    return Scaffold(
      appBar: AppBar(
        title: Text('删除对象测试'),
      ),
      body: Center(
        child: isLoading ? CircularProgressIndicator() : Text('点击按钮后开始删除'),
      ),
    );
  }
}
GetObjectPage
import 'package:flutter/material.dart';
import 'package:tencent_cos_sdk_chassis/tencent_cos_sdk_chassis.dart';

class GetObjectPage extends StatefulWidget {
  [@override](/user/override)
  _GetObjectPageState createState() => _GetObjectPageState();
}

class _GetObjectPageState extends State<GetObjectPage> {
  bool isLoading = false;
  List<int> bytes = [];

  [@override](/user/override)
  void initState() {
    super.initState();
    getObject();
  }

  Future<void> getObject() async {
    final cosClient = getIt.get<COSClient>();
    setState(() {
      isLoading = true;
    });
    try {
      final result = await cosClient.getObject(
        bucket: 'your-bucket-name',
        key: 'your-object-key',
      );
      setState(() {
        bytes = result;
      });
    } catch (e) {
      ScaffoldMessenger.of(context).showSnackBar(
        SnackBar(content: Text('下载失败: $e')),
      );
    } finally {
      setState(() {
        isLoading = false;
      });
    }
  }

  [@override](/user/override)
  Widget build(BuildContext context) {
    return Scaffold(
      appBar: AppBar(
        title: Text('下载对象测试'),
      ),
      body: Center(
        child: isLoading
            ? CircularProgressIndicator()
            : bytes.isNotEmpty
                ? Text('下载成功')
                : Text('下载失败'),
      ),
    );
  }
}
PutObjectPage
import 'package:flutter/material.dart';
import 'package:tencent_cos_sdk_chassis/tencent_cos_sdk_chassis.dart';

class PutObjectPage extends StatefulWidget {
  [@override](/user/override)
  _PutObjectPageState createState() => _PutObjectPageState();
}

class _PutObjectPageState extends State<PutObjectPage> {
  bool isLoading = false;

  [@override](/user/override)
  void initState() {
    super.initState();
    putObject();
  }

  Future<void> putObject() async {
    final cosClient = getIt.get<COSClient>();
    setState(() {
      isLoading = true;
    });
    try {
      await cosClient.putObject(
        bucket: 'your-bucket-name',
        key: 'your-object-key',
        data: Uint8List.fromList([/* your object data */]),
      );
      ScaffoldMessenger.of(context).showSnackBar(
        SnackBar(content: Text('上传成功')),
      );
    } catch (e) {
      ScaffoldMessenger.of(context).showSnackBar(
        SnackBar(content: Text('上传失败: $e')),
      );
    } finally {
      setState(() {
        isLoading = false;
      });
    }
  }

  [@override](/user/override)
  Widget build(BuildContext context) {
    return Scaffold(
      appBar: AppBar(
        title: Text('上传对象测试'),
      ),
      body: Center(
        child: isLoading ? CircularProgressIndicator() : Text('点击按钮后开始上传'),
      ),
    );
  }
}

更多关于Flutter腾讯云COS存储插件tencent_cos_sdk_chassis的使用的实战教程也可以访问 https://www.itying.com/category-92-b0.html

1 回复

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


tencent_cos_sdk_chassis 是一个 Flutter 插件,用于在 Flutter 应用中集成腾讯云对象存储(COS)服务。它基于腾讯云 COS SDK 提供了一个简单的接口,使得在 Flutter 应用中上传、下载和管理文件变得更加容易。

安装

首先,你需要在 pubspec.yaml 文件中添加 tencent_cos_sdk_chassis 插件的依赖:

dependencies:
  flutter:
    sdk: flutter
  tencent_cos_sdk_chassis: ^latest_version

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

初始化

在使用插件之前,你需要初始化 COS 客户端。通常,你需要在应用的启动阶段进行初始化。

import 'package:tencent_cos_sdk_chassis/tencent_cos_sdk_chassis.dart';

void main() async {
  WidgetsFlutterBinding.ensureInitialized();
  
  // 初始化 COS 客户端
  await TencentCosSdkChassis.init(
    appId: 'your_app_id',
    secretId: 'your_secret_id',
    secretKey: 'your_secret_key',
    region: 'your_region', // 例如:ap-beijing
  );
  
  runApp(MyApp());
}

上传文件

你可以使用 uploadFile 方法将文件上传到 COS。

import 'package:tencent_cos_sdk_chassis/tencent_cos_sdk_chassis.dart';

Future<void> uploadFile() async {
  try {
    final filePath = '/path/to/your/file.txt';
    final bucketName = 'your_bucket_name';
    final cosPath = 'path/in/cos/file.txt';

    await TencentCosSdkChassis.uploadFile(
      bucketName: bucketName,
      cosPath: cosPath,
      filePath: filePath,
    );

    print('文件上传成功');
  } catch (e) {
    print('文件上传失败: $e');
  }
}

下载文件

你可以使用 downloadFile 方法从 COS 下载文件。

import 'package:tencent_cos_sdk_chassis/tencent_cos_sdk_chassis.dart';

Future<void> downloadFile() async {
  try {
    final bucketName = 'your_bucket_name';
    final cosPath = 'path/in/cos/file.txt';
    final savePath = '/path/to/save/file.txt';

    await TencentCosSdkChassis.downloadFile(
      bucketName: bucketName,
      cosPath: cosPath,
      savePath: savePath,
    );

    print('文件下载成功');
  } catch (e) {
    print('文件下载失败: $e');
  }
}
回到顶部