flutter如何播放.m3u8视频

在Flutter中如何播放.m3u8格式的视频？我尝试使用video_player插件，但好像不支持这种格式。有没有其他可靠的第三方插件或方法可以实现.m3u8视频的播放？最好能提供具体的代码示例和使用注意事项。

2 回复

使用video_player插件，结合chewie增强UI。安装依赖后，通过VideoPlayerController.network加载.m3u8链接，用ChewieController包装实现播放控制。

更多关于flutter如何播放.m3u8视频的实战系列教程也可以访问 https://www.itying.com/category-92-b0.html


在Flutter中播放.m3u8视频，推荐使用video_player插件结合chewie插件来实现。以下是具体步骤：

1. 添加依赖

在 pubspec.yaml 中添加：

dependencies:
  video_player: ^2.8.2
  chewie: ^1.5.2

运行 flutter pub get 安装。

2. 基本实现代码

import 'package:flutter/material.dart';
import 'package:video_player/video_player.dart';
import 'package:chewie/chewie.dart';

class VideoPlayerScreen extends StatefulWidget {
  @override
  _VideoPlayerScreenState createState() => _VideoPlayerScreenState();
}

class _VideoPlayerScreenState extends State<VideoPlayerScreen> {
  late VideoPlayerController _videoPlayerController;
  late ChewieController _chewieController;

  @override
  void initState() {
    super.initState();
    _videoPlayerController = VideoPlayerController.network(
      'https://your-domain.com/example.m3u8', // 替换为你的m3u8地址
    );
    _chewieController = ChewieController(
      videoPlayerController: _videoPlayerController,
      aspectRatio: 16 / 9,
      autoPlay: true,
      looping: false,
      allowFullScreen: true,
    );
  }

  @override
  Widget build(BuildContext context) {
    return Scaffold(
      appBar: AppBar(title: Text('M3U8播放器')),
      body: Chewie(controller: _chewieController),
    );
  }

  @override
  void dispose() {
    _videoPlayerController.dispose();
    _chewieController.dispose();
    super.dispose();
  }
}

3. 平台配置

Android：

  • 在 android/app/src/main/AndroidManifest.xml 中添加网络权限：
<uses-permission android:name="android.permission.INTERNET"/>

iOS：

  • 在 ios/Runner/Info.plist 中添加：
<key>NSAppTransportSecurity</key>
<dict>
  <key>NSAllowsArbitraryLoads</key>
  <true/>
</dict>

4. 注意事项

  • 确保m3u8链接有效且可跨域访问
  • 支持HLS协议（m3u8是HLS的播放列表格式）
  • 测试时使用真实有效的m3u8地址
  • 可调整ChewieController参数自定义播放器样式

5. 替代方案

如需更高级功能（如缓存、DRM支持），可考虑：

  • flick_video_player
  • better_player
  • flutter_playout

以上方案即可实现流畅的m3u8视频播放。

回到顶部