How can I autoplay media in iOS >= 4.2.1 Mobile Safari?

Question

I cannot seem to get audio media to play in Mobile Safari on iOS 4.2.1 in any situation other than the handler of a click event performed by the user. Even then, if player.play() is called in any asynchronous fashion (ajax, setTimeout, etc) it doesn't work.

I've tried calling player.load() before player.play(). I've tried triggering a click event on a dom element whose handler calls player.play(). I've tried using both audio and video tags.

All the loopholes that worked prior to iOS 4.2.1 seem to be closed. Any ideas?

Pretty sure that’s by design. Some of your users may be on cell plans that charge by data usage, and they don’t want your media to auto-play. — Jeff Kelley, Nov 23 '10 at 19:25
possible duplicate of [Autoplay an Audio File on Mobile Safari](http://stackoverflow.com/questions/2841966/autoplay-an-audio-file-on-mobile-safari) — Jeff Kelley, Nov 23 '10 at 19:26
I understand it's by design. However, prior to 4.2.1 there were several loopholes that allowed circumvention. FWIW, I'm not actually trying to autoplay audio on page load. The audio source urls I'm using are unstable and cannot be cached, so I'm making an ajax call inside the click handler to resolve the audio source. This in itself is enough to trigger iOS's defense mechanisms apparently. — David Gouldin, Nov 23 '10 at 19:32
I spent about an hour today shuffling code around because I had the `play()` function within an asynchronous function (Ajax call). Even in a click handler, with an actual click, it still didn't work. So: beware, I guess. I wish Apple would publish the specific criteria we need to follow. — JKS, Feb 11 '11 at 01:53

score 16 · Accepted Answer · edited Dec 09 '10 at 16:10

16

Starting from iOS 4.2.x, the download of media will not be started if there isn’t a user-input event, like touchstart.

So the answer is no, there is no method to autoplay media by JavaScript or something else.

edited Dec 09 '10 at 16:10

Paul D. Waite

96,640
56
199
270

answered Nov 28 '10 at 08:20

Yu Jianrong

322
2
7

Any official links from Apple saying this? Just to satisfy the higher ups ;) Thanks! – Ardee Aram Sep 01 '11 at 01:59
2

azure_ardee - see this http://developer.apple.com/library/safari/#documentation/AudioVideo/Conceptual/Using_HTML5_Audio_Video/Device-SpecificConsiderations/Device-SpecificConsiderations.html#//apple_ref/doc/uid/TP40009523-CH5-SW1 – Tomáš Fejfar Jan 10 '12 at 11:02
@ArdeeAram This link from Apple explains how video with audio not muted can't be autoplayed without user interaction. https://developer.apple.com/documentation/webkit/safari_tools_and_features/delivering_video_content_for_safari – Vibgy Jun 27 '20 at 15:33

score 14 · Answer 2 · answered Dec 15 '10 at 12:20

14

There is one way to play the video/audio file automatically on 4.2.1. Create an iframe and set its source to the media file's URL and append the iframe to the body. It'll be autoplay.

var ifr=document.createElement("iframe");
ifr.setAttribute('src', "http://mysite.com/myvideo.mp4");
ifr.setAttribute('width', '1px');
ifr.setAttribute('height', '1px');
ifr.setAttribute('scrolling', 'no');
ifr.style.border="0px";
document.body.appendChild(ifr);

answered Dec 15 '10 at 12:20

bhups

14,345
8
49
57

works fine for audio, but video player is not loaded on the iPhone – vk.edward.li Jul 25 '11 at 18:04
I can confirm that this works on the iPad, but it seems to force a reload of a sound each time that it it played. Are there any workarounds that allow it to cache the sound, so that it gets played instantly. – Mr. Flibble Sep 23 '11 at 13:30
GREAT! It works! Tested on iOS 4.3.5 (iPod Touch 4). No loop, BTW. – noober Nov 03 '11 at 06:44
Also, if you create 2 iframes, only the last one really plays. – noober Nov 03 '11 at 06:52

