Flutter如何获取Multipart请求返回的mp4视频流并实现下载播放

错误原因 #

你调用response.stream.bytesToString()抛出格式异常的核心原因是：服务端返回的是video.mp4的二进制文件流，并非UTF-8编码的文本内容，bytesToString()方法会强制将所有字节按照UTF-8规则解码，遇到二进制文件的非文本字节就会直接触发格式错误。

正确实现方案 #

你需要将响应的二进制流直接写入本地文件，再调用视频播放器加载本地文件即可实现下载+播放的需求，完整修改方案如下：

1. 添加所需依赖 #

在pubspec.yaml中添加文件路径管理和视频播放依赖：

dependencies:
  flutter:
    sdk: flutter
  path_provider: ^2.1.0 # 用于获取应用本地存储路径
  video_player: ^2.7.0 # 用于播放本地视频

2. 修改请求逻辑，保存视频到本地 #

原请求部分只需要修改响应处理的代码即可：

Uri uri = Uri.parse(HttpLinks.localUrl);

var stream = ByteStream(image.openRead());
stream.cast();
var length = await image.length();

var request = MultipartRequest('POST', uri)
  ..files.add(
    MultipartFile(
      'file1',
      stream,
      length,
      filename:image.path,
    ),
  );
var response = await request.send();
if (response.statusCode == 200) {
  // 将响应二进制流转为字节数组
  List<int> videoBytes = await response.stream.toBytes();
  // 获取应用私有存储目录，不需要额外申请存储权限
  Directory appDocDir = await getApplicationDocumentsDirectory();
  String savePath = '${appDocDir.path}/generated_video.mp4';
  // 写入本地文件
  File videoFile = File(savePath);
  await videoFile.writeAsBytes(videoBytes);
  // 返回本地文件路径，用于后续播放
  return savePath;
}

3. 本地视频播放实现 #

拿到本地文件路径后，使用video_player加载播放即可：

late VideoPlayerController videoController;

Future<void> initPlay(String videoPath) async {
  videoController = VideoPlayerController.file(File(videoPath));
  // 初始化视频控制器
  await videoController.initialize();
  // 开始播放
  await videoController.play();
  // 界面中使用VideoPlayer(videoController)即可渲染视频画面
}

@override
void dispose() {
  // 页面销毁时释放控制器
  videoController.dispose();
  super.dispose();
}

内容的提问来源于stack exchange，提问作者Adnan haider