Sharepoint 2010, HTML5 video won't work on iPad - ios

I created simple html page with content like:
...<body><video width="848" height="352" class="shown" id="videoShowcase" controls="controls" ><source src="http://myportal/PublishingImages/apple-html5-demo-tron-us_848x352.m4v" type='video/mp4; codecs="avc1.42E01E, mp4a.40.2"' />
and its NOT working on ipad(ios4), while it works in chrome. If I change src attribute to "http://movies.apple.com/media/us/html5/showcase/2011/demos/" for example, it works on both(even IE in 9.0 mode).
It makes me think that the probles is 1) SP2010 access to "PublishingImages" list, but i break role inheritence, and granted anonimous access to this
2)the way SP2010 stream videos, my guess is SP2010 handlers over IIS
Any thoughts?

The file extension is irrelevant - mp4, m4v, mov etc. are all just container format extensions. The real format of the file is declared internally, and it's most likely the internal format that's the problem.
I believe that iOS will only play .h264 encoded videos. I'm not sure what avc1.42E01E is, but I'm guessing iPad doesn't support it.
I suggest you try ripping the video to an iPad compatible .h264 video using Quicktime Pro. If you find a copy of Quicktime 7 and pay the $30 license fee for pro, it comes with a bunch of easy-to-use export options for videos that will work correctly on iPad.
There are other free video rippers such as Handbrake if $30 for QTP seems a bit steep - YMMV.

Mobile Safari on Apple i-devices uses hardware acceleration to play videos. So instead of making request to video in the current(authenticated) context, it makes new request to the video.That request has authentication failed. So, the only "solution" to this is to store public videos allowing anonimous login.

Related

Recording Video HTML5 not working in Safari and iOS mobile app

I am trying to use the HTML5 video - https://developer.mozilla.org/en-US/docs/Web/HTML/Element/video to access camera on the device.
I am following this example - https://developer.mozilla.org/en-US/docs/Web/API/MediaStream_Recording_API/Recording_a_media_element to record the video.
It works perfectly in Chrome browser but does not seem to be working on Safari and iOS mobile app.
On debugging both captureStream() and mozCaptureStream() functions are undefined.
Any suggestions on how to fix this?
PS: Is this a known issue - https://bugs.webkit.org/show_bug.cgi?id=181663. Are there any workarounds? Thanks!
I don't think recording webcam as video is an available option on Apple devices.
It might be a licensing issue rather than a technical limitation.
It works perfectly in Chrome browser but does not seem to be working
on Safari and iOS mobile app. On debugging both captureStream() and
mozCaptureStream() functions are undefined.
Your link is recording into Google's own webM video which is a format not supported by Apple. The Safari browser cannot encode pixels as VP8 or VP9 to use inside webM container. Apple has an MPEG video license so for Safari, I expect MP4 to be their expected output (but is there a free H264 encoder inside Safari? Nope).
mozCaptureStream() is specific to Mozilla Firefox. Safari won't know/accept it.
captureStream() is not fully suppported on Safari. The missing part is the recording part.
Possible workarounds:
Try enabling MediaRecorder API in Safari settings.
Research (double-check) for known issues, like as mentioned at bottom of this read this article: https://blog.addpipe.com/safari-support-on-macos-beta/
If you can draw webcam to Canvas then consider bringing in your own (Javascript-based) H264 encoder (for MP4 video) or VP8/VP9 encoder (for webM video).
You can try: https://github.com/TrevorSundberg/h264-mp4-encoder.
Wait for webCodecs API to be added to Safari. Note in Chrome/Edge you can just use the built-in webCodecs API to encode video for MP4 or WebM formats. Safari has no free encoders and thus has no webCodecs API.
I've been banging my head on getting captureStream to work on iOS (Safari and Chrome, same results) to no avail. This reply by #VC.One helped me stop trying to use webM format, which was used by the sample code I was following from mdn which is here... https://developer.mozilla.org/en-US/docs/Web/API/MediaStream_Recording_API/Recording_a_media_element
So I simply switched to mp4 instead of webm, using .srcObject instead of .captureStream, and now I have things working on iOS. I still have a lot of clean-up to do, but when my solution is finished I will make a nice write-up and post back.
Also, someone pointed out that I needed to use the onloadedmetadata with the play method, in order to get a video element to show a real-time feed of bytes from getUserMedia, and that worked. Then I just needed to store the bytes somewhere that iOS will not freak out about (it does not support captureStream) and then it all came together. It definitely seems to be a licensing issue at the heart of it all, which is why this works using mp4 instead of webm.

Record audio only in browser on iPads

