Flutter文件上传管理插件uploadcare_client的使用
Flutter文件上传管理插件uploadcare_client的使用
Uploadcare是一个全面的文件处理平台,可以帮助你更快地交付产品并专注于业务目标。uploadcare_client
是Dart/Flutter的一个库,用于与Uploadcare REST API交互,支持文件上传、媒体处理和自适应交付。
安装
在你的项目中添加uploadcare_client
包:
Dart
dart pub add uploadcare_client # 或者 uploadcare_flutter
Flutter
flutter pub add uploadcare_client # 或者 uploadcare_flutter
创建一个客户端实例:
final client = UploadcareClient.withSimpleAuth(
publicKey: 'your_public_key',
apiVersion: 'v0.7',
);
UploadcareClient
提供了多个API部分:
final ApiUpload upload;
final ApiFiles files;
final ApiGroups groups;
final ApiDocumentConverting documentConverting;
final ApiVideoEncoding videoEncoding;
final ApiAddons addons;
final ApiWebhooks webhooks;
final ApiProject project;
文件上传
基本上传
适用于小文件:
final fileId = await client.upload.base(UCFile(File('path/to/small_file')));
分块上传
适用于大文件:
final fileId = await client.upload.multipart(UCFile(File('path/to/large_file')));
从URL上传
final fileId = await client.upload.fromUrl('https://files.st/path_to_file');
自动上传
自动选择合适的上传方法:
final fileId1 = await client.upload.auto(UCFile(File('path/to/small_file')));
final fileId2 = await client.upload.auto(UCFile(File('path/to/large_file')));
final fileId3 = await client.upload.auto('https://files.st/path_to_file');
在隔离线程中上传
不适用于Web环境:
final fileId = await client.upload.auto(UCFile(File('path/to/file')), runInIsolate: true);
进度跟踪
所有上传方法都接受一个进度回调:
final fileId = await client.upload.auto(UCFile(File('path/to/file')), onProgress: (progress) => print(progress));
可取消的上传
使用CancelToken
取消上传:
final cancelToken = CancelToken();
Timer(Duration(seconds: 1), cancelToken.cancel);
try {
final fileId = await client.upload.auto(UCFile(File('/some/file')), cancelToken: cancelToken);
} on CancelUploadException catch (e) {
// 已取消
}
签名上传
需要提供项目的私钥:
final client = UploadcareClient(options: ClientOptions(
authorizationScheme: AuthSchemeRegular(
publicKey: 'public_key',
privateKey: 'private_key',
apiVersion: 'v0.7',
),
useSignedUploads: true,
));
await client.upload.base(UCFile(File('path/to/file')));
图像和文件转换
官方文档:图像转换
示例代码:
final cropedCdnImage = CdnImage('<image-uuid>')..transform(CropTransformation(aspectRatio: AspectRatio(9, 16)));
// 使用以下字段获取裁剪后的图像URL
print(cropedCdnImage.url);
文件操作
获取文件信息
final FileInfoEntity file = await client.files.file('<file-uuid>');
获取文件列表
final ListEntity<FileInfoEntity> list = await client.files.list();
删除文件
await client.files.remove(['<file-uuid>', '<file-uuid>']);
存储文件
await client.files.store(['<file-uuid>', '<file-uuid>']);
元数据操作
// 获取文件的所有元数据
final Map<String, String> metadata = await client.files.getFileMetadata('<file-uuid>');
// 更新特定元数据键的值
final String updatedValue = await client.files.updateFileMetadataValue('<file-uuid>', '<metadata-key>', '<new-value>');
示例Demo
以下是一个完整的示例,展示了如何使用uploadcare_client
进行文件上传和基本操作:
import 'package:flutter/material.dart';
import 'package:uploadcare_client/uploadcare_client.dart';
void main() {
runApp(MyApp());
}
class MyApp extends StatelessWidget {
[@override](/user/override)
Widget build(BuildContext context) {
return MaterialApp(
home: UploadPage(),
);
}
}
class UploadPage extends StatefulWidget {
[@override](/user/override)
_UploadPageState createState() => _UploadPageState();
}
class _UploadPageState extends State<UploadPage> {
final UploadcareClient client = UploadcareClient.withSimpleAuth(
publicKey: 'your_public_key',
apiVersion: 'v0.7',
);
Future<void> uploadFile() async {
try {
final fileId = await client.upload.base(UCFile(File('path/to/your/file')));
print('File uploaded with ID: $fileId');
} catch (e) {
print('Error uploading file: $e');
}
}
[@override](/user/override)
Widget build(BuildContext context) {
return Scaffold(
appBar: AppBar(title: Text('Uploadcare Demo')),
body: Center(
child: ElevatedButton(
onPressed: uploadFile,
child: Text('Upload File'),
),
),
);
}
}
更多关于Flutter文件上传管理插件uploadcare_client的使用的实战系列教程也可以访问 https://www.itying.com/category-92-b0.html
更多关于Flutter文件上传管理插件uploadcare_client的使用的实战系列教程也可以访问 https://www.itying.com/category-92-b0.html
当然,下面是一个关于如何在Flutter中使用uploadcare_client
插件进行文件上传的示例代码。这个插件允许你使用Uploadcare的服务来上传和管理文件。
首先,你需要在你的pubspec.yaml
文件中添加uploadcare_client
依赖:
dependencies:
flutter:
sdk: flutter
uploadcare_client: ^最新版本号 # 请替换为实际的最新版本号
然后,运行flutter pub get
来安装依赖。
接下来,我们编写一个示例应用来演示如何使用uploadcare_client
进行文件上传。
-
配置Uploadcare凭证
在你的Flutter应用的根目录下创建一个名为
keys.dart
的文件,用于存储你的Uploadcare公钥和私钥(请确保不要将这些密钥硬编码到你的生产代码中,而是使用环境变量或安全存储)。
// keys.dart
const String uploadcarePublicKey = '你的Uploadcare公钥';
const String uploadcareSecretKey = '你的Uploadcare私钥';
-
初始化Uploadcare客户端
在你的主应用文件中(通常是
main.dart
),初始化Uploadcare客户端并配置上传功能。
import 'package:flutter/material.dart';
import 'package:uploadcare_client/uploadcare_client.dart';
import 'keys.dart';
void main() {
runApp(MyApp());
}
class MyApp extends StatelessWidget {
@override
Widget build(BuildContext context) {
return MaterialApp(
title: 'Flutter Uploadcare Demo',
theme: ThemeData(
primarySwatch: Colors.blue,
),
home: UploadcareDemo(),
);
}
}
class UploadcareDemo extends StatefulWidget {
@override
_UploadcareDemoState createState() => _UploadcareDemoState();
}
class _UploadcareDemoState extends State<UploadcareDemo> {
UploadcareClient? uploadcareClient;
@override
void initState() {
super.initState();
initUploadcareClient();
}
void initUploadcareClient() async {
uploadcareClient = await UploadcareClient.configure(
publicKey: uploadcarePublicKey,
secretKey: uploadcareSecretKey, // 注意:不要在客户端应用中包含私钥,这里仅用于演示
);
}
void _uploadFile(File file) async {
if (uploadcareClient != null) {
try {
var result = await uploadcareClient!.uploadFile(file);
print('File uploaded: ${result.url}');
} catch (e) {
print('Error uploading file: $e');
}
}
}
@override
Widget build(BuildContext context) {
return Scaffold(
appBar: AppBar(
title: Text('Uploadcare Demo'),
),
body: Center(
child: Column(
mainAxisAlignment: MainAxisAlignment.center,
children: <Widget>[
ElevatedButton(
onPressed: () async {
// 这里你应该有一个文件选择器来让用户选择文件
// 为了演示,我们假设你已经有一个File对象
File file = await _pickImage(); // 这是一个示例函数,你需要自己实现
if (file != null) {
_uploadFile(file);
}
},
child: Text('Upload File'),
),
],
),
),
);
}
// 示例文件选择器函数,你需要自己实现或替换为实际的文件选择器
Future<File?> _pickImage() async {
// 示例:使用image_picker插件来选择图片
// 请确保在pubspec.yaml中添加image_picker依赖并导入
// import 'package:image_picker/image_picker.dart';
// final ImagePicker _picker = ImagePicker();
// return await _picker.pickImage(source: ImageSource.camera);
// 由于我们在这里不能真正使用image_picker,所以返回null
return null;
}
}
注意:
- 在生产环境中,不要将私钥硬编码到客户端代码中。私钥应该在服务器端安全存储,并通过API调用与客户端交互。
- 上面的示例代码中有一个
_pickImage
函数,它应该实现文件选择逻辑。你可以使用image_picker
插件或其他文件选择库来实现这一功能。 - 确保你已经处理了必要的权限,例如相机和存储权限,如果你的应用需要访问这些设备功能。
这个示例代码提供了一个基本框架,展示了如何在Flutter中使用uploadcare_client
插件进行文件上传。你可以根据需要进行扩展和定制。