How to upload files on mobiles - javascript

I'm working on a phonegap project using Html5 & Javascript.
I want the user to upload files. When I add this:
<input id="image-file" type="file" />
It works on the web browser, but when I open it on the mobile, it's disabled.
Is there someway to upload files with mobiles ?

You need to talk to the native libraries for the specific platform.
For iOS for example, you need access to the photo albums, in order to upload photo's. This needs to be done with the API from phonegap to talk to the iOS native libraries.
Every OS has a specific API to do this. I am not much into phonegap but I know this is there. Perhaps even 1 API for all OS's

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 download/save HTML5 Video on IOS to device

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?

How to load remote webpage on Android Hybrid App(the easy way)?

I have decided to learn how to create Android APK on windows for personal/learning use (Not for Android Play).
My design plan is to load a remote HTML page on android app and allow user to click a few links and then app make a post request to an API to get m3u8 of the video and play it !I already created the HTML web page and have the API access.
So could you guys point me to a beginner tutorial/example and what software and tools I need and which one is easiest to start with (to achieve my design goal)? (I installed PhoneGap but not sure if that is the only tool I need and if it is the easiest path. So I wait for your advice).
Furthermore, does installing java JDK creates any security issues for my PC? (since I heard lots of bad news about Java in past few years.)
If you are going with Phonegap, I would recommend you to first read the phonegap documentation so you can setup a basic phonegap project (phonegap). I would recommend to implement the site functionality inside phonegap instead of just loading an external site; this way you have access to more phone controls than from a web browser. But if it is really a requirement to load the external site, basically, the phone gap would load an empty page that would load your external site using the cordova inappbrowser plugin, here is the github page of this project (inappbrowser).

Browse File or Capture Image and Upload to server using Cordova Inappbrowser in Phonegap

I am using Cordova Plugin Inappbrowser to run my external website on device. In this external website I need to upload an Image (Gallery/Capture camera) or file on server. For this I have implemented HTML5 File API to make this feature run into my app too. I have tried various demo 1, demo 2 and tried this URL open into IAB to test; unfortunately they didn't work earthier inside my app. Whereas if I try to open these two demo in native browsers like Chrome, safari, firefox apps into my device these demo are allowing me to perform File API.
So can anyone help me to fix this issue........

Using FileTransfer to download files in the background on a mobile application packaged with phonegap

I have packaged my jQuery/javascript application with phonegap for Android, and later plan to do this for iOS/BlackBerry. In this project, I implemented the FileTransfer.download function from the phonegap API to download a file from the server. The function is working successfully, but it blocks me from navigating to other pages within the app until the download is complete.
Maybe I'm missing something in the documentation: what's the best way to get FileTransfer.download to work in the background so that I can freely navigate page to page? Is it possible without resorting to device-specific code?
The solution I'm settling for is creating a plugin to call native code that does the downloading. In Android for example, I can create an AsyncTask to do the downloading in a phonegap plugin. I guess I'll be required to do something similar in iOS/BlackBerry/etc. Still welcoming others' solutions

Categories

Resources