Binary File uploads

There were a few issues with your code. One was your fault and one was mine.

Attached is the fixed code and two server files. I changed the parameters for the upload function to be more inline with what you’re doing. It will now take various video formats and photos. So you can upload a user profile photo. Just set the purpose=“profile” or “event.”

On the server the files are set in domain.com/images/user or domain.com/images/event. It’s not well documented but essentially it creates an md5 hash of the file name and then breaks that hash into a directory structure and stores the file there. You’ll have to write the code to add that file path to you DB. Of course you can change it to whatever you want but I don’t store images in my DB. Also, the server side script will fail if the file exist so you’ll have to remove it but that’s stuff you can code.
VideoSolutionsProject.zip (18.1 KB)

Hi Phil,
Thank you very much for looking into this for me…unfortunately I’m still stuck with the FileTransferError.FILE_NOT_FOUND_ERR, despite the URL looking correct etc.
I’ve spent hours on this today, but no luck.
Have you had this code running correctly recently on Android 10?
I’m wondering if something has changed in the past year or two in Android to prevent me completing this…

I ran it on iOS and Android both this weekend. When you use the picker API like I put in your code, it returns the correct URI scheme for the window.resolve…() stuff once that’s resolved, the upload works just fine.

uncomment those console.log statements and track it through the process.

Hi Phil,
I’ve tried again and the button in the code goes straight to live recording of video rather than video picker.
I’ll take another look.

Hi Again,
I’ve had to change the code to turn it into a filepicker:-

JavaScript
Button2.onclick = function() {
  videoOptions ={quality: 100,
    destinationType: Camera.DestinationType.FILE_URI,
    sourceType: Camera.PictureSourceType.PHOTOLIBRARY,
    mediaType: Camera.MediaType.VIDEO
  };
  // navigator.device.capture.captureVideo(VideoCaptureCallback, 
 VideoCaptureError, videoOptions);

  navigator.camera.getPicture(VideoCaptureCallback, VideoCaptureError, videoOptions);
};

function VideoCaptureCallback(mivideo) {
  vdpath = mivideo[0].fullPath;
  TextBox1.text = vdpath;
}

function VideoCaptureError(err) {
  NSB.MsgBox("Error> " + err);
}
End JavaScript

The problem with this is that it leaves the textbox as Undefined…

Any chance you could take another look when convenient and maybe simplify this as much as possible?

Ultimately my goal is still to record 2 videos (e.g.) save each of their names into sqlite or localstorage or textboxes and then send them to a simple uploaded that can name them as a function of the parameters uploaded…
Thanks again,
Neil

Quick question, Phil. When you tested in recent weeks, did you build with PhoneGap Build or Voltbuilder?
Could you share your config file if possible?
Thanks,
Neil

When I looked at your code you had the call to capture followed by the call to pick. The call to capture returns the correct URI for uploading so the call to pick is unnecessary. Also, on androids make sure you have plenty of memory or your app will get completely swapped out and you’ll need an event handler to capture the URI. This is all well documented on the plugins git repository.

Hi Phil,
My test app was attempting to go from :-
Record Video
->Save Filelocation to Textbox
->use textbox contents to reference the file and have them called via a second button to upload the file.

I’ve come to the conclusion that it can’t be done like that.

I need to either store the object array which is accessible immediately after creating the video or image and store that as an object in SQLite ( not 100% sure if possible) or just have a real-time sendback directly after record…which isn’t a solution that will work for our customers…

Thanks,
Neil

Maybe this is all not working because I’m saving the videos into the wrong folders or not copying them into folders which I can actually use?

Let’s look at this code:

Button2.onclick = function() {
  // create your options but where is videoOptions defined as a var?
  // you sure this insn't throwing an error in console?
  **let** videoOptions ={quality: 100,
    destinationType: Camera.DestinationType.FILE_URI,
    // here, you're setting the source as picker
    sourceType: Camera.PictureSourceType.PHOTOLIBRARY,
    mediaType: Camera.MediaType.VIDEO
  };
  // here you commented out the capture
  // navigator.device.capture.captureVideo(VideoCaptureCallback, 
 VideoCaptureError, videoOptions);
  // here you're using the getPicture method using the video parameters
  navigator.camera.getPicture(VideoCaptureCallback, VideoCaptureError, videoOptions);
};

Work on one problem at a time using one method() at a time.

Hi Phil, My test app was attempting to go from :- Record Video ->Save Filelocation to Textbox ->use textbox contents to reference the file and have them called via a second button to upload the file. I’ve come to the conclusion that it can’t be done like that. I need to either store the object…

There is no need to do it this way, you’re way over complicating this. When you call camera.getPicture() the options tell it whether to capture or allow the user to pick and those options determine whether its a video or photo.

Go back to my original code:

  navigator.camera.getPicture(onSuccess, onError, { quality: 100,
    destinationType: Camera.DestinationType.FILE_URI,
    sourceType: Camera.PictureSourceType.PHOTOLIBRARY,
    mediaType: Camera.MediaType.VIDEO
  });

Get this to work with a small, pre-existing video clip before you do anything else. Once you can pick and upload that small clip, then you can move on to recording.

Thanks Phil.
I’ll get back into it in the morning and see how I go! It’s been a long day here :slight_smile:

Ok, so I got to the stage where I am able to pick a video or photo and upload it.
Still struggling massively with Recording and sending.
It’s as though file picking is the only way to get a handle on the files.

I’m just back from an impromptu day of deep sea fishing. I’ll help you more in the morning.

Haha, I know where I’d rather be!
Hope they were biting!

Ok, I’ve got good news!
Last night at 12:45 I finally was able to read the contents of a just recorded video.
In the end it involved setting READ_EXTERNAL_STORAGE permissions in the code. ( Not in the config).
I’m taking the weekend off now and will get back into it on Monday. I’ll post my successful code then.

@Neil_HNF, good work!

And I want to hear more about the fish!

Hi to all those who assisted on this topic.
I eventually got a system for audio recording and another for video recording and then uploading working on my android projects.
The video solution needed transcoding due to the enormous size of video recording on my devices, but it all worked.
I then had to complete a backlog of ‘mundane’ day to day stuff, so have parked the project in the category of ‘working - awaiting application in an app’.
I’ll follow up with the bones of my solutions soon. The eventual solutions came down in the main to setting up the right permissions…but it was one helluva ride getting there. Always a simple solution in the end in coding…if you know the answers! :slight_smile:
Thanks,
Neil

Great - now, what about those fish? :slight_smile: