POST Request to Azure File Provider Doesn't Affect File Manager

Currently trying to understand how I can manipulate the file manager via API requests to the file provider, I've managed to make a POST to the Azure file provider which has been able to return a response although it's not clear in your documentation on what the program needs to do in order to process this.
 getPathFromURL: function(){
        var read = {
          action: "read",
          path: "/TestDirectory/",
          showHiddenItems: false,
          data: []
        }
        console.log(read);
        axios.post("http://localhost:57662/AzureProvider/AzureFileOperations", read).then((response) => {
          console.log(response);
        });
  }

Can I please get some direction on how I'm supposed to use the response data to modify the file manager to display the data within the "TestDirectory" directory?

1 Reply

SA Shameer Ali Baig Sulaiman Ali Baig Syncfusion Team April 28, 2020 12:11 PM UTC

Hi Adam, 
 
Greetings from Syncfusion support. 
 
We have looked into your requirement to change the File Manager content from the response JSON data received from an external event. As of now, File Manager has support to handle the data from the in-built AJAX operations and have no support to render File Manager content based on the given JSON data. 
 
However, we have already considered to provide this functionality support in File Manager component. The support for this feature will be included in any of our upcoming Volume releases. 
 
You can track the status of this feature using the following link. 
 
 
However, by mapping the ajaxSettings property of the FileManager component to the appropriate controller methods allows to manage the files in the physical file system. By doing so, File Manager uses its internal AJAX methods to perform file operation to access and manage your azure file system. 
 
 
For your reference, we have prepared a sample for Vue FileManger with Azure MVC FileProvider. Refer the below sample link.  
  
  
  
Steps to run the service:  
1.      Clone or download the above service. Add your Azure blob path for RegisterAzure method in controller. Refer the below code snippet.  
 
operation.RegisterAzure("<--accountName-->", "<--accountKey-->", "<--blobName-->"); 
 
operation.setBlobContainer("<--blobPath-->", "<--filePath-->");  
 
 
2.      And also add the blobpath and filepath inside the AzureFileOperations and AzureUpload method in controller.  
3.      After that run the Azure Service.  
4.      Add the service launched URL in above FileManager sample.  
  
let hostUrl = "http://localhost:62869/";  
export default Vue.extend({  
  data() {  
    return {  
      ajaxSettings: {  
        url: hostUrl + "api/FileManager/FileOperations",  
        getImageUrl: hostUrl + "api/FileManager/GetImage",  
        uploadUrl: hostUrl + "api/FileManager/Upload",  
        downloadUrl: hostUrl + "api/FileManager/Download"  
      },  
      view: "Details"  
    };  
  },  
  provide: {  
    filemanager: [NavigationPane, DetailsView, Toolbar]  
  }  
});  
 
Refer the below links to know more about the FileManager component.  
  
  
  
  
Please let us know, if you need any further assistance. 
 
Regards, 
Shameer Ali Baig S. 


Loader.
Up arrow icon