SimformSolutionsPvtLtd · vasu-nageshri · Jan 9, 2026
diff --git a/CHANGELOG.md b/CHANGELOG.md
@@ -1,6 +1,7 @@
 ## 2.1.0 (#unreleased)
 
 - Feature [#468](https://github.com/SimformSolutionsPvtLtd/audio_waveforms/pull/468) - Add macOS support
+- Feature [#472](https://github.com/SimformSolutionsPvtLtd/audio_waveforms/pull/472) - Add web platform support for audio player
 
 ## 2.0.2
 

diff --git a/example/lib/main.dart b/example/lib/main.dart
@@ -3,6 +3,7 @@ import 'dart:io';
 import 'package:audio_waveforms/audio_waveforms.dart';
 import 'package:audio_waveforms_example/chat_bubble.dart';
 import 'package:file_picker/file_picker.dart';
+import 'package:flutter/foundation.dart';
 import 'package:flutter/material.dart';
 import 'package:flutter/services.dart';
 import 'package:path_provider/path_provider.dart';
@@ -52,6 +53,20 @@ class _HomeState extends State<Home> {
 
   Future<void> _init() async {
     recorderController = RecorderController();
+    // TODO(vasu): This is a simplified implementation for demonstration purposes.
+    // On web, asset paths work differently than native platforms. For production
+    // web apps, consider:
+    // 1. Using proper web URLs (http://example.com/audio.mp3)
+    // 2. Converting assets to base64-encoded data URIs
+    // 3. Using Flutter's AssetBundle to properly load web assets
+    // 4. Implementing proper CORS handling for external audio sources
+    if (kIsWeb) {
+      paths.addAll(assetPaths);
+      isLoading = false;
+      setState(() {});
+      return;
+    }
+
     appDirectory = await getApplicationDocumentsDirectory();
     for (final path in assetPaths) {
       final fileName = path.split('/').last;
@@ -204,6 +219,13 @@ class _HomeState extends State<Home> {
 
   void _startOrStopRecording() async {
     try {
+      if (kIsWeb) {
+        ScaffoldMessenger.of(context).showSnackBar(
+          const SnackBar(content: Text('Recording not supported on web')),
+        );
+        return;
+      }
+
       if (isRecording) {
         recorderController.reset();
 

diff --git a/example/pubspec.yaml b/example/pubspec.yaml
@@ -26,7 +26,7 @@ dependencies:
     # the parent directory to use the current plugin's version.
     path: ../
   path_provider: ^2.0.11
-  file_picker: 8.0.7
+  file_picker: 10.3.8
 
   # The following adds the Cupertino Icons font to your application.
   # Use with the CupertinoIcons class for iOS style icons.

diff --git a/example/web/favicon.png b/example/web/favicon.png
diff --git a/example/web/icons/Icon-192.png b/example/web/icons/Icon-192.png
diff --git a/example/web/icons/Icon-512.png b/example/web/icons/Icon-512.png
diff --git a/example/web/icons/Icon-maskable-192.png b/example/web/icons/Icon-maskable-192.png
diff --git a/example/web/icons/Icon-maskable-512.png b/example/web/icons/Icon-maskable-512.png
diff --git a/example/web/index.html b/example/web/index.html
@@ -0,0 +1,38 @@
+<!DOCTYPE html>
+<html>
+<head>
+  <!--
+    If you are serving your web app in a path other than the root, change the
+    href value below to reflect the base path you are serving from.
+
+    The path provided below has to start and end with a slash "/" in order for
+    it to work correctly.
+
+    For more details:
+    * https://developer.mozilla.org/en-US/docs/Web/HTML/Element/base
+
+    This is a placeholder for base href that will be replaced by the value of
+    the `--base-href` argument provided to `flutter build`.
+  -->
+  <base href="$FLUTTER_BASE_HREF">
+
+  <meta charset="UTF-8">
+  <meta content="IE=Edge" http-equiv="X-UA-Compatible">
+  <meta name="description" content="A new Flutter project.">
+
+  <!-- iOS meta tags & icons -->
+  <meta name="mobile-web-app-capable" content="yes">
+  <meta name="apple-mobile-web-app-status-bar-style" content="black">
+  <meta name="apple-mobile-web-app-title" content="audio_waveforms_example">
+  <link rel="apple-touch-icon" href="icons/Icon-192.png">
+
+  <!-- Favicon -->
+  <link rel="icon" type="image/png" href="favicon.png"/>
+
+  <title>audio_waveforms_example</title>
+  <link rel="manifest" href="manifest.json">
+</head>
+<body>
+  <script src="flutter_bootstrap.js" async></script>
+</body>
+</html>
diff --git a/example/web/manifest.json b/example/web/manifest.json
@@ -0,0 +1,35 @@
+{
+    "name": "audio_waveforms_example",
+    "short_name": "audio_waveforms_example",
+    "start_url": ".",
+    "display": "standalone",
+    "background_color": "#0175C2",
+    "theme_color": "#0175C2",
+    "description": "A new Flutter project.",
+    "orientation": "portrait-primary",
+    "prefer_related_applications": false,
+    "icons": [
+        {
+            "src": "icons/Icon-192.png",
+            "sizes": "192x192",
+            "type": "image/png"
+        },
+        {
+            "src": "icons/Icon-512.png",
+            "sizes": "512x512",
+            "type": "image/png"
+        },
+        {
+            "src": "icons/Icon-maskable-192.png",
+            "sizes": "192x192",
+            "type": "image/png",
+            "purpose": "maskable"
+        },
+        {
+            "src": "icons/Icon-maskable-512.png",
+            "sizes": "512x512",
+            "type": "image/png",
+            "purpose": "maskable"
+        }
+    ]
+}
diff --git a/lib/audio_waveforms_web.dart b/lib/audio_waveforms_web.dart
@@ -0,0 +1,12 @@
+import 'package:flutter_web_plugins/flutter_web_plugins.dart';
+
+import 'web/audio_waveforms_plugin_web.dart';
+
+/// Entry point for web platform
+/// Delegates to AudioWaveformsPluginWeb for actual implementation
+class AudioWaveformsPlugin {
+  /// Registers this class as the web plugin implementation
+  static void registerWith(Registrar registrar) {
+    AudioWaveformsPluginWeb.registerWith(registrar);
+  }
+}
diff --git a/lib/src/base/constants.dart b/lib/src/base/constants.dart
@@ -58,4 +58,36 @@ class Constants {
   static const String normalisedRms = 'normalisedRms';
   static const String bytes = 'bytes';
   static const String recordedDuration = 'recordedDuration';
+
+  // Error codes
+  static const String audioWaveforms = 'audio_waveforms';
+  static const String unsupported = 'UNSUPPORTED';
+  static const String unimplemented = 'Unimplemented';
+
+  // Error messages
+  static const String cannotPreparePlayer = 'Cannot prepare player';
+  static const String cannotStartPlayer = 'Cannot start player';
+  static const String cannotPausePlayer = 'Cannot pause player';
+  static const String cannotStopPlayer = 'Cannot stop player';
+  static const String cannotReleasePlayer = 'Cannot release player';
+  static const String cannotGetDuration = 'Cannot get duration';
+  static const String cannotSeekToPosition = 'Cannot seek to position';
+  static const String cannotSetVolume = 'Cannot set volume';
+  static const String cannotSetRate = 'Cannot set rate';
+  static const String cannotSetFinishMode = 'Cannot set finish mode';
+  static const String playerKeyIsNull = 'Player key is null';
+  static const String playerKeyOrDurationTypeIsNull =
+      'Player key or duration type is null';
+  static const String playerKeyOrProgressIsNull =
+      'Player key or progress is null';
+  static const String playerKeyOrVolumeIsNull = 'Player key or volume is null';
+  static const String playerKeyOrRateIsNull = 'Player key or rate is null';
+  static const String recordingNotSupportedOnWeb =
+      'Audio recording is not supported on web platform';
+  static const String methodNotAvailableForWeb =
+      'is not available for web. Recording functionality is only available on mobile platforms (iOS/Android).';
+  static const String methodNotImplementedOnWeb =
+      'is not implemented on web platform';
+  static const String audioWaveformsDoesNotImplement =
+      'audio_waveforms for web doesn\'t implement';
 }