I want to build a HTML5 form, in which user can submit audio file from the desktop, and for mobile device, user have to record the audio directly. I use the following html5 code for the audio input
<input type="file" accept="audio/*" id="capture" capture="microphone">
It works properly, but not iOS device, and which always give me .mov video files instead of any audio.
Is it the limitation of iOS? And is there any workaround for my case?
Looks like it's just not supported through iOS and it's been that way for a few versions. Check out this link from another post.
Related
With one of the recent iOS releases, Apple seems to have changed the behavior of <input type="file"> when it comes to picking videos from the camera roll. It used to be that before the video file was handed over to the website, iOS would downscale the video to 720p and also convert it to H.264 (AVC).
Alas, this is no longer the case. Safari now forwards the video files "as is" and does not transcode them. In particular, it does not convert HEVC-encoded videos to H.264.
Is there a way to make <input type="file"> still transcode/downscale user-selected videos, ie., revert to the old behavior? I tried adding accept="video/*", but to no avail...
Answer to myself: turns out iOS does convert HEVC-encoded recordings to H.264 (and downscales them to 720p), but only if the multiple attribute is not set on the <input type="file"> element.
Once the multiple attribute is set, the HTML input element will receive the original HEVC-encoded videos and no compression/downscaling happens before they are handed to the website.
(Since I can't make a comment on your answer, I am writing my response here.) In August of 2022 my testing on iPhone 8 plus running Safari on iOS 15.4.1 shows that the "multiple" attribute does NOT control whether the video compression before uploading happens. It happens happens each time when selecting a single file or multiple files.
Using UniWebView we try to display a locally stored html page to play audio that is stored in a sub-folder at the same location as the page. While this works fine for iOS 10, 11; we seem to have a problem on iOS 9 where the audio doesn't play. After inspecting the page in Safari, there was an error when fetching the resource from local storage but it did not say why. Implementation for playing audio is the same for all iOS versions.
Wanted to ask if there are any limitations to iOS 9 or specific rules of how to fetch and play audio files the from local storage?
PS.: UniWebView is a wrapper for WkWebView on iOS
Error screenshot from Safari
We experience an issue with playing a mp4 file on ipad on webpage with a video HTML 5 player.
Issue:
It does not work on ipad/iphone. On all other platforms (Windows,Android, iOS desktop) it works fine.
This is the code:
<video id="my-video" width="400" height="240" preload="true" controls >
<source src="/media/video/6d9ab49-9936-4194-acvb-3cd9b60521fg/myvideo.mp4" />
</video>
Connected the ipad to the Mac to debug:
A message 'requested resource cannot be found'.
Does sound very clear but does not make sense because the mp4 file is accessible when you paste the url into the browser address bar.
Already tested and checked:
set src of mp4 to fullpath (including https:// or http://) instead of
using the virtual path ;
checked hostingprovider for 'Accept-Ranges: bytes' (with partial content (206) responses) ; settings are ok
play the same mp4 file from a remote url (accessed with or without https); strange but imporant : that works !
So I guess the issue really is that the mp4 can not be found or loaded on ipad.
But why?
Hope someone can help.
Have you tried it like this, include src directly inside <video> tag?
<video id="my-video" src="/media/video/6d9ab49-9936-4194-acvb-3cd9b60521fg/myvideo.mp4" width="400" height="240" preload="true" controls></video>
If it still doesn't work try to use only video element with src, remove preload and controls. Just to see if you can get it to work. And if still no results, try to go for absolute src path.
I had this very same problem serving videos on my Liferay Portal, which works perfectly on PC and Android, but not on iOS devices. After numerous tests, I think I've finally managed to nail down the cause.
For some reason, if the video file (eg MP4) is accessible by a guest user (ie accessible without having to log on to the server), then it will work fine on iOS. However, if the file is only accessible to logged on users, it won't work.
My theory on why this happens is that iOS is probably using a different session to do the range request check than the one used to play the video file. Thus, the range request check fails because the file is inaccessible.
Now that Mobile Safari on iOS 6 supports capture and media library selection for photos and videos with the HTML5 input element is it possible to select videos with PhoneGap's camera.getPicture method?
<input type="file" accept="image/*, video/*" capture="camera" />
If not, a new camera.getMedia method which allows either media type would be great.
HTML5 file input for photos & videos on iOS6 Mobile Safari
HTML5 file input multimedia actions on iOS6 Mobile Safari
You can use navigator.camera.getPicture and set the MediaType to VIDEO in the options parameter.
I'm using the YouTube API in my flex app to play videos and it works fine running on my computer and android, but I'm getting an issue when I try to use it on iOS, I just get a black screen!
Any ideas?
I was curious so did some research.
First, I searched for SWFLoader on iOS and this post came up. I'll quote:
You cannot load SWFS that run ActionScript on IOS
Then I realized from your comment you may be using the Loader class; so I googled Flash Loader on iOS and came across this. To quote:
In an iPhone application, you cannot use the Loader.load() method.
However, you cannot run any ActionScript code in SWF content loaded
with the Loader.load() method. However, you can use assets in the SWF
file (such as movie clips, images, fonts, and sounds in the library).
You can also use the Loader.load() method to load image files.
You may benefit from reading through the actual Adobe docs. Specifically this page which focuses on unsupported APIs. It is the last link where the above quote comes from.
It's true you cannot load and run a SWF and in this case the video is a stream so you there is no media to save. Youtube does have an alternative URL that points to an actual mp4 file which will play on iOS. You can use a VideoDisplay player and that URL to play the video.