Flutter与FastAPI的OSS系统实现

作者：孙嘉成

一、对象存储

二、FastAPI与对象存储

[2.1 缤纷云S4服务API对接与鉴权实现](#2.1 缤纷云S4服务API对接与鉴权实现)

[2.2 RESTful接口设计与异步路由优化](#2.2 RESTful接口设计与异步路由优化)

三、Flutter界面与数据交互开发

[3.1 应用的创建](#3.1 应用的创建)

3.2页面的搭建

[3.3 文件的上传](#3.3 文件的上传)

关键词：对象存储、FastAPI、Flutter

一、对象存储

对象存储服务（Object Storage Service，OSS）是一种以离散数据单元为操作对象的技术架构，依托分布式系统架构提供基于对象形式的数据存储服务。相较于传统数据库，对象存储在存储海量非结构化数据时具有显著优势，通过横向扩展架构实现近乎无限的存储容量；采用多副本/纠删码技术保障数据持久性；支持高并发访问确保读写性能；通过智能数据冗余机制提升存储效率。

当前主流云服务提供商均推出了自研的对象存储服务，典型代表包括阿里云OSS、腾讯云COS、华为云OBS以及缤纷云S4存储等产品。

缤纷云 S4 对象存储服务作为新一代云原生存储平台，深度融合了分布式存储技术和智能管理算法，为企业级用户提供安全可靠、弹性扩展的非结构化数据存储解决方案。下面介绍如何使用：

首先进入官网：

点击控制台进行注册和登录操作：

在桶列表中创建一个桶进行数据的存储：

添加子账户并获取桶的管理权限：

打开创建子用户的读写权限：

二、FastAPI 与对象存储

2.1 缤纷云S4服务API对接与鉴权实现

查看官方文档，查看如何通过Python实现对缤纷云S4的操作。

引入 boto3 框架，在命令行中使用命令pip install boto3下载。

根据官方文档进行配置：

将其中的信息更换为自己的信息即可，打印的信息中"HTTPStatusCode"对应的值为200，即代表配置成功。

2.2 RESTful接口设计与异步路由优化

下载FastAPI框架：

创建POST接口，接收文件：

设置应用启动端口：

运行应用进行测试：

点击后在浏览器地址栏输入/docs进入FastAPI框架自带的文档进行上传文件测试：

选择文件进行上传：

返回成功信息：

三、Flutter界面与数据交互开发

3.1 应用的创建

打开命令窗口，创建Flutter应用

根据命令提示，构建项目

3.2页面的搭建

居中按钮组件

复制代码

Center(
          child: _buildUploadButton(
            context: context,
            label: '图片上传',
            onPressed: invoiceUploadViewModel.uploadInvoice,
            isActive: !invoiceUploadViewModel.isUploading,
          ),
        ),

上传逻辑

复制代码

Future<void> uploadInvoice() async {
    try {
      if (_isUploading) return;
      _isUploading = true;
      notifyListeners();
      final files = await _invoiceUploadRepository.pickFiles();
      if (files == null || files.isEmpty) {
        _isUploading = false;
        notifyListeners();
        return;
      }
      final prefs = await SharedPreferences.getInstance();
      final userInfo = jsonDecode(prefs.getString('userInfo')!);
      final userId = userInfo['user_id'] as int; // 明确类型转换
      final tempMessages = <String>[];
      for (final file in files) {
        try {
          final imageUrl = await _invoiceUploadRepository.uploadToOSS(
            file,
            userId,
          );
          final result = await _invoiceUploadRepository.submitInvoiceInfo(
            imageUrl,
            userId,
          );
          tempMessages.add('✅ ${path.basename(file.path)} 上传成功: $result');
          successCount++;
        } catch (e) {
          debugPrint(_getErrorMessage(e));
          tempMessages.add(
            '❌ ${path.basename(file.path)} 上传失败: 发票已存在',
          ); // 显示具体错误
        }
        notifyListeners();
      }
      _messages.addAll(tempMessages);
      _isUploaded = true;
      _messages.add('🚨 系统错误: ${_getErrorMessage(e)}');
    } catch (e) {

    } finally {
      _isUploading = false;
      notifyListeners();
    }
  }

3.3 文件的上传

复制代码

 Future<String> uploadToOSS(File file, int userId) async {
    final fileName = path.basename(file.path); // 使用 path 包获取正确文件名
    await uploadImage(file, userId);
    return 'https://fapiao.s3.bitiful.net/images/$userId/$fileName'; // 修正路径拼接
  }

文件成功上传：