Flutter Web Audio Player Alternative
Playing sounds in a Flutter web application
Published in
3 min readJan 26, 2020
For playing audio on iOS or Android using Flutter, most people will use dedicated packages from the pub.dev repository.
Unfortunately, these are not marked as supported on the web platform.
At the moment of this writing, I couldn’t easily set up audio playback in my web application (although I tried most of the audio-related packages) without using the same technique I used to play video in it.
We’ll explore a solution that enables us to play audio in 3 simple steps:
1. We need to edit the default index.html template file that is located in the web folder. With these edits, we load the Howler audio player and write a JavaScript function that will take care of actually playing our sound.
This is how our index.html will look like:
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<meta content="IE=Edge" http-equiv="X-UA-Compatible">
<meta name="description" content="Flutter Web Audio Player."> <!-- iOS meta tags & icons -->
<meta name="apple-mobile-web-app-capable" content="yes">
<meta name="apple-mobile-web-status-bar-style" content="black">
<meta name="apple-mobile-web-app-title" content="Flutter Web…
