I'm am trying to build a simple music app using meteor as my framework. I'm using html5 audio tags as my player. Everything works and displays completely fine in my browser but when testing on the iOS simulator all i get is a black screen with a giant gray play button that does not work.
I'm wondering if this is a meteor problem or if iOS limitations are too robust in order for the html5 audio player to display correctly.
If anyone knows the solution to this please help.
Thanks
I had the same issues with the html5 video element. I will share my findings for that as it sounds like the same issue for the audio tag.
iOS web app and Cordova
For iOS just add “webkit-playsinline” next to your audio tag as done below for video:
<video webkit-playsinline>
<source src="mySource.mp4" type="video/mp4">
</video>
Cordova
For a Meteor Cordova iOS app you also need to add the following to mobile-config.js to set the cordova config.xml settings:
App.setPreference('AllowInlineMediaPlayback', true);
You can read up some more about this on http://blog.blairvanderhoof.com/post/78586868260/getting-the-html5-video-tag-to-work-in-cordova-for
If that does not work you can go with the following cordova plugin which supports audio playback: http://plugins.cordova.io/#/package/org.apache.cordova.media
Example from the plugin docs:
var myMedia = new Media("http://audio.ibeat.org/content/p1rj1s/p1rj1s_-_rockGuitar.mp3")
myMedia.play({ numberOfLoops: 2 })
Hope it helps.
Regards,
Riaan
HTML5 Audio is not supported on most mobile devices. Check out the documentation at: https://developer.mozilla.org/en-US/docs/Web/HTML/Element/audio for more information. iOS does not support a lot of the new HTML5 Media elements and APIs at this point. The only mobile browser that supports HTML5 audio is Firefox Mobile. Hope this helps!
Related
I have some .ogg audio files hosted on cloud and wanted to play in a audio player. The next code works fine on Android but not in iOS:
<audio controls controlsList="nodownload">
<source src="<ogg_audio_url>" type="audio/ogg" />
</audio>
I'm using Ionic 5 with Capacitor. I tried to use some Cordova plugins, convert the file to base64, but no success. From what I've read in some forums, iOS does not support playback of audios in ogg format, requiring specific applications, is there any way to do this in an Ionic way, using a cordova plugin or similar?
Thanks in advance.
Try to use native audio plugin for better compatibility.
https://ionicframework.com/docs/native/native-audio
I am not technical but have my engineer working on putting together a web-based video chat application with the goal of using it on the iOS web browser(s). The service appears to be functioning correctly on a desktop browser. However, we cannot get it to work on iOS browsers.
on Safari (using iPhone 11 - iOS 13) the video freezes immediately and shows still frame. On Chrome there is never a connection made, nor does Chrome prompt to access camera/mic.
I've read conflicting work that says WebRTC is supported in iOS Safari/Chrome and other work that says it is not.
Would appreciate anyone's help here! Is it possible to create a URL-based video conferencing platform that can correctly function on iPhone?
Try adding 'muted', 'autoplay', 'playsinline' attributes to the Video Element as shown below.
<video muted autoplay playsinline></video>
If you can play it back, it's ok.
From the perspective of the user experience, the browser can autoplay audio or video with audio only on some sites such as Youtube and sites that the user has allowed. It cannot be done on other sites.
To play on sites that can't autoplay, modify it to play with user gestures such as clicks.
video.onclick = _ => video.play();
Here's an example that works from Raspberry Pi to iPhone iOS 13.4
Haven't been able to make it work from Chrome on windows to iPhone
https://apprtc.tc
source code:
https://github.com/webrtc/apprtc
GetUserMedia is not supported in Chrome for iPhone
It is supported in Safari for iPhone
It is supported in Chrome for Windows
i try to get the html5 audio working on ios with cordova.
<audio controls>
<source [src]="attachment.audioUrl" type="audio/mpeg">
</audio>
Working fine on Android or on all Web Browsers using ionic serve (Safari/Chrome, no problem). But get stuck on ios. Audiofile is played just once and during playback it says "Live broadcast". When finished, there is no way to get this file play another time but close the view and go back works fine.
Could this be an cordova issue or am I doing something wrong? I already tried different audio types and made sure, that they are correctly formatted. All working on other platforms but ios.
I am using cordova 8.0.0
and ionic 3.20.0
Thanks,
Karsten
I know this question has been asked before but I can't seem to find a satisfactory answer. First off I'm very new to Xamarin.forms and mobile app development in general. I'm working on a small time sensitive project. One of the requirements is to have a youtube video play from within the app in both iOS and Android (the link to the youtube video comes from a DB). I used a WebView but it doesn't seem to work well in Android. I also came across the following in another thread:
"When it comes to streaming video on iOS and Android playing that content in a Webview control with or without Xamarin.Forms would be the incorrect choice. Webviews vary on each device and their codec support for HTML5 and H264 video also vary. Both iOS and Android have their own native video players that can play and stream video.
For iOS you have a few options such as AVPlayer or MPMoviePlayerController: http://developer.xamarin.com/recipes/ios/media/video_and_photos/
For Android you could simply use the default VideoView http://developer.xamarin.com/recipes/android/media/video/play_video/ or you could use the binding around the new ExoPlayer: https://github.com/martijn00/ExoPlayerXamarin
You would simply need a custom renderer to bring these into Xamarin.Forms, which would be very simple to do"
I've never done Xamarin.iOS nor Xamarin.Android development before. If someone can provide a simple prototype then that would be great.
Take a look at "Delivering Rich Media Experiences with the Xamarin.Forms Video Player" (https://blog.xamarin.com/delivering-rich-media-experiences-xamarin-forms-video-player/). Github: https://github.com/adamfisher/Xamarin.Forms.VideoPlayer
I want to run my html5 audio player which is online streaming radio link to be played even if the device is locked (sleep mode) or the app is turned in background while opening another app. The player works very well when I start it as web app from Safari browser but now after I have built it for ios using Phonegap Build when the device is locked or the user switched between the apps in the device then the player stops. Is there any solution for this? Maybe a plugin?
Here is my web app in github: https://github.com/albpower/radio-pendimi
I have solved this problem using Background-audio ios Phonegap plugin. Here you can find more informations about plugin and usage from official Phonegap plugins directive.
https://build.phonegap.com/plugins/1193