Protected videos don't work in Safari

I have come across a strange problem with my test website: http://www.mcemcourses.org/wordpress

After successfully implementing the MediaElement.js video player plugin and protecting content with S2member, videos play across all browsers (Firefox, Chrome, IE 6-9) but not on Safari (desktop version or ipad/iphone). All my video files are currently stored in /s2member-files.

If I move one of the video files into the normal Media folder (/wp-content/uploads) which of course isn’t protected by S2member, it plays with no trouble in all browsers including Safari.

The code I’m using to include a video file in a page is:

[video src="http://www.mcemcourses.org/wordpress/?s2member_file_download=abdomenpainhistorypreview.mp4"]

Can you shed any light on this issue?

Hi Shaun,

Try

[video src="http://www.example.org/wordpress/s2member-files/abdomenpainhistorypreview.mp4"]

Thanks for your response. I think you meant:

http://www.example.org/wordpress/wp-content/plugins/s2member-files/abdomenpainhistorypreview.mp4

But unfortunately that doesn’t work in Safari either.

Yes sorry that is what I meant.

Hmm are you logged in with safari? I just visited using chrome and couldn’t view the preview videos because i’m not logged in so just get the blank video player, that would explain why it is working when you move it outside of /s2member-files/

If thats not it perhaps there is a problem with safari and the script protecting the video

You are right in saying that without logging in, the preview videos aren’t available on any browser because I mistakenly put them in the s2member protected folder. I will move those previews into a normal folder.

However, even when I’m logged into Safari I still cannot view any videos so there does seem to be a problem with the script protecting videos within the s2member-files folder.

Yes maybe a support rep can shed more light on this.

Have you tried using the jwplayer?

I have tried JWPlayer but it unfortunately isn’t responsive (which this site requires). Mediaelement.js is the player I’m using as it provides a clever flash fallback so works across all browsers and devices with a single h.264 .mp4 file.

You can make the JWPlayer responsive by setting the width and height in your css file and not setting it in the embedder or shortcode.

You can do the fallback also.