Geek Answers Handbook

HTML5 <audio> tag does not work in Android Webview

HTML5 audio text does not seem to work in the web view if the source file is stored locally. i.e.

<audio controls="controls"> <source src="my_local_audio_file.mp3" type="audio/mpeg" /> </audio>

It works when the file is opened from the server, for example src="http://example.com/audio.mp3"

I tried this on Android ICS.

There are several workarounds as indicated here . But I do not understand why this problem arises.

Any solutions or ideas as to why this is happening?

Thanks.

+6
source share
2 answers

This is just an internet way to achieve the goal of playing audio from an html file

use Mediaplayer ( http://developer.android.com/reference/android/media/MediaPlayer.html ) for Android to play sound. you can call the android function from javascript that you wrote in the HTML file.

This is an example of how you can call a function written in a java file from javascript code

 WebView webView = (WebView) findViewById(R.id.webview); webView.addJavascriptInterface(new WebAppInterface(this), "Android"); -------------------------------- public class WebAppInterface { Context mContext; /** Instantiate the interface and set the context */ WebAppInterface(Context c) { mContext = c; } /** Show a toast from the web page */ @JavascriptInterface public void showToast(String toast) { Toast.makeText(mContext, toast, Toast.LENGTH_SHORT).show(); } } --------------------------- java sript code <input type="button" value="Say hello" onClick="showAndroidToast('Hello Android!')" /> <script type="text/javascript"> function showAndroidToast(toast) { Android.showToast(toast); } </script>

This way you call the sound from the Android code.

+2
source

this seems like a very stupid mistake inside webview. Currently, a workaround is to “encode” the audio file as an mp4 file, and then link it using the video tag.

 <video width="100%" height="48" controls> <source src="audioonly.mp4" type="video/mp4"> </video>

This will show a black rectangle (no video), as well as controls inside. This is not the best solution, but the easiest. You can use Miro Video Converter on Mac and Windows to create such mp4.

Good luck :)

+1
source

More articles:


All Articles