title: Playing .m3u8 video from Firebase Storage in Flutter
body: <p>I have .m3u8 master file and its parts stored in a folder in Firebase Storage. How do I play this video in flutter app?</p>
  <p>Usecase:
  I have a TikTok-like UI, where each video is a document in Firestore. In each document I have link to master.m3u8 file stored in Firebase Storage.</p>
  <p>I tried out this .m3u8 link: <a href="https://bitdash-a.akamaihd.net/content/sintel/hls/playlist.m3u8" rel="nofollow noreferrer">https://bitdash-a.akamaihd.net/content/sintel/hls/playlist.m3u8</a>
  and it works fine with video_player.</p>
  <p>Sample link to my master.m3u8 file: <a href="https://firebasestorage.googleapis.com/v0/b/example.appspot.com/o/videos%2F10-31%2F1604100430027grBzLN0d9BQk0QtoTf9TWNe2ps02%2Fmaster.m3u8?alt=media&amp;token=" rel="nofollow noreferrer">https://firebasestorage.googleapis.com/v0/b/example.appspot.com/o/videos%2F10-31%2F1604100430027grBzLN0d9BQk0QtoTf9TWNe2ps02%2Fmaster.m3u8?alt=media&amp;token=</a>&lt;token_goes_here&gt;</p>
  <p>Video Files:<a href="https://i.stack.imgur.com/GvmZ2.png" rel="nofollow noreferrer"><img src="https://i.stack.imgur.com/GvmZ2.png" alt=".m3u8 playlist files" /></a></p>
  <p>EDIT:</p>
  <p>I have tried using chewie as mentioned <a href="https://stackoverflow.com/questions/57682604/how-to-play-m3u8-format-android-ios-on-flutter">here</a> along with video_player package., It gives me error as follows:</p>
  <pre><code>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)
  </code></pre>
  <p>Content of my .m3u8 file:</p>
  <pre><code>#EXTM3U
  #EXT-X-VERSION:3
  #EXT-X-STREAM-INF:BANDWIDTH=2410843,RESOLUTION=1080x1920,CODECS=&quot;avc1.42c02a,mp4a.40.2&quot;
  1604145635522grBzLN0d9BQk0QtoTf9TWNe2ps02%2F?alt=media
  
  #EXT-X-STREAM-INF:BANDWIDTH=612343,RESOLUTION=1080x1920,CODECS=&quot;avc1.42c02a,mp4a.40.2&quot;
  1604145635522grBzLN0d9BQk0QtoTf9TWNe2ps02%2F1_playlistVariant.m3u8?alt=media
  </code></pre>
  <p>where <code>1604145635522grBzLN0d9BQk0QtoTf9TWNe2ps02</code> is the folder name inside which <code>0_playlistVariant.m3u8</code> and <code>1_playlistVariant.m3u8</code> files are stored. Do I need to change these lines?</p>
  <p>I am following <a href="https://itnext.io/how-to-make-a-serverless-flutter-video-sharing-app-with-firebase-storage-including-hls-and-411e4fff68fa" rel="nofollow noreferrer">this</a> guide for creating a video sharing app in Flutter.</p>
  <p>Any help or direction will be appreciated.</p>
  <p>Thanks.</p>