video player error

[rudrasharma2]

Describe the bug

All the provider except zoro are not working with flutter

Steps to reproduce

These are parts of code of a project

  VideoPlayerNotifier({required this.episode, required this.animeInfoService})
      : super(const VideoPlayerState.loading("")) {
    init();
  }

  final Episode episode;
  final AnimeInfoData animeInfoService;

  BetterPlayerController? betterPlayerController;

  void init() async {
    state =
        const VideoPlayerState.loading("fetching episode urls from server...");
    try {
      log("init");
      if (episode.id == null) {
        state = const VideoPlayerState.error({
          "error": "Something went wrong, Please try with different provider"
        });
      }
      EpisodeUrl? episodeUrls = await getEpisodeUrl();
      if (episodeUrls != null) {
        initializePlayer(episodeUrls);
      }
    } catch (e, st) {
      log("$e");
      log("$st");
      state = VideoPlayerState.error(e);
    }
  }

  Future<EpisodeUrl?> getEpisodeUrl({bool cancelToken = false}) async {
    EpisodeUrl? episodeUrl;
    if (cancelToken) {
      final cancelToken = CancelToken();
      animeInfoService.getEpisodeUrl(
          episodeId: episode.id!, cancelToken: cancelToken);
    } else {
      episodeUrl = await animeInfoService.getEpisodeUrl(episodeId: episode.id!);
    }
    return episodeUrl;
  }

  Future<void> initializePlayer(EpisodeUrl episodeSource) async {
    state = const VideoPlayerState.loading("initialing player");
    List<Source>? sources = episodeSource.sources;
    var subtitles = episodeSource.subtitles;
    Map<String, String>? headers = {
      if (episodeSource.headers != null) ...episodeSource.headers!,
      "user-agent":
          "Mozilla/5.0 (Windows NT 10.0; Win64; x64; rv:101.0) Gecko/20100101 Firefox/101.0"
    };

    /// if sources is empty return error
    if (sources == null) {
      state = const VideoPlayerState.error({"error": "No source found"});
      return;
    }

    String? firstSource() {
      String? url;
      try {
        var isAuto = sources
            .firstWhere(
                (element) =>
                    element.url != null && element.quality == "auto" ||
                    element.quality == "default",
                orElse: () =>
                    sources.firstWhere((element) => element.url != null))
            .url;
        if (isAuto != null) {
          url = isAuto.toString();
        } else {
          url = sources
              .firstWhere((element) => element.url != null)
              .url
              .toString();
        }
      } catch (e) {
        state = const VideoPlayerState.error({"error": "No source found"});
      }
      return url;
    }

    /// if [sources] is not null
    ///
    try {
      var dataSource = BetterPlayerDataSource(
          BetterPlayerDataSourceType.network, firstSource()!,
          resolutions: {
            for (var item in sources) "${item.quality}": "${item.url}"
          },
          subtitles: subtitles
              ?.map((e) => BetterPlayerSubtitlesSource(
                    selectedByDefault: e.lang == "English",
                    name: e.lang,
                    type: BetterPlayerSubtitlesSourceType.network,
                    urls: [e.url],
                  ))
              .toList(),
          videoFormat:
              sources.firstWhere((element) => element.isM3U8 != null).isM3U8 ==
                      true
                  ? BetterPlayerVideoFormat.hls
                  : BetterPlayerVideoFormat.other,
          headers: headers,
          bufferingConfiguration: const BetterPlayerBufferingConfiguration(
            minBufferMs: 50000,
            maxBufferMs: 13107200,
            bufferForPlaybackMs: 2500,
            bufferForPlaybackAfterRebufferMs: 5000,
          ),
          cacheConfiguration: const BetterPlayerCacheConfiguration(
            useCache: true,
            preCacheSize: 400000,
            maxCacheSize: 400000,
            maxCacheFileSize: 400000,
          ),

          /// notification configuration
          ///
          notificationConfiguration: BetterPlayerNotificationConfiguration(
            showNotification: true,
            title: "Episode ${episode.number} ${episode.title}",
            author: episode.description,
            imageUrl: episode.image,
            activityName: "MainActivity",
          ));

      betterPlayerController =
          BetterPlayerController(betterPlayerConfiguration);

      await betterPlayerController?.setupDataSource(dataSource);

      state = VideoPlayerState.data(betterPlayerController!);
    } catch (e, st) {
      log("$e");
      log("$st");
      state = VideoPlayerState.error({
        "Something went wrong!\n Please try with different provider":
            e.toString()
      });
    }
  }

  @override
  void dispose() {
    getEpisodeUrl(cancelToken: true);
    betterPlayerController?.dispose(forceDispose: true);
    betterPlayerController?.clearCache();
    super.dispose();
  }
}

const BetterPlayerConfiguration betterPlayerConfiguration =
    BetterPlayerConfiguration(
  autoDetectFullscreenAspectRatio: true,
  fit: BoxFit.fitHeight,
  aspectRatio: 16 / 9,
  handleLifecycle: false,
  autoDetectFullscreenDeviceOrientation: true,
  autoPlay: false,
  allowedScreenSleep: false,
  autoDispose: true,
  fullScreenAspectRatio: 16 / 9,
  fullScreenByDefault: true,
  placeholder: SizedBox(),
  deviceOrientationsAfterFullScreen: [DeviceOrientation.portraitUp],
  deviceOrientationsOnFullScreen: [
    DeviceOrientation.landscapeRight,
    DeviceOrientation.landscapeLeft
  ],
  controlsConfiguration: BetterPlayerControlsConfiguration(
    overflowMenuIcon: Icons.settings_outlined,
    playIcon: Icons.play_arrow_outlined,
    pauseIcon: Icons.pause,
    muteIcon: Icons.volume_mute_outlined,
    unMuteIcon: Icons.volume_up_outlined,
    playbackSpeedIcon: Icons.speed_outlined,
    subtitlesIcon: Icons.subtitles_outlined,
    audioTracksIcon: Icons.audiotrack_outlined,
    playerTheme: BetterPlayerTheme.cupertino,
  ),
);

class AnimeInfoData implements AnimeInfoRepository {
  final HttpService dio;
  final String provider;
  AnimeInfoData(this.dio, this.provider);

  @override
  Future<AnimeInfoModel?> getAnimeInfo(
      {required String id, CancelToken? cancelToken}) async {
    final response = await dio.get("${Configs.infoUrl}/$id",
        queryParameters: {"provider": provider}, cancelToken: cancelToken);
    return AnimeInfoModel.fromJson(response);
  }

  @override
  Future<EpisodeUrl?> getEpisodeUrl(
      {required String episodeId, CancelToken? cancelToken}) async {
    final response = await dio.get("${Configs.watchUrl}/$episodeId",
        queryParameters: {"provider": provider}, cancelToken: cancelToken);
    return EpisodeUrl.fromJson(response);
  }
}

Expected behavior

This code should play videos from most of the providers as their implementation are same.

Actual behavior

The video player is playing videos with zoro provider but any other provider are throwing error:

PlatformException(VideoError, Video player had error com.google.android.exoplayer2.ExoPlaybackException: Source error, , null)

Additional context

This is full project

[IrfanKhan66]

Brother can you help me out i am unable to play the m3u8 streaming links provided by zoro it was playing on my mobile but not on my laptop, ive tried using hls.js, videojs, shaka player, none works can you help me out please

[humamchoudhary]

If you are using flutter for mobile app then i would recommend flickPlayer as its the only one that worked with m8u3 link that i know of. also check if it is supported on windows last time i checked it wasnt. Here is a exmple setup for it: https://github.com/humamchoudhary/Vwatch/blob/main/Frontend/vwatch/lib/page/video.dart

[humamchoudhary]

the error you have quoted means that the URL has no data. However, this error can also be due to the player not supporting the m8u3 file format. And for me all the extensions work but I mostly use gogoanime or 9Anime

[Dovakiin0]

FijkPlayer supports m3u8 for flutter.
https://github.com/Dovakiin0/animeworldz-flutter/blob/master/lib/Screens/watch.dart

[humamchoudhary]

Brother can you help me out i am unable to play the m3u8 streaming links provided by zoro it was playing on my mobile but not on my laptop, ive tried using hls.js, videojs, shaka player, none works can you help me out please

if you want to play on web browser then use video.js or hls.js and for some reason zoro does not supports the any web video player. The only one that works with web is the flixhq use they also have animes so it isnt a problem. Note if you are using flutter to make the web or desktop app there is any video player supported for it the last time i checked so you will have to make a work around or i would suggest using nextjs or reactjs for it.