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

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

开始使用 #

添加依赖 #

dependencies:
  tencent_cos: ^1.0.7

Flutter版本的插件腾讯COS插件,不依赖原生插件。参考:https://cloud.tencent.com/document/product/436/7749 如果可以麻烦右上角给点个赞吧

使用方法 #

支持putObject、deleteObject、listObject三个方法,具体参考COS文档。

// 如果后台采用临时秘钥这里需要传入值,否则会返回403错误。如果永久秘钥写在客户端,token可以不传入
String token = "";
// 本地的文件路径
String localPath = "";
// COS路径
String cosPath = "abc/123.png";
await COSClient(COSConfig(
  credentials["secretId"],
  credentials["secretKey"],
  credentials["bucketName"],
  credentials["region"],
)).putObject(cosPath, localPath, token: token);

其他信息 #

具体参考:https://cloud.tencent.com/developer/article/1878729

```

完整示例Demo

以下是一个完整的示例Demo,展示如何使用tencent_cos插件上传文件到腾讯云COS。

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

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

class MyApp extends StatelessWidget {
  [@override](/user/override)
  Widget build(BuildContext context) {
    return MaterialApp(
      home: Scaffold(
        appBar: AppBar(
          title: Text('腾讯云COS存储插件示例'),
        ),
        body: Center(
          child: UploadButton(),
        ),
      ),
    );
  }
}

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

class _UploadButtonState extends State<UploadButton> {
  String _status = "点击上传";

  void _uploadFile() async {
    // 如果后台采用临时秘钥这里需要传入值,否则会返回403错误。如果永久秘钥写在客户端,token可以不传入
    String token = ""; // 可以为空
    // 本地的文件路径
    String localPath = "/path/to/local/file"; // 需要替换为实际路径
    // COS路径
    String cosPath = "abc/123.png";

    try {
      await COSClient(COSConfig(
        "your_secret_id", // 替换为你的Secret ID
        "your_secret_key", // 替换为你的Secret Key
        "your_bucket_name", // 替换为你的Bucket Name
        "your_region", // 替换为你的Region
      )).putObject(cosPath, localPath, token: token);

      setState(() {
        _status = "上传成功";
      });
    } catch (e) {
      setState(() {
        _status = "上传失败: ${e.toString()}";
      });
    }
  }

  [@override](/user/override)
  Widget build(BuildContext context) {
    return ElevatedButton(
      onPressed: _uploadFile,
      child: Text(_status),
    );
  }
}

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

1 回复

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


当然,以下是一个关于如何在Flutter应用中使用腾讯云COS存储插件tencent_cos的代码示例。这个示例将展示如何初始化COS客户端、上传文件以及获取文件列表。

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

dependencies:
  flutter:
    sdk: flutter
  tencent_cos: ^x.y.z  # 请替换为最新版本号

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

接下来,是一个完整的Flutter应用示例,展示了如何使用tencent_cos插件:

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

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

class MyApp extends StatefulWidget {
  @override
  _MyAppState createState() => _MyAppState();
}

class _MyAppState extends State<MyApp> {
  final _formKey = GlobalKey<FormState>();
  String _secretId = '';
  String _secretKey = '';
  String _region = '';
  String _bucket = '';
  String _uploadFilePath = '';

  @override
  Widget build(BuildContext context) {
    return MaterialApp(
      home: Scaffold(
        appBar: AppBar(
          title: Text('Flutter Tencent COS Example'),
        ),
        body: Padding(
          padding: const EdgeInsets.all(16.0),
          child: Form(
            key: _formKey,
            child: Column(
              children: [
                TextFormField(
                  decoration: InputDecoration(labelText: 'Secret ID'),
                  onChanged: (value) => setState(() => _secretId = value),
                ),
                TextFormField(
                  decoration: InputDecoration(labelText: 'Secret Key'),
                  obscureText: true,
                  onChanged: (value) => setState(() => _secretKey = value),
                ),
                TextFormField(
                  decoration: InputDecoration(labelText: 'Region'),
                  onChanged: (value) => setState(() => _region = value),
                ),
                TextFormField(
                  decoration: InputDecoration(labelText: 'Bucket'),
                  onChanged: (value) => setState(() => _bucket = value),
                ),
                TextFormField(
                  decoration: InputDecoration(labelText: 'File Path to Upload'),
                  onChanged: (value) => setState(() => _uploadFilePath = value),
                ),
                SizedBox(height: 20),
                ElevatedButton(
                  onPressed: () async {
                    if (_formKey.currentState!.validate()) {
                      _formKey.currentState!.save();

                      // Initialize COS client
                      final cosClient = CosClient(
                        secretId: _secretId,
                        secretKey: _secretKey,
                        region: _region,
                      );

                      // Upload file
                      try {
                        final uploadResult = await cosClient.putObject(
                          bucket: _bucket,
                          cosPath: 'example/upload_test.txt', // The path in COS
                          localPath: _uploadFilePath,
                        );
                        print('Upload Success: ${uploadResult.data}');
                      } catch (e) {
                        print('Upload Failed: $e');
                      }

                      // List files (objects) in bucket
                      try {
                        final listObjectsResult = await cosClient.listObjects(
                          bucket: _bucket,
                          prefix: '',
                          delimiter: '/',
                          maxKeys: 100,
                        );
                        print('List Objects Result: ${listObjectsResult.data}');
                      } catch (e) {
                        print('List Objects Failed: $e');
                      }
                    }
                  },
                  child: Text('Upload and List Files'),
                ),
              ],
            ),
          ),
        ),
      ),
    );
  }
}

注意

  1. 在实际使用中,请不要在客户端代码中硬编码SecretIdSecretKey。你应该通过安全的方式获取这些凭证,比如从服务器端获取临时密钥。
  2. 上传文件路径_uploadFilePath应该是用户设备上的文件路径。
  3. 替换example/upload_test.txt为你希望存储在COS中的路径。
  4. listObjects方法用于列出bucket中的文件(对象),你可以根据需要调整prefixdelimitermaxKeys参数。

这个示例展示了如何初始化COS客户端、上传文件以及列出bucket中的文件。你可以根据实际需求进一步扩展和修改这个示例。

回到顶部