Woody
Posts: 0
Joined: Thu Dec 04, 2014 2:37 pm

Upload local file to database files collection

I have created a local PDF using jsPDF and I have successfully tested Cordova's FileTransfer.

However, I'd like to upload the file to Appery's database file collection so I can eliminate having another server.

I have read http://devcenter.stage-dev.appery.io/...

and this is what I am trying

code
window.requestFileSystem(LocalFileSystem.PERSISTENT, 0, gotFS, fail);

Code: Select all

 function gotFS(fileSystem) { 
     fileSystem.root.getFile("test.pdf", {create: false}, gotFileEntry, fail); 
 } 

 function gotFileEntry(fileEntry) { 
     fileEntry.file(gotFile, fail); 
 } 

 function gotFile(file){ 
     readDataUrl(file); 
     //readAsText(file); 
 } 

 function readDataUrl(file) { 
     var reader = new FileReader(); 
     reader.onloadend = function(evt) { 
         console.log("Read as data URL"); 
         console.log(evt.target.result); 
     }; 
     reader.readAsDataURL(file); 
       call_script(reader); 
 } 

 function readAsText(file) { 
     var reader = new FileReader(); 
     reader.onloadend = function(evt) { 
         //console.log("Read as text"); 
         console.log(evt.target.result); 

     }; 
     reader.readAsText(file); 

 } 

function call_script() {
upload_service.execute(??? what goes here ??? or do I bind in mapping???);

}
function fail(evt) {
console.log(evt.target.error.code);
}

/code

Question:

In the files upload service, what type of data are you expecting? I am trying to use Phonegaps filesystem to return a text or binary string and I am getting an error

code
{
"status":400,
"uri":"https://api.appery.io/rest/1/db/files",
"response":{
"code":"BCXX002",
"description":"Cannot consume content type"
}
}

/code

Thanks!

Maryna Brodina
Posts: 0
Joined: Thu Apr 05, 2012 7:27 am

Upload local file to database files collection

Hello!

We have a project sample showing how to work with FileSystem. Would you be interested to take a look?

Woody
Posts: 0
Joined: Thu Dec 04, 2014 2:37 pm

Upload local file to database files collection

Yes please. Send me a link or via email.

Cheers.

Ihor Didevych
Posts: 0
Joined: Wed Nov 19, 2014 7:55 pm

Upload local file to database files collection

Could you write from your e-mail to a href="mailto:support@appery.io" rel="nofollow"support@appery.io/a for send?

Woody
Posts: 0
Joined: Thu Dec 04, 2014 2:37 pm

Upload local file to database files collection

Thank you for the demo project but the problem I have is NOT with dealing with file system.

It is posting to your file upload to database service using a local file instead of a filelist create using a "input" UI.

All of your javascripts (e.g., UploadHelper) refer to the FileList that is the output of the input element. However, I don't want user interaction / file selection. I simply wish to specify a local file that I want to upload to the file collection.

For example, if you were testing a file upload service what would you put in 'data'?

Can I instantiate whatever it is expecting in javascript if I have a local file? I have tried sending binary and text representations of a local file to the service but it fails.

Woody
Posts: 0
Joined: Thu Dec 04, 2014 2:37 pm

Upload local file to database files collection

It would be great if you would support uploading a file as Base64 data like Cloudinary does

http://support.cloudinary.com/entries...

I'm making one extra hop to host my files there because I could not figure out how to get a local file into your file collection without using user file select input.

Yurii Orishchuk
Posts: 0
Joined: Fri Feb 14, 2014 8:20 am

Upload local file to database files collection

Woody,

Here is solution to upload file to Appery.io DB files collection with base64 content.

  1. import DB files upload service.
    Details: http://prntscr.com/5f51tq/direct

  2. add upload service to the page. And call datasource "uploadService2".
    Details: http://prntscr.com/5f52b3/direct

  3. click on "before send" mapping and link your session token to "X-Appery-Session-Token" header.

    Details: http://prntscr.com/5f52oc/direct

  4. Add new JS asset and populate it with following JS code:

    precode

    function b64toBlob(b64Data, contentType, sliceSize) {
    contentType = contentType '';
    sliceSize = sliceSize 512;

    var byteCharacters = atob(b64Data);
    var byteArrays = [];

    for (var offset = 0; offset < byteCharacters&#46;length; offset += sliceSize) {
    var slice = byteCharacters&#46;slice(offset, offset + sliceSize);

    Code: Select all

     var byteNumbers = new Array(slice&#46;length); 
     for (var i = 0; i < slice&#46;length; i++) { 
         byteNumbers[i] = slice&#46;charCodeAt(i); 
     } 
    
     var byteArray = new Uint8Array(byteNumbers); 
    
     byteArrays&#46;push(byteArray); 

}

Code: Select all

 var blob = new Blob(byteArrays, {type: contentType}); 
 return blob; 

}

/code/pre

Details: http://prntscr.com/5f530x/direct

  1. Add button to the page and add JS "click" event handler with following JS code:

    precode

    &#47;&#47;Here you can set file name&#46;
    var fileName = "myFile&#46;png&quot

    &#47;&#47;Here you can use your base64 content&#46; Note: there is no "data:image/jpeg;base64," part&#46;
    var base64Content = 'iVBORw0KGgoAAAANSUhEUgAAAAUAAAAFCAYAAACNbyblAAAAHElEQVQI12P4&#47;&#47;8/w38GIAXDIBKE0DHxgljNBAAO9TXL0Y4OHwAAAABJRU5ErkJggg==';
    var fileBlob = b64toBlob(base64Content, "image/png");

    var data = new FormData();

    data&#46;append(fileName, fileBlob);

    var onSuccess = function(data){
    alert(JSON&#46;stringify(data));
    };

    &#47;&#47;Where "uploadService2" is your updload service datasource name&#46;
    uploadService2&#46;execute({
    'allowDataModification': false,
    'processData': false,
    'body': {data: data},
    'cache': false,
    'success': onSuccess
    });

    /code/pre

    Now on click this button you will upload file and alert with result will appear.
    You can get file url from result and download this file.

    That's all.

    Regards.

Woody
Posts: 0
Joined: Thu Dec 04, 2014 2:37 pm

Upload local file to database files collection

Thank you very much -- I will give that a try.

I just spent a few hours rewiring everything to work with Cloudinary but when I have time I will try this approach.

So now if anyone wants to create a PDF on the fly and upload to your database they can!

Cheers.

M&M
Posts: 0
Joined: Tue Nov 11, 2014 6:59 am

Upload local file to database files collection

ho Yurii,

During the conversion to blob, or before is it possible to add some metadata to the file? For example to the image I want to add tag/metadata timestamp and also latitude and longitude. I already have created the service to get the gps coordinates. I just need to embed that into the image so that I need to transfer only the image. On the server side I can read the tags/metadata and get the timestamp, gps coordinates etc.

Thanks,
M&M

Yurii Orishchuk
Posts: 0
Joined: Fri Feb 14, 2014 8:20 am

Upload local file to database files collection

Hi M&M,

Yes you can modify file source like you need.

Unfortunatly we don't have such code example.. But you can learn about this protocol here: http://en.wikipedia.org/wiki/Exchange...

Regards.

Return to “Issues”