chewie
chewie copied to clipboard
Web: Detect if the user has not interacted with the page yet
On web, autoplay does not work if the user has not interacted with the page yet.
This example shows a broken video without the ability to play it:
import 'package:chewie/chewie.dart';
import 'package:flutter/material.dart';
import 'package:video_player/video_player.dart';
late VideoPlayerController videoPlayerController;
late ChewieController chewieController;
final routerDelegate = MyRouterDelegate();
Future<void> main() async {
WidgetsFlutterBinding.ensureInitialized();
videoPlayerController =
VideoPlayerController.networkUrl(Uri.parse('https://flutter.github.io/assets-for-api-docs/assets/videos/bee.mp4'));
await videoPlayerController.initialize();
chewieController = ChewieController(
videoPlayerController: videoPlayerController,
autoPlay: true,
);
runApp(MyApp());
}
class MyApp extends StatelessWidget {
@override
Widget build(BuildContext context) {
return MaterialApp.router(
routerDelegate: routerDelegate,
);
}
}
class MyRouterDelegate extends RouterDelegate<Object>
with ChangeNotifier, PopNavigatorRouterDelegateMixin<Object> {
@override
final GlobalKey<NavigatorState> navigatorKey = GlobalKey<NavigatorState>();
@override
Widget build(BuildContext context) {
return Navigator(
pages: [
MaterialPage(
key: ValueKey('HomePage'),
child: Chewie(controller: chewieController),
),
],
onPopPage: (route, result) => true,
);
}
@override
Future<void> setNewRoutePath(configuration) async {}
}
For some reason, I don't see an error in the console, but if I add print(e); to the error handler in video_player.dart, it shows this in Chrome:
NotAllowedError: play() failed because the user didn't interact with the document first. https://goo.gl/xX8pDD
I expect that if autoplay can't work I still have a functional player even if not started automatically.
This happens in the real world with deep linking when people share links to my video pages.