如何从 Django 后端向 Flutter 客户端发送视频

Question

我是移动开发的初学者，我正在创建一个在客户端使用 Flutter 并使用 Django 作为后端的移动应用程序。 我基本上是从客户端向服务器发送一些图像并在服务器端处理它们。我现在想将视频发送回客户端并在 Flutter 应用中播放。

我目前正在尝试在 Django 中使用 HTTP FileResponse 来执行此操作，而在 Flutter 中，我将接收到的响应数据作为字节写入文件中，并使用 VideoPlayer 对象显示它。我想我可能没有为此使用正确的编码器/解码器，因为视频无法播放（即使我尝试直接从手机访问文件）。

我也不确定这是让我的视频在客户端应用程序中播放的正确方法，因为我不一定想在客户端下载视频（并将其存储为文件），而只是显示它在屏幕上，但我不知道还有什么其他方式可以实现我正在寻找的东西。我查看了如何流式传输视频，但没有找到任何有用的答案。

我还没有真正找到任何使用 Flutter 和 Django 发送视频的答案，而且我似乎无法找到一种方法来完成这项工作，我做错了什么？我是否使用了正确的方法？

这是我的 Flutter 客户端代码：

var res = await dio.post('my-server-url', data: formData);
    if (res.statusCode == 200) {
      String path = (await getExternalStorageDirectory()).path;
      File videoFile = File('$path/video.mp4');

      await videoFile.writeAsBytes(utf8.encode(res.data));

      setState(() {
        _controller = VideoPlayerController.file(videoFile);
        _initializeVideoPlayerFuture = _controller.initialize();
      });
    }

（formData 是一个包含图像的 FormData 对象（在服务器端正确接收））

下面是我的 Django 服务器代码：

response = FileResponse(open('path-to-my-mp4-video', 'rb'))
return response

我在调试控制台中遇到的错误以以下开头（但之后还有很多）：

I/flutter ( 6821): server: WSGIServer/0.2 CPython/3.6.13
W/xample.deepfak( 6821): Accessing hidden method Lsun/misc/Unsafe;->compareAndSwapObject(Ljava/lang/Object;JLjava/lang/Object;Ljava/lang/Object;)Z (greylist, linking, allowed)
I/ExoPlayerImpl( 6821): Init daf69ba [ExoPlayerLib/2.12.1] [a20e, SM-A202F, samsung, 29]
E/ExoPlayerImplInternal( 6821): Playback error
E/ExoPlayerImplInternal( 6821):   com.google.android.exoplayer2.ExoPlaybackException: Source error
E/ExoPlayerImplInternal( 6821):       at com.google.android.exoplayer2.ExoPlayerImplInternal.handleMessage(ExoPlayerImplInternal.java:554)
E/ExoPlayerImplInternal( 6821):       at android.os.Handler.dispatchMessage(Handler.java:103)
E/ExoPlayerImplInternal( 6821):       at android.os.Looper.loop(Looper.java:237)
E/ExoPlayerImplInternal( 6821):       at android.os.HandlerThread.run(HandlerThread.java:67)
E/ExoPlayerImplInternal( 6821):   Caused by: com.google.android.exoplayer2.upstream.FileDataSource$FileDataSourceException: java.io.EOFException

Answer 1

我终于解决了我的问题：在 http 响应中发送整个视频文件不是正确的方法。 我将视频存储在 django 项目的“媒体”文件夹中，以便在 url 'my-server-url/media/my-video.mp4' 中可用，并在我的 http 响应中将此链接发送给客户端. 在 Flutter 中，我可以使用这个 url 播放来自网络的视频（使用 VideoPlayerController.network()）。

Answer 2

如果我正确理解您的问题，您可以尝试这种方式。 当从客户端上传视频文件时，请将视频文件上传到您服务器上的 amazon s3 服务器上。然后将亚马逊服务器中视频文件的链接存储到您的数据库中并返回给您的客户端。 您的客户端（应用）可以通过该链接播放视频。