How to upload folder into azure automatically?

问题

Now I have this part of a code, which shows me all folders in the directory.

        var dirPath = path.join("C:\\", 'ILJATEST');
    fs.readdir(dirPath, function (err, files) {
        if (err) {
            return console.log('Unable to scan dir ' + err);
        }
        files.forEach(function (file) {

            console.log(file);
        });
    });

And this part, where I can choose file and upload to Azure blob storage when click button. (it's work)

        document.getElementById('upload-button').addEventListener('click', () => {
        const file = document.getElementById('fileinput').files[0];
        blobService.createBlockBlobFromBrowserFile('mycontainer',
            file.name,
            file,
            (error, result) => {
                if (error) {
                    // Handle blob error
                } else {
                    console.log('Upload is successful');
                }
            });
    });

How to combine these codes, to all folders with files from C:ILJATEST uploaded automatically, when an app is started?

回答1:

I see you were using Azure Storage JavaScript Client Library for Browsers to automatically upload all files under a folder and its all sub-folders in brower.

Here is my sample code which refer to the offical sample Azure Storage JavaScript Client Library Sample for Blob Operations to set CORS rules and get the sas token from Azure Storage Explorer, and it works for me.

<html>
<head>
<script src="https://dmrelease.blob.core.windows.net/azurestoragejssample/bundle/azure-storage.blob.js"></script>
</head>
<body>
<input type='file' id="files" name="files" multiple webkitdirectory directory />
<script>
// Render via server-side to pass the value of account name and sas token, even container name.
var accountName = '<your storage account>';
var SasToken = '<sas token like sv=2018-03-28&ss=bfqt&srt=sco&sp=rwdl&st=2019-04-11T06%3A48%3A24Z&se=2019-04-12T06%3A48%3A24Z&sig=xxxxxxxxxxxxxxxxxxxx'
var blobUri = 'https://' + accountName + '.blob.core.windows.net';
var blobService = AzureStorage.Blob.createBlobServiceWithSas(blobUri,SasToken);
var containerName = '<your container name>';
document.getElementById("files").addEventListener("change", function(event) {
    var files = event.target.files;
    console.log(files)
    for(var i in files) {
        blobService.createBlockBlobFromBrowserFile(containerName, files[i].webkitRelativePath, files[i], {blockSize : files[i].size}, function(error, result, response) {
            finishedOrError = true;
            if (error) {
                // Upload blob failed
            } else {
                // Upload successfully
            }
        })
    }
});
</script>
</body>
</html>

Notes:

At here, I use file.webkitRelativePath (only works in Chrome or other browsers based on chromium, please refer to https://developer.mozilla.org/en-US/docs/Web/API/File/webkitRelativePath) instead of file.name, because it includes parent-folder path.
Considering for security, I suggest to reduce the expire time for sas token as possible as you can and to render the HTML page for account name and sas token dynamically on server-side.

Otherwise, you can try to upload files to Azure Storage on server-side.

Front Page index.html:

<form action='/upload' enctype="multipart/form-data" method="POST">
    <input type='file' id="files" name="files" multiple webkitdirectory directory />
    <input type="submit" value="Submit" />
</form>

Server-side using express and multer-azure-storage:

var azure = require('azure-storage');
var accountName = '<your account name>';
var accountKey = '<your account key>';
const express = require('express');
const app = express();
const port = 3000;
var multer  = require('multer');
var MulterAzureStorage = require('multer-azure-storage');
var upload = multer({
    preservePath: true,
  storage: new MulterAzureStorage({
    azureStorageConnectionString: 'DefaultEndpointsProtocol=https;AccountName='+accountName+';AccountKey='+accountKey+';EndpointSuffix=core.windows.net',
    containerName: '<your container name>',
    containerSecurity: 'blob',
    fileName: function(file) {
        return file.originalname; // file.originalname includes parent-folder path name
    }
  })
});
app.use(express.static('public'));
app.post('/upload', upload.any(), function(req, res, next) {
    console.log(req.files);
    res.send('OK');
});

app.listen(port, () => console.log(`Example app listening on port ${port}!`));

来源：https://stackoverflow.com/questions/55613356/how-to-upload-folder-into-azure-automatically

标签

javascript

node.js

azure

azure-blob-storage