求助：如何在Flutter中解码Base64视频并播放？

你已经通过以下代码将录制的视频文件编码为Base64字符串：

_fileConvert(String path) {
    File file = File(path);
    List<int> fileInByte = file.readAsBytesSync();
    String fileInBase64 = base64Encode(fileInByte);
    print("fileInBase64............");
    print(fileInBase64);
}

下面是解码Base64并播放视频的具体实现步骤：

1. 依赖准备 #

在pubspec.yaml中添加所需依赖：

dependencies:
  flutter:
    sdk: flutter
  video_player: ^2.8.1 # 使用最新稳定版本
  path_provider: ^2.1.1 # 用于获取临时目录（可选，保存临时文件时需要）

执行flutter pub get完成依赖安装。

2. 解码Base64字符串 #

将Base64字符串转换为字节数组：

import 'dart:convert';
import 'dart:typed_data';

Uint8List decodeBase64Video(String base64Str) {
  return base64Decode(base64Str);
}

3. 视频播放实现 #

方案一：保存为临时文件播放（推荐，适合大视频） #

将解码后的字节写入临时文件，再通过video_player播放：

import 'dart:io';
import 'package:path_provider/path_provider.dart';
import 'package:video_player/video_player.dart';

Future<VideoPlayerController> playVideoFromBase64(String base64Str) async {
  // 解码Base64
  Uint8List videoBytes = decodeBase64Video(base64Str);
  
  // 获取临时目录
  Directory tempDir = await getTemporaryDirectory();
  File tempFile = File('${tempDir.path}/temp_video.mp4');
  
  // 写入字节到临时文件
  await tempFile.writeAsBytes(videoBytes);
  
  // 初始化播放器
  VideoPlayerController controller = VideoPlayerController.file(tempFile);
  await controller.initialize();
  return controller;
}

在Widget中使用：

class VideoPlayerWidget extends StatefulWidget {
  final String base64Video;
  const VideoPlayerWidget({super.key, required this.base64Video});

  @override
  State<VideoPlayerWidget> createState() => _VideoPlayerWidgetState();
}

class _VideoPlayerWidgetState extends State<VideoPlayerWidget> {
  VideoPlayerController? _controller;

  @override
  void initState() {
    super.initState();
    _initPlayer();
  }

  void _initPlayer() async {
    _controller = await playVideoFromBase64(widget.base64Video);
    setState(() {});
  }

  @override
  void dispose() {
    _controller?.dispose();
    super.dispose();
  }

  @override
  Widget build(BuildContext context) {
    if (_controller == null) {
      return const Center(child: CircularProgressIndicator());
    }
    return AspectRatio(
      aspectRatio: _controller!.value.aspectRatio,
      child: VideoPlayer(_controller!),
    );
  }
}

方案二：直接使用内存字节播放（适合小视频） #

利用VideoPlayerController.memory直接加载内存中的字节：

Future<VideoPlayerController> playVideoFromMemory(String base64Str) async {
  Uint8List videoBytes = decodeBase64Video(base64Str);
  VideoPlayerController controller = VideoPlayerController.memory(videoBytes);
  await controller.initialize();
  return controller;
}

Widget使用方式和方案一一致，只需替换_initPlayer中的调用即可。

注意事项 #

• 确保视频编码格式（如MP4）被video_player支持，不同平台支持的格式略有差异。
• 大视频不建议使用内存播放，容易引发内存溢出问题，优先选择临时文件方案。
• 临时文件可在使用后删除，避免占用存储空间：await tempFile.delete();

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