在 Flutter 中播放来自 Firebase 存储的 .m3u8 视频

Question

我有 .m3u8 主文件及其部分存储在 Firebase 存储的一个文件夹中。如何在 flutter 应用程序中播放此视频？

用例：我有一个类似 TikTok 的 UI，其中每个视频都是 Firestore 中的一个文档。在每个文档中，我都有 link 到 master.m3u8 文件存储在 Firebase 存储中。

我试用了这个 .m3u8 link：https://bitdash-a.akamaihd.net/content/sintel/hls/playlist.m3u8 它适用于 video_player.

示例 link 到我的 master.m3u8 文件：https://firebasestorage.googleapis.com/v0/b/example.appspot.com/o/videos%2F10-31%2F1604100430027grBzLN0d9BQk0QtoTf9TWNe2ps02%2Fmaster.m3u8?alt=media&token=

视频文件：

编辑：

我试过使用提到的 chewie 和 video_player 包。它给我的错误如下：

E/ExoPlayerImplInternal(32708): Source error.
E/ExoPlayerImplInternal(32708): com.google.android.exoplayer2.upstream.HttpDataSource$InvalidResponseCodeException: Response code: 403
E/ExoPlayerImplInternal(32708):     at com.google.android.exoplayer2.upstream.DefaultHttpDataSource.open(DefaultHttpDataSource.java:300)
E/ExoPlayerImplInternal(32708):     at com.google.android.exoplayer2.upstream.StatsDataSource.open(StatsDataSource.java:83)
E/ExoPlayerImplInternal(32708):     at com.google.android.exoplayer2.upstream.DataSourceInputStream.checkOpened(DataSourceInputStream.java:102)
E/ExoPlayerImplInternal(32708):     at com.google.android.exoplayer2.upstream.DataSourceInputStream.open(DataSourceInputStream.java:65)
E/ExoPlayerImplInternal(32708):     at com.google.android.exoplayer2.upstream.ParsingLoadable.load(ParsingLoadable.java:156)
E/ExoPlayerImplInternal(32708):     at com.google.android.exoplayer2.upstream.Loader$LoadTask.run(Loader.java:381)
E/ExoPlayerImplInternal(32708):     at java.util.concurrent.ThreadPoolExecutor.runWorker(ThreadPoolExecutor.java:1167)
E/ExoPlayerImplInternal(32708):     at java.util.concurrent.ThreadPoolExecutor$Worker.run(ThreadPoolExecutor.java:641)
E/ExoPlayerImplInternal(32708):     at java.lang.Thread.run(Thread.java:919)

我的 .m3u8 文件的内容：

#EXTM3U
#EXT-X-VERSION:3
#EXT-X-STREAM-INF:BANDWIDTH=2410843,RESOLUTION=1080x1920,CODECS="avc1.42c02a,mp4a.40.2"
1604145635522grBzLN0d9BQk0QtoTf9TWNe2ps02%2F?alt=media

#EXT-X-STREAM-INF:BANDWIDTH=612343,RESOLUTION=1080x1920,CODECS="avc1.42c02a,mp4a.40.2"
1604145635522grBzLN0d9BQk0QtoTf9TWNe2ps02%2F1_playlistVariant.m3u8?alt=media

其中 1604145635522grBzLN0d9BQk0QtoTf9TWNe2ps02 是存储 0_playlistVariant.m3u8 和 1_playlistVariant.m3u8 文件的文件夹名称。我需要更改这些行吗？

我正在遵循 this 在 Flutter 中创建视频共享应用程序的指南。

如有任何帮助或指导，我们将不胜感激。

谢谢。

Answer 1

通过更改 Firebase 存储的安全规则以允许读取和写入来解决问题。我可以在 flutter 中通过 video_player 包播放带有 url 到 master.m3u8 文件的视频。

rules_version = '2';
service firebase.storage {
  match /b/{bucket}/o {
    match /{allPaths=**} {
      allow read; allow write;
    }
  }
}

尽管这是部分解决方案，因为任何人都可以访问数据库。

在 Flutter 中播放来自 Firebase 存储的 .m3u8 视频

Playing .m3u8 video from Firebase Storage in Flutter

dart

firebase

video-player

m3u8

flutter