使用Pure JavaScript和Azure-Storage-JS下载Azure存储斑点

Question

我只是尝试使用纯JavaScript和SDK来完成此操作。我是不是使用node.js。我正在将我的应用程序从v2转换为SDK Azure-Storage-JS-V10

的V10

azure-storage.blob.js捆绑文件与UMD兼容 标准，如果找不到模块系统，则遵循全局变量 将导出： azblob

我的代码在这里：

const serviceURL = new azblob.ServiceURL(`https://${account}.blob.core.windows.net${accountSas}`, pipeline);
const containerName = "container";
const containerURL = azblob.ContainerURL.fromServiceURL(serviceURL, containerName);
const blobURL = azblob.BlobURL.fromContainerURL(containerURL, blobName);
const downloadBlobResponse = await blobURL.download(azblob.Aborter.none, 0);

下载blobresponse看起来像这样：下载blobresponse

使用v10，如何将下载BlobResponse转换为新的Blob，以便可以在Filesaver Saveas（）函数中使用？

在Azure-Storage-JS-V2中，此代码在较小的文件上使用：

let readStream = blobService.createReadStream(containerName, blobName, (err, res) => {
    if (error) {
        // Handle read blob error
    }
});
// Use event listener to receive data
readStream.on('data', data => {
    // Uint8Array retrieved
    // Convert the array back into a blob
    var newBlob = new Blob([new Uint8Array(data)]);
    // Saves file to the user's downloads directory
    saveAs(newBlob, blobName); // FileSaver.js
});

我已经尽一切努力使V10正常工作，任何帮助都将不胜感激。

谢谢，

Answer 1

您需要通过等待Blobbody获得身体。

downloadBlobResponse = await blobURL.download(azblob.Aborter.none, 0);
// data is a browser Blob type
const data = await downloadBlobResponse.blobBody;

Answer 2

thanx Mike Coop和Xiaoning Liu！

我忙于制作一个Vuejs插件来从存储帐户下载Blobs。对你来说，我能够完成这项工作。

var FileSaver = require('file-saver');
const { BlobServiceClient } = require("@azure/storage-blob");
const downloadButton = document.getElementById("download-button");
const downloadFiles = async() => {
    try {
        if (fileList.selectedOptions.length > 0) {
            reportStatus("Downloading files...");
            for await (const option of fileList.selectedOptions) {
                var blobName = option.text;
                const account = '<account name>';
                const sas = '<blob sas token>';
                const containerName = '< container name>';
                const blobServiceClient = new BlobServiceClient(`https://${account}.blob.core.windows.net${sas}`);
                const containerClient = blobServiceClient.getContainerClient(containerName);
                const blobClient = containerClient.getBlobClient(blobName);
                const downloadBlockBlobResponse = await blobClient.download(blobName, 0, undefined);
                const data = await downloadBlockBlobResponse.blobBody;
                // Saves file to the user's downloads directory
                FileSaver.saveAs(data, blobName); // FileSaver.js
            }
            reportStatus("Done.");
            listFiles();
        } else {
            reportStatus("No files selected.");
        }
    } catch (error) {
        reportStatus(error.message);
    }
};
downloadButton.addEventListener("click", downloadFiles);

Answer 3

感谢Xiaoning Liu！

我仍在学习异步JavaScript功能和承诺。猜猜我只是错过了另一个" 等待"。我看到"下载blobresponse.blobbody"是一个承诺，也是斑点类型，但是，我无法弄清楚为什么它不会转换为新的斑点。我一直在得到" 迭代器Getter"不是可叫"错误。

这是我的最终工作解决方案：

// Create a BlobURL
const blobURL = azblob.BlobURL.fromContainerURL(containerURL, blobName);
// Download blob
downloadBlobResponse = await blobURL.download(azblob.Aborter.none, 0);
// In browsers, get downloaded data by accessing downloadBlockBlobResponse.blobBody
const data = await downloadBlobResponse.blobBody;
// Saves file to the user's downloads directory
saveAs(data, blobName); // FileSaver.js