Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

[video_player] Add network cache functionality #28094

Open
nagoya0 opened this issue Feb 18, 2019 · 102 comments
Open

[video_player] Add network cache functionality #28094

nagoya0 opened this issue Feb 18, 2019 · 102 comments
Assignees
Labels
c: new feature Nothing broken; request for a new capability Bot is counting down the days until it unassigns the issue p: video_player The Video Player plugin P2 Important issues not at the top of the work list package flutter/packages repository. See also p: labels. team-ecosystem Owned by Ecosystem team triaged-ecosystem Triaged by Ecosystem team

Comments

@nagoya0
Copy link

nagoya0 commented Feb 18, 2019

Steps to Reproduce

I built this sample:

https://github.com/flutter/plugins/tree/master/packages/video_player/example
(v0.10.0+2)

and switched tab from side to side. Downloaded videos are disappear and started redownloading every time.

Flutter Doctor

[√] Flutter (Channel beta, v0.11.10, on Microsoft Windows [Version 10.0.17763.316], locale ja-JP)
    • Flutter version 0.11.10 at C:\flutter
    • Framework revision c27c4a265e (3 months ago), 2018-11-26 17:07:24 -0500
    • Engine revision eebc6a5895
    • Dart version 2.1.0 (build 2.1.0-dev.9.4 f9ebf21297)

[√] Android toolchain - develop for Android devices (Android SDK 28.0.3)
    • Android SDK at C:\Users\XXXXXXXX\AppData\Local\Android\sdk
    • Android NDK location not configured (optional; useful for native profiling support)
    • Platform android-28, build-tools 28.0.3
    • Java binary at: C:\Program Files\Android\Android Studio\jre\bin\java
    • Java version OpenJDK Runtime Environment (build 1.8.0_152-release-1248-b01)
    • All Android licenses accepted.

[√] Android Studio (version 3.3)
    • Android Studio at C:\Program Files\Android\Android Studio
    • Flutter plugin version 33.0.1
    • Dart plugin version 182.5215
    • Java version OpenJDK Runtime Environment (build 1.8.0_152-release-1248-b01)

[√] Connected device (1 available)
    • Pixel 3 • XXXXXXXXX • android-arm64 • Android 9 (API 28)

• No issues found!
@zoechi zoechi added c: new feature Nothing broken; request for a new capability plugin p: video_player The Video Player plugin labels Feb 18, 2019
@zoechi zoechi added this to the Goals milestone Feb 18, 2019
@Agraphie
Copy link

Is there any intermediate solution for this problem? Otherwise any app which uses videos will drain your data volume quite fast.

@ohjs88
Copy link

ohjs88 commented Aug 6, 2019

I cached the data by adding some code as shown below.
(I modified video_player 0.10.1+6.)

VideoPlayerPlugin.java

Added code


    private static SimpleCache sDownloadCache;

    class CacheDataSourceFactory implements DataSource.Factory {
      private final Context context;
      private final DefaultDataSourceFactory defaultDatasourceFactory;
      private final long maxFileSize, maxCacheSize;

      CacheDataSourceFactory(Context context, long maxCacheSize, long maxFileSize) {
        super();
        this.context = context;
        this.maxCacheSize = maxCacheSize;
        this.maxFileSize = maxFileSize;
        //String userAgent = Util.getUserAgent(context, context.getString("ExoPlayer"));
        DefaultBandwidthMeter bandwidthMeter = new DefaultBandwidthMeter();
        defaultDatasourceFactory = new DefaultDataSourceFactory(this.context, bandwidthMeter,
            new DefaultHttpDataSourceFactory("ExoPlayer", bandwidthMeter,DefaultHttpDataSource.DEFAULT_CONNECT_TIMEOUT_MILLIS, DefaultHttpDataSource.DEFAULT_READ_TIMEOUT_MILLIS,true));
      }

      @Override
      public DataSource createDataSource() {
        LeastRecentlyUsedCacheEvictor evictor = new LeastRecentlyUsedCacheEvictor(maxCacheSize);
        
        if (sDownloadCache == null) {
            sDownloadCache = new SimpleCache(context.getCacheDir(),evictor);
        }

        return new CacheDataSource(sDownloadCache, defaultDatasourceFactory.createDataSource(), new FileDataSource(),
            new CacheDataSink(sDownloadCache, maxFileSize),
            CacheDataSource.FLAG_BLOCK_ON_CACHE | CacheDataSource.FLAG_IGNORE_CACHE_ON_ERROR, null);
      }
    }