I am working with a school group that has a Django website with a page that allows the users to press a button, record audio, and save this audio to their user pages. This website was built to work on computers and Samsung tablets with Dolphin browsers using the HTML Media Capture to capture the audio by launching the microphone app on the tablets. The group wants to now switch to iPads. I have been researching ways to launch the microphone app from iPads but it seems this is not possible using HTML5. I have done some research and seen the links below, but I don't know what the best strategy is to modify the existing website to make it work on the iPad.
What is the best way forward to allow this group to record audio (not video) from their iPads using a browser-based website?
Research--
http://caniuse.com/#search=getUser - shows getUserMedia will not work on iPads
http://www.html5audio.org/2012/11/capturing-audio-on-ios-6-via-the-videotag.html - looks pretty hacky, does it work?
How to record and play voice in ios6 using HTML5 - using PhoneGap might work, but how would the recording app be launched from the browser and then save back the audio to the users account?
Thanks,
Lee
After having the same problem for a year, I found a new article with a solution: How to record audio from a mobile web page on iOS and Android
One of the newer APIs available is the MediaRecorder API. My first attempt at building this application started with this class. I implemented the entire application and it worked great on my desktop. It was easy to capture audio and the data was already compressed into .ogg format and ready to ship to my server. Then I tried it on iOS. It turns out that the MediaRecorder API is not supported and wouldn’t meet my needs. After I stopped cursing Apple, I began again from scratch.
... That was the last piece of the puzzle that allowed me to construct a working demo and it revolves around three steps:
1. Capture the microphone so we can begin recording
2. Accumulate captured audio data into a series of byte array chunks
3. Combine the chunks into one large array and massage the array into the format of a .wav file
There is a bunch of code on the website. And here is the demo file: https://www.gmass.co/blog/wp-content/uploads/2018/03/wzrecorder.zip
I have tested it and it works on iPad.
Demo: https://q2apro.github.io/wzrecorder/
Safari iOS does not (yet) support the accept="audio/*" part of the <input> element even though it does support taking videos and images through HTML Media Capture.
<input type="file" accept="audio/*" > on iOS 10 will prompt the user to select between:
Take Photo or Video
Photo Library
iCloud Drive
More...
The same code works just fine in Chrome on Android.
Safari in iOS6 was the 1st mobile Safari to support the <input ... > element and I've tested all the way up to iOS10. Chrome on iOS uses the same rendering engine so the same limits apply.

SoundCloud says sound is streamable but won't play on iOS or OS X

I'm writing an app for iOS 7 only that uses SoundCloud. But the problem here is that sometimes I fetch sounds that have the streamable property set to TRUE, the stream URL but I'm not able to play it. The player simply hangs. This also happens on OS X.
I know that a couple of sounds from SoundCloud are streamable only with Flash. But if you use the mobile version of the site, then all songs are streamable, even those that needed Flash to run on the desktop version.
What I want to know is how can I play those sounds since they are supposed to be streamable?
One of the sounds that shows this happening is this one:
http://api.soundcloud.com/tracks/99350098/stream?client_id=[YOUR CLIENT ID HERE]
Thanks,
Abras
From other posts it seems SoundCloud have changed/are in the process of changing the protocol they use for streaming between http and rtmp. The problem being that rtmp is flash, which obviously won’t work on iOS and possibly on osx (flash is not install by default).
You can check by going to /streams (not /stream)
A check (http://api.soundcloud.com/tracks/99350098/streams?client_id=YOUR_CLIENT_ID) of the track you gave above, this returns a rtmp url.

Streaming HLS to iOS devices using Windows Azure Media Services

I have been doing some exploring of Azure Media Services, specifically with media converted to HLS. I walked through the process of creating HLS content using a process similar to the one outlined in this HLS Walkthrough
Now that I have my HLS content in Azure, I am hoping to stream it just as you would any m3u8 stream. I have tried the following:
WebView in iPad – works OK, it's jumping and not very smooth
Safari on OS X – does not work at all
VLC Player – does not work at all.
Granted this i not exhaustive nor thorough (yet) but before I continue I wanted to get feedback if anyone has any. I stumbled along WAMS Media Player for iOS regarding the Smooth Player for iOS. Is the expectation here that the Smooth Player developed for iOS is the best way to consume HLS generated media from WAMS?
As I understand it, Safari's support (or lack thereof) for HLS depends on QuickTime -- there are versions of QuickTime that do support HLS (QuickTime Pro), but by default, the support is not there.
I suggest you transcode to both Smooth Streaming and HLS. Serve Smooth Streaming via Flash or Silverlight to Windows/Mac clients and HLS via HTML5 to iOS clients.

How to implement video DRM in iOS

I'm looking to implement DRM in an iOS video player, but I'm not sure how to implement this. In order to implement video DRM (while still using Apple's hardware accelerated H264 decode), I need a way to feed the decrypted H264 stream into the standard iOS video playback APIs.
According to this question, it was not possible to implement 3rd party DRM in September 2010. There's a thread in the Apple Developer Forums that goes nowhere. However, as of today a number of 3rd party DRM libraries exist: Widevine, Irdeto (PDF), Marlin. They have clearly found some way to pass a custom stream to the media player in Apple approved apps.
I've found two leads. One is a suggestion to create a custom URL protocol, but people seem to have poor success using this with video. The other is to create a local HTTP server thread and provide the content by HTTP live streaming on 127.0.0.1 inside the iDevice. I'd like to be very sure that Apple will approve before going that route.
So - what Apple approved APIs do 3rd party DRM implementations use to get decrypted video data into the video player?
Edit: the latest BBC iPlayer for iOS allows programmes to be downloaded for later viewing. Either they store the content in the clear, or they have cracked this problem.
You can begin decrypting the file into another file and playback that file as you decrypt. You'll need to let it buffer a few seconds worth of video, but it will work.
Additionally you'll need to make sure that the moov atom is BEFORE the mdat atom in the file, otherwise it won't work. (AVFoundation, for example, creates MP4s where the moov atom comes after the mdat atom, and so they would need to be modified to work)
A working solution is local http server. But the patent application was submitted by Authentec.
http://www.google.com/patents/US20120284802

Resources