How to download/save HTML5 Video on IOS to device - javascript

I'm building a web application that creates a slideshow mp4 video. It will be uploaded to S3 and viewed through HTML5 . The goal is to share it on instagram but instagram doesn't allow direct sharing through web. Hence, the alternative is to get the user to download it to their mobile device and upload it manually through the app.
On Android, I'm able to download the video using it's video controls or through <a href='s3-video-link.mp4' download>
However this doesn't work on IOS. How can I download a html5 video onto the mobile device? Can I download directly from s3 somehow? Or is there any possible option to get it to upload to instagram?

The sandboxed nature of iOS means that while Safari can access and download a file unless there is an app registered to handle that filetype that immediately accepts it then it is lost to the user.
If the user has the Instagram app installed, then you could use their custom URL scheme to reference the asset, but the documentation seems more targeted to images than video so YMMV.
There have been some attempts to reverse engineer the APIs that their app uses, and create ways around their current limitations, but nothing that would address your requirement (the various sharing widgets that target Pinterest, Facebook etc don't seem to support Instagram so it's a common problem). Might be worth reaching out to their developer support folks?

Related

Video Recording in #microsoft/teams-js Mobile Client

I'm working on a tabs based React app in Microsoft Teams using #microsoft/teams-js. The app is supposed to work in Browser, Team Desktop Client (iframe in Electron based client) and Teams Mobile client (iframe in unknown setup). I've been able to access image and video files, both uploads and recording/capture in both Browser and Teams Desktop Client following documentation. It were basically file inputs and navigator.mediaDevices.getUserMedia() methods of HTML5.
But the Mobile Client requires calling media.captureImage() method of #microsoft/teams-js library. The official Documentation states that we will only be to upload or capture photos in the Mobile Client and no video access is possible, but I was able to get video upload to work using <input type="file" />. By using the camera="camera" prop I was even able to launch the native camera in mobile browsers (but not desktop browser, or the Teams Clients).
<input type="file" accept="video/*" capture="camera" onChange={uploadVideoFile} />
I want to know what other way is there to access camera for video recording in Teams Mobile - be it native camera app or in app Media access.
The APIs supported by Microsoft Teams are mentioned in documentation. For other APIs please help by raising it on user voice.

How to protect copyrighted multimedia files when downloading to android phone?

I'm building an application that allows users to upload multimedia files they create (audio, video, graphic) via my web frontend, and then other users can stream/download the files to their phone using my mobile app. I'm building the mobile app with react native. The problem is with the android platform-- when the files are downloaded, they show up in the Downloads folder, which means they can be copied, moved, and opened from other apps.
Since the file contents are copyrighted, I need to find a way to
prevent these files from being listed in the Downloads folder
and / or
prevent other apps from opening them.
Apps like Spotify and Netflix manage to do it (e.g. if you download a playlist from Spotify, you can't see them anywhere else on your phone). I believe some kind of encryption/decryption scheme is involved. But I don't know enough about it. Would appreciate any insight on how to go about this.
As Luke says, there is no 100% protection, but usual approach is to encrypt the files and to use a DRM system to manage the secure transition of the key from the server to the client Android device.
Android devices (generally) come with widevide DRM built in and this is probably the most common one used, but the system supports other DRMs also and device vendors may add different ones.
If you are prepared to accept a less secure encryption, but one which may be good enough for your needs, then MPEG DASH includes a 'clearkey' option which ExoPlayer supports. If you do go this way it is worth checking on the latest ExoPlayer status as this feature is being worked on at the moment:
https://github.com/google/ExoPlayer/issues/3178

Prevent jwplayer video to download from chrome mobile browser

I am working on jwplayer video and I need to prevent the video from download.
When i double click on mobile chrome browser while video is playing it gives me the download option.
I have study so many articles and blogs posts about this but still could not find any solution.
I don't want to use HLS stream option. Is there any parameter jwplayer use that recognize the authenticated users and play video only for them? or is there any other way to do it.?
If you are worried about the video being copied by authorised users then ultimately there is no way to stop the user downloading it - the video has to get to the device/browser for it to play and it is not hard to get around any URL obfuscating etc.
The usual approach to avoid copying is to encrypt the video and use some secure way to send the key to decrypt it.
This is essentially what DRM systems do.
The stronger DRM implementations generally also make sure that the end user or application never is able to . This is done by having the encrypted video and the key do their work within a 'secure media path' in the device, that applications and even the OS have no access to.

Open pdf documents in browser on Android 4+

I have seen several of these question from 1-2 years ago about Android pre-4.0. I want to ask this again for Android 4+.
I have a galaxy s3 running 4.3 and when I click on a pdf link it downloads the document rather than opening it in the browser.
I am building a website and it will have links to pdf documents. The desired behavior when one of my users clicks on the pdf link on their Android device is for the pdf document to just open like it would on a desktop browser.
Is there anything I can do to achieve this functionality, or does Android still not support this?
I cannot control the device that a user is using, so I'm looking for a solution that would achieve this functionality in as many cases as possible.
The stock browser does not support native viewing of PDFs. You can however redirect the link to google docs and view internally that way. To do this, launch your implicit view intent, as I suspect you are already doing, but prepend the URI with "https://docs.google.com/gview?url=" and Google will take care of the rest
Alternately, there are a few libraries that you will see linked around SO, but from what I saw while researching, most are proprietary and cost and even then they might not work 100%. Google docs is free and works as often as Google does, which given that this is their platform you have to imagine they make certain their service works close to 100% of the time.
it downloads the document rather than opening it in the browser.
"it" is a Web browser. There are many Web browsers for Android. A Web browser can do whatever it wants when the user clicks on a link to a PDF file.
The desired behavior when one of my users clicks on the pdf link on their Android device is for the pdf document to just open like it would on a desktop browser.
That is not the behavior of all desktop browsers, particularly depending upon user configuration (e.g., browser extensions). A desktop Web browser, like a mobile Web browser, is welcome to do whatever it wants when the user clicks on a link to a PDF file.
does Android still not support this?
Android is an OS. Android neither supports nor does not support this. Web browser applications will or will not support what you want.
I cannot control the device that a user is using, so I'm looking for a solution that would achieve this functionality in as many cases as possible.
You are welcome to test a variety of Android Web browsers, see if there are any that behave the way you like, and suggest to your users that you would prefer that they use those browsers. Your users, in turn, are welcome to honor or ignore your request.
Or, as Chris M points out, you are welcome to not show a PDF at all, but rather redirect the user to some URL that processes the PDF and renders it in some other way.

Capturing photo , audio and video from web application

I am making a web application which has the functionality of capturing the photo, audio and video. Till now i have considered the JQM and Sencha framework.
For photo i am able to directly open a camera using Sencha and it works great. But for audio and video i am not able to find solution like photo. Does anyone has done this? or have an idea how can this done?.
I am aware this can be done via Phone-gap but that is for the Hybrid App (native + html5) app i want to do it for browser.
There is no API in html 5 that will allow you to acces the camera/microphone directly in iOS.
Since iOS 6 there is only the option the upload an photo via the input tag.
You could try getUserMedia.
Supports is still sparse though - see here
Tutorial - see here
I highly recommend using Media element. I've built entire JQM mobile solutions using the video player capabaility, and audio.
http://mediaelementjs.com/

Categories

Resources