Modified code


 if (isFileOrAsset(uri)) {
        dataSourceFactory = new DefaultDataSourceFactory(context, "ExoPlayer");
      } else {
        // dataSourceFactory = new DefaultHttpDataSourceFactory("ExoPlayer", null,
        //     DefaultHttpDataSource.DEFAULT_CONNECT_TIMEOUT_MILLIS, DefaultHttpDataSource.DEFAULT_READ_TIMEOUT_MILLIS,
        //     true);
        dataSourceFactory = new CacheDataSourceFactory(context, 100 * 1024 * 1024, 5 * 1024 * 1024);
      }

See the url below.

@lifenautjoe
Copy link

lifenautjoe commented Sep 3, 2019

Any other way so far that doesn't involve monkey-patching the library? And that works for iOS as well?

@lifenautjoe
Copy link

Here's a plugin for the iOS AV player that might help. https://github.com/vitoziv/VIMediaCache

@lukepighetti
Copy link

lukepighetti commented Sep 20, 2019

I need video caching as well, iOS and Android with video_player, does anyone have time to put this together? Use case is a Instagram Stories type of interface where users will progress slowly through videos but reverse quickly. Even if we could get video_player to cache the first 10 seconds that would be fine, just enough to give it time to buffer again.

@lukepighetti
Copy link

@ohjs88 Can you make a PR against video_player for your cached android code? Do you happen to have iOS code as well?

@lukepighetti
Copy link

lukepighetti commented Sep 20, 2019

Is it possible to get the file out of video_player and save it to disk with Dart code? Not sure if that's obscene or not.

@lukepighetti
Copy link

Has anyone tried caching the loaded VideoPlayerControllers in Dart?

@lukepighetti
Copy link

I tried that out and it does work but you end up with some strange behavior. The app runs out of memory real quick.

@lifenautjoe
Copy link

For what's worth, @999eagle got caching working on both iOS and android on a custom fork of the plugins repository video_player. We hope to open a PR with this back into the plugins repo at some point.

  video_player:
    git:
      url: https://github.com/999eagle/plugins.git
      ref: feature/caching
      path: packages/video_player

Limit is set to 200mbs

Here are the commits with the magic.

https://github.com/999eagle/plugins/commits/feature/caching

Thanks to her work, we've now got video playing in our app :-)

@lukepighetti
Copy link

@lifenautjoe Thanks for the heads up, is there any reason why there hasn't been a PR back to flutter/plugins ?

@lifenautjoe
Copy link

lifenautjoe commented Sep 21, 2019

We're busy with post release activities 😬 , we just got this working a couple days back. We'll PR it back ASAP.

@lukepighetti
Copy link

lukepighetti commented Sep 21, 2019

Much appreciated for the updates, I'm going to watch that repo for movement/PR. Congrats on the launch!

@lukepighetti
Copy link

lukepighetti commented Sep 21, 2019

@lifenautjoe Do you guys have a commit cherry picked? This branch appears to not load a .mov file over network that otherwise works with video_player: ^0.10.2+1

Video in question: https://firebasestorage.googleapis.com/v0/b/skatex-8d802.appspot.com/o/test%2Ftest.mov?alt=media&token=a59686ca-09cc-4be4-ba70-5069b3c42da7

For some reason the feature/caching branch doesn't like the URL

When running on XCode these are the logs

2019-09-21 18:08:27.812871-0400 Runner[5519:1637802] flutter: Observatory listening on http://127.0.0.1:57074/-yBssRMosLw=/

2019-09-21 18:08:28.280307-0400 Runner[5519:1637790] flutter: VideoPlayerValue(duration: null, size: null, position: 0:00:00.000000, buffered: [], isPlaying: false, isLooping: false, isBuffering: falsevolume: 1.0, errorDescription: null)

2019-09-21 18:08:28.280977-0400 Runner[5519:1637790] flutter: VideoPlayerValue(duration: null, size: null, position: 0:00:00.000000, buffered: [], isPlaying: true, isLooping: false, isBuffering: falsevolume: 1.0, errorDescription: null)

2019-09-21 18:08:28.384399-0400 Runner[5519:1637782] Task .<1> finished with error - code: -1002

2019-09-21 18:08:28.386857-0400 Runner[5519:1637781] Task .<1> load failed with error Error Domain=NSURLErrorDomain Code=-1002 "unsupported URL" UserInfo={NSLocalizedDescription=unsupported URL, NSErrorFailingURLStringKey=a59686ca-09cc-4be4-ba70-5069b3c42da7, NSErrorFailingURLKey=a59686ca-09cc-4be4-ba70-5069b3c42da7, _NSURLErrorRelatedURLSessionTaskErrorKey=(
"LocalDataTask .<1>"
), _NSURLErrorFailingURLSessionTaskErrorKey=LocalDataTask .<1>, NSUnderlyingError=0x2821c0210 {Error Domain=kCFErrorDomainCFNetwork Code=-1002 "(null)"}} [-1002]

2019-09-21 18:08:28.453100-0400 Runner[5519:1637790] flutter: VideoPlayerValue(duration: null, size: null, position: 0:00:00.000000, buffered: [], isPlaying: false, isLooping: false, isBuffering: falsevolume: 1.0, errorDescription: Failed to load video: unsupported URL)

@lifenautjoe
Copy link

lifenautjoe commented Sep 21, 2019 via email

@lukepighetti
Copy link

lukepighetti commented Sep 22, 2019

I did get it to work, and the caching works beautifully. However, there are still some strange issues.

This video & URL works. http://techslides.com/demos/sample-videos/small.mp4

Copied to my host, this URL fails. https://firebasestorage.googleapis.com/v0/b/skatex-8d802.appspot.com/o/test%2Fsmall.mp4?alt=media&token=82cdf4a4-78e4-46e6-a6ab-8456f7f0a0eb

Using Dart URI encoding, it also fails Uri.encodeFull("https://firebasestorage.googleapis.com/v0/b/skatex-8d802.appspot.com/o/test%2Fsmall.mp4?alt=media&token=82cdf4a4-78e4-46e6-a6ab-8456f7f0a0eb")

That method produces this link https://firebasestorage.googleapis.com/v0/b/skatex-8d802.appspot.com/o/test%252Fsmall.mp4?alt=media&token=82cdf4a4-78e4-46e6-a6ab-8456f7f0a0eb

Percent encoded (using https://www.url-encode-decode.com), it works. https%3A%2F%2Ffirebasestorage.googleapis.com%2Fv0%2Fb%2Fskatex-8d802.appspot.com%2Fo%2Ftest%252Fsmall.mp4%3Falt%3Dmedia%26token%3D82cdf4a4-78e4-46e6-a6ab-8456f7f0a0eb

Not sure if this is helpful, but I did see some mention to percent encoding here https://stackoverflow.com/questions/11362153/bad-url-error-with-nsurlrequest

@lukepighetti
Copy link

Another case....

This works on the pub.dev version of video_player but fails on the feature/caching version

https://firebasestorage.googleapis.com/v0/b/skatex-8d802.appspot.com/o/test%2Ftest-Broadband%20Low.mp4?alt=media&token=00f64abd-c552-4d7b-a964-72a22811722f

However, it will not play on either as a percent encoded url
https%3A%2F%2Ffirebasestorage.googleapis.com%2Fv0%2Fb%2Fskatex-8d802.appspot.com%2Fo%2Ftest%252Ftest-Broadband%2520Low.mp4%3Falt%3Dmedia%26token%3D00f64abd-c552-4d7b-a964-72a22811722f

@lukepighetti
Copy link

lukepighetti commented Sep 22, 2019

Alright, I got it working by encoding the URL with this line. It seems heavy handed but I'm getting good results.

NSString *escapedURL = [uriArg stringByAddingPercentEncodingWithAllowedCharacters:NSMutableCharacterSet.alphanumericCharacterSet];

@lukepighetti
Copy link

Pull request: 999eagle/plugins@ed5e865

@lukepighetti
Copy link

@lifenautjoe @999eagle just got to it and VideoPlayerController.file() does not work on iOS on 999eagle/plugins/video_player @ feature/caching. Any insights?

@lukepighetti
Copy link

I believe this makes feature/caching ready for PR on iOS. I haven't tried Android yet

999eagle/plugins#2

@recastrodiaz
Copy link

recastrodiaz commented Oct 4, 2019

I have an alternative video networking caching implementation if anyone is interested in using it:

flutter/plugins@master...recastrodiaz:develop2

It has other features as well like:

  • audio focus
  • clipping videos
  • playback speed feature
  • fixes some videos showing a black screen on iOS
  • more recent ExoPlayer
  • load videos from phAssets on iOS

@lukepighetti
Copy link

I’m going to check it out because you’ve added some features I need myself. Will you be making a PR against video_player? Is it cross platform?

@Hixie Hixie removed the plugin label Jul 6, 2023
@flutter-triage-bot flutter-triage-bot bot added team-ecosystem Owned by Ecosystem team triaged-ecosystem Triaged by Ecosystem team labels Jul 8, 2023
@seljad

This comment was marked as off-topic.

@riveraj33

This comment was marked as off-topic.

@seljad

This comment was marked as off-topic.

@riveraj33

This comment was marked as off-topic.

@seljad

This comment was marked as off-topic.

@stuartmorgan
Copy link
Contributor

@seljad @riveraj33 Please read my comment above.

@kishangohel

This comment was marked as off-topic.

@stuartmorgan
Copy link
Contributor

Assigning myself to coordinate tracking of the in-progress PR.

@ciriousjoker
Copy link

@stuartmorgan thanks a lot! The cached_video_player package isn't being maintained anymore since the dev has no time. Supporting this in the official video player would be huge!

@kishangohel
Copy link

It will be better if we have buffer control too with caching @stuartmorgan

@kishangohel
Copy link

kishangohel commented Nov 17, 2023

@stuartmorgan there is no activity or development going on https://github.com/flutter/packages/pull/4526 from last 2 weeks

@stuartmorgan stuartmorgan changed the title Add network cache functionality to video_player [video_player] Add network cache functionality Jan 4, 2024
@chorauoc

This comment was marked as off-topic.

@kishangohel

This comment was marked as off-topic.

@cosin666

This comment was marked as off-topic.

@flutter-triage-bot flutter-triage-bot bot added the Bot is counting down the days until it unassigns the issue label May 9, 2024
@flutter-triage-bot
Copy link

This issue is assigned to @stuartmorgan but has had no recent status updates. Please consider unassigning this issue if it is not going to be addressed in the near future. This allows people to have a clearer picture of what work is actually planned. Thanks!

@priyesh-techabbot

This comment was marked as off-topic.

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
c: new feature Nothing broken; request for a new capability Bot is counting down the days until it unassigns the issue p: video_player The Video Player plugin P2 Important issues not at the top of the work list package flutter/packages repository. See also p: labels. team-ecosystem Owned by Ecosystem team triaged-ecosystem Triaged by Ecosystem team
Projects
None yet
Development

Successfully merging a pull request may close this issue.