DevExtreme File Manager - Azure Client-Side Binding

This example uses a custom file provider to connect the FileManager component to Azure Blob Storage (on the client side). The Custom File System Provider allows you to implement custom APIs to handle appropriate file operations (add, delete, rename, etc.). All APIs used to access Azure Blob Storage on the client are stored in the azure.file.system.js file (app.service.ts - for Angular framework). On the server, configure Shared Access Signature (SAS) to grant access to blobs within the storage.

IMPORTANT

The code snippets in this repository are for informational purposes only. Security should be your #1 priority when using Azure Blob storage. You should consult a security expert or apply accepted best practices to maintain the highest security posture for your DevExtreme-powered web application. Remember, a secure web app demands careful consideration/understanding of potential attack vectors, the configuration of your development environment, and security posture of third-party service providers.

If running an Angular, React, Vue, or jQuery example, you will need to run a .NET-based backend project as well (Azure_Backend). To connect this project to an Azure server, you need to specify your Azure credentials in appsettings.json:

"AzureStorage": {
    "AccountName": "yourAccount",
    "AccessKey": "yourKey",
    "FileManagerBlobContainerName": "ContainerName"
  },

Files to Review

• jQuery
  • index.js
• Angular
  • app.component.html
  • app.component.ts
• Vue
  • Home.vue
• React
  • App.tsx
• NetCore
  • Index.cshtml

Documentation

• Getting Started with FileManager
• Bind FileManager to File Systems

More Examples

• FileManager for DevExtreme - Azure Server-Side Binding
• FileUploader for DevExtreme - Direct Upload to Azure

Does this example address your development requirements/objectives?

(you will be redirected to DevExpress.com to submit your response)