Flutter Web重启后使用just_audio出现PlatformException如何解决？

1. 错误原因 #

在Flutter Web环境中，just_audio的平台层音频播放器实例（即错误信息中带UUID的实例）在应用重启时未被浏览器完全释放。当Dart层重新创建AudioPlayer实例并尝试关联资源时，发现平台侧已存在同标识的实例，从而触发冲突错误。

Web端资源回收逻辑和原生平台不同：应用重启时，浏览器可能保留了之前的音频上下文或播放器资源，但Dart层实例已重新初始化，两者状态不一致导致冲突。

2. Flutter Web中管理AudioPlayer实例的推荐方式 #

（1）单例模式+生命周期绑定 #

确保应用生命周期内只维护一个AudioPlayer实例，并在状态管理类销毁时显式释放资源：

class TimerNotifier extends StateNotifier<TimerState> {
  late AudioPlayer _audioPlayer;

  TimerNotifier() : super(TimerState.initial()) {
    _initAudioPlayer();
  }

  Future<void> _initAudioPlayer() async {
    _audioPlayer = AudioPlayer();
    // 可选：配置播放器参数（音量、循环模式等）
  }

  @override
  void dispose() {
    // 销毁时必须调用dispose释放平台资源
    _audioPlayer.dispose();
    super.dispose();
  }

  Future<void> playSound({required bool userTriggered}) async {
    try {
      // 检查实例是否已释放，若已释放则重新初始化
      if (_audioPlayer.state == PlayerState.disposed) {
        await _initAudioPlayer();
      }
      final selectedSound = ref.watch(selectedSoundProvider.notifier).state;
      await _audioPlayer.setAsset(selectedSound.path);
      await _audioPlayer.play();
    } catch (e) {
      print('Error playing sound: $e');
      // 捕获错误后强制销毁并重建实例
      await _audioPlayer.dispose();
      await _initAudioPlayer();
    }
  }
}

（2）Web端监听页面卸载事件 #

在Web环境中，监听浏览器beforeunload事件，确保页面卸载时彻底释放音频资源：

import 'dart:html' as html;
import 'package:flutter/foundation.dart';

void main() {
  runApp(const MyApp());

  if (kIsWeb) {
    html.window.addEventListener('beforeunload', (event) {
      final container = ProviderContainer();
      final timerNotifier = container.read(timerNotifierProvider.notifier);
      timerNotifier._audioPlayer.dispose();
      container.dispose();
    });
  }
}

（3）避免持久化播放器实例 #

不要通过shared_preferences等方式持久化AudioPlayer实例，而是在需要时延迟初始化，或在应用重启时强制重新创建实例。

（4）播放前重置播放器状态 #

每次播放前重置播放器状态，避免之前的资源残留：

Future<void> playSound({required bool userTriggered}) async {
  try {
    if (_audioPlayer.state != PlayerState.disposed) {
      await _audioPlayer.stop();
      await _audioPlayer.seek(Duration.zero);
    } else {
      await _initAudioPlayer();
    }
    final selectedSound = ref.watch(selectedSoundProvider.notifier).state;
    await _audioPlayer.setAsset(selectedSound.path);
    await _audioPlayer.play();
  } catch (e) {
    print('Error playing sound: $e');
    await _audioPlayer.dispose();
    await _initAudioPlayer();
  }
}

内容的提问来源于stack exchange，提问作者pomoworko.com