newtaDev / pod_player

Video player for flutter web & mobile devices, Play video from youtube or vimeo or network in flutter using pod player
https://pub.dev/packages/pod_player
MIT License
106 stars 202 forks source link

YOUTUBE API ERROR: ClientException: XMLHttpRequest error., #185

Open shabbirdudhiya opened 7 months ago

shabbirdudhiya commented 7 months ago

I am trying to play a youtube video but it gives me errors. I am sure I have enabled cors too as shown in docs Errors: image

:51279/#/home:1 Access to XMLHttpRequest at 'https://www.youtube.com/youtubei/v1/player?key=AIzaSyA8eiZmM1FaDVjRy-df2KTyQ_vz_yYM39w&prettyPrint=false' from origin 'http://localhost:51279' has been blocked by CORS policy: Response to preflight request doesn't pass access control check: No 'Access-Control-Allow-Origin' header is present on the requested resource.
www.youtube.com/youtubei/v1/player?key=AIzaSyA8eiZmM1FaDVjRy-df2KTyQ_vz_yYM39w&prettyPrint=false:1 

My Code:

import 'package:flutter/material.dart';
import 'package:pod_player/pod_player.dart';

class VideoPlayerView extends StatefulWidget {
  const VideoPlayerView({
    super.key,
    required this.videoTitle,
    required this.youtubeId,
    required this.courseId,
  });

  final String videoTitle;
  final String youtubeId;
  final String courseId;

  @override
  State<VideoPlayerView> createState() => _VideoPlayerViewState();
}

class _VideoPlayerViewState extends State<VideoPlayerView> {
  late final PodPlayerController controller;

  @override
  void initState() {
    controller = PodPlayerController(
      playVideoFrom: PlayVideoFrom.youtube('https://youtu.be/A3ltMaM6noM'),
    )..initialise();
    super.initState();
  }

  @override
  void dispose() {
    controller.dispose();
    super.dispose();
  }

  @override
  Widget build(BuildContext context) {
    return SafeArea(
      child: Scaffold(
        appBar: AppBar(
          title: Text(widget.videoTitle),
        ),
        body: PodVideoPlayer(
          controller: controller,
          onVideoError: () {
            return const Text(
              'There was an error loading video',
            );
          },
          videoThumbnail: DecorationImage(
            image: NetworkImage(
              'https://img.youtube.com/vi/${widget.youtubeId}/0.jpg',
            ),
          ),
        ),
      ),
    );
  }
}
shabbirdudhiya commented 7 months ago

It works well in debug. How to solve the cors issue in production?