Support Topics Documentation Slack YouTube Blog

File uploading, and not returning fileURL


(Saurav Sircar) #1

I am currently trying out the code present in the docs of the file APIs. The file always seems to upload properly, but never returns the file URL. This is the code I’m using.

<!DOCTYPE html>
<html>
<head lang="en">
    <meta charset="UTF-8">
    <title>Files</title>
    <script src="https://api.backendless.com/sdk/js/v4/beta/backendless.min.js"></script>
    
</head>
<body>
<input type="file" id="files" name="files[]" multiple />
<input type="button" onclick="uploadFileFunc(); return false;" value="Upload File"/>
<script>
Backendless.initApp( "XXXXXXXXXXXXXXXX", "XXXXXXXXXXXXX", "v1" );


document.getElementById('files').addEventListener('change', handleFileSelect, false);
  
function handleFileSelect(evt) 
{
   file = evt.target.files[0]; // FileList object
}
  
function uploadFileFunc()
{
  var callback = {};
  
   callback.success = function(result)
   {
        
   }
  
   callback.fault = function(result)
   {
       alert( "error - " + result.message );
   }
  
   Backendless.Files.upload( file, "my-folder" )
    .then( function( fileURLs ) {
       console.log( "File successfully uploaded. Path to download: " + result.fileURL );
     })
    .catch( function( error ) {
       console.log( "error - " + error.message );
     })
};
</script>
</body>	
</html>

Under “Backendless.Files.upload” the .then function does not return URLs. Is the code wrong?


(Mark Piller) #2

I see two issues here:

    The “initApp” function in your example uses the 3.x format (see the 3rd argument in the call), however, you’re importing the version 4 of the library.
    The .then callback in your code references the “result” variable, however, the promise function for the upload is declared with the “fileURLs” variable. I realize you copied from our example, which is not correct - we will fix it asap. The proper way to write that code is:
.then( function( fileURL ) {
console.log( "File successfully uploaded. Path to download: " + fileURL );
})

(Saurav Sircar) #3

fileURL is returning [object Object]. Where can I get the actual URL?
Also, what is the result variable used for?


(Mark Piller) #4

That’s right, it is an object. It contains a property called “fileURL”, which is the actual URL. So to get it, you do the following (I renamed the response object to make it easier to understand):

.then( function( response ) {
  var actualURL = response.fileURL;
})