score 6 · Answer 3 · answered Nov 20 '12 at 23:02

As others have said here and according to Apple documentation, MobileSafari does NOT support the autoplay attribute in the video tag. However, in iOS 6 it DOES work. This appears to be a bug which Apple fixed in iOS 6.0.1 (and presumably in iOS 6.1).

Don't rely on autoplay working in iOS 6 if you happened to stumble across it working in iOS 6.0.

-Michael

score 4 · Answer 4 · answered Dec 07 '10 at 19:46

4

As a workaround, I tried tying the load()/play() code to a click event, and then triggering the click event programmatically. This approach worked in Desktop Safari, but not Mobile Safari.

answered Dec 07 '10 at 19:46

mshafrir

5,190
12
43
56

score 1 · Answer 5 · answered Apr 16 '12 at 15:31

1

How about this?

Create an audio sprite with Sound Manager 2, preload & cache it from the first user interaction, and then play as and when needed.

Would that work?

answered Apr 16 '12 at 15:31

mousedown

155
1
2
6

Unfortunately, this requires you to stop the sound, and then play so won't work. The answer above is right. There is no way :/ – mousedown Apr 17 '12 at 08:46
1

It works!!! Only the first sound needs to be linked to a user interaction, any subsequent sounds following can be played automatically. – mousedown Apr 17 '12 at 09:17

score 1 · Answer 6 · edited Dec 09 '10 at 16:10

1

This worked on the iPad until last nights 4.2 upgrade:

$(function() {
    var Beep = document.createElement('audio');
    Beep.setAttribute('src', 'beep-23.mp3');
    Beep.load();
    Beep.play();
}

My Beep.play(); still works for a click event, but the initial Beep.play() stopped working...

edited Dec 09 '10 at 16:10

Paul D. Waite

96,640
56
199
270

answered Nov 24 '10 at 02:10

steve

11
1

score 0 · Answer 7 · answered Oct 19 '12 at 15:24

0

Autoplay is supported (in my tests) with an iPhone 5 (iOS 6) using the headphone jack.

answered Oct 19 '12 at 15:24

Jeremiah Isaacson

340
2
10

score 0 · Answer 8 · answered Oct 27 '12 at 07:25

0

On my 3rd-gen iPad running IOS 6, autoplay of HTML5 tags has suddenly begun working! (I've had IOS 6 installed for a couple of weeks, and am pretty sure I tested this feature right away, but only noticed it working tonight.) I don't recall seeing any notice of this from Apple, although I did see that mobile Safari had been granted the ability to support file uploads via

<form><input type="file" .../></form>

-- another feature I needed but which Apple had withheld.

answered Oct 27 '12 at 07:25

dkurland

21

Surprised by the downvotes. This was an accurate and useful answer because autoplay did work in iOS 6. Helpful to me since it explained why I was pulling my hair out transitioning from 6.0 to 6.0.1 (see [Micheal Johnston's answer](http://stackoverflow.com/a/13483720/1110547) for more specifics). – Jason Mar 26 '13 at 22:45

score -1 · Answer 9 · edited Jun 02 '12 at 13:35

Please Try this Code it is working both version, you need to add the audio control dynamically in page. it is working.

var isiPad = false;
if (navigator.userAgent.match(/iPad/i) || navigator.userAgent.match(/iPhone/i) || navigator.userAgent.match(/Android/i) || navigator.userAgent.match(/webOS/i)) { 
    isiPad = true; 
}
$(function() { 
    if (isiPad) { 
        var audioElement2 = document.createElement('audio'); 
        audioElement2.setAttribute('src', 'img/bgsound.mp3'); 
        audioElement2.controls = true; 
        audioElement2.loop = true; 
        audioElement2.load();
        audioElement2.play();
    }
});

How can I autoplay media in iOS >= 4.2.1 Mobile Safari?

9 Answers9

Linked

Related