javascript - 使用 Web 前端列出 Azure 容器内的所有 Blob，并提供目录级支持

Question

我目前正在开发一组代码，以使用 Web 前端显示指定 Azure 容器内的所有 Blob。我期望最终的输出是这样的:

我首先创建一个虚拟存储帐户，并在其中填充一些虚拟文件供我使用。

https://alicebob.blob.core.windows.net/documents  
├── docx  
│   ├── 201801_Discussion.docx  
│   ├── 201802_Discussion.docx  
├── xlsx  
│   ├── 201801_Summary.xlsx  
│   ├── 201802_Summary.xlsx  
│   ├── 201803_Summary.xlsx  
├── 201801_Review.pdf  
├── 201802_Review.pdf  
├── 201803_Review.pdf  

为了开发文件列表功能，我使用 here 中的 Azure 存储 JavaScript 客户端库并将所有必要的代码(.html 和 .js 文件)放入 Azure 静态网站 $web 容器中，并设置 index.html 作为静态网站配置中的索引文档名称 和错误文档路径。

https://alicebob.z23.web.core.windows.net/  
├── azure-storage.blob.min.js  
├── azure-storage.common.min.js  
├── index.html  

问题是执行列表的函数只有 listBlobsSegmentedWithPrefix 或 listBlobDirectoriesSegmentedWithPrefix。因此，就我而言，我认为以结构良好的/树格式列出所有 blob 和目录不会直接起作用。

我当前的方法是欺骗代码继续使用listBlobDirectoriesSegmentedWithPrefix，直到内部没有更多目录可列出，然后继续使用listBlobsSegmentedWithPrefix列出

到目前为止，我非常满意我的代码可以列出叶级的所有 Blob，并且还可以列出所有不在叶级的目录。您可以查看 blob 列表 here并随时前往“查看源代码”查看我迄今为止构建的代码。

我面临的唯一问题是，如果 Blob 不在叶级，则这组代码无法列出 Blob。例如，它无法列出 alicebob 存储帐户上的这些 blob:

├── 201801_Review.pdf  
├── 201802_Review.pdf  
├── 201803_Review.pdf  

这是一个预期问题，因为如果 listBlobsSegmentedWithPrefix 不在叶级，我就不会运行它。原因是它会产生类似这样的输出，这不是我想要的:

├── docx/201801_Discussion.docx  
├── docx/201802_Discussion.docx  
├── xlsx/201801_Summary.xlsx  
├── xlsx/201802_Summary.xlsx  
├── xlsx/201803_Summary.xlsx  
├── 201801_Review.pdf  
├── 201802_Review.pdf  
├── 201803_Review.pdf 

关于如何解决这个问题有什么建议吗？真正的实现将涉及大量数据，因此我认为简单的 if-then-else 在这种情况下效率不高。

sorry for the long description but I just want to describe my problem as clear as possible :)

Answer 1

列出 blob 时有一个称为分隔符的选项。让我们开始编写代码。

blobService.listBlobsSegmentedWithPrefix('documents',null,null,{delimiter:'/'},(error,result,response)=>{
    console.log(result);
    console.log(response.body.EnumerationResults.Blobs.BlobPrefix);
})

使用分隔符/，列表操作返回两部分的结果。

1. result，包含容器根目录下的blob信息，例如201801_Review.pdf 等在您的情况下。
响应正文中的

2. BlobPrefix，包含带分隔符的单级目录名称。

   [ { Name: 'docx/' }, { Name: 'xlsx/' } ]
   

使用BlobPrefix作为前缀，我们可以继续列出当前子目录的内容。

    blobService.listBlobsSegmentedWithPrefix('documents','docx/',null,{delimiter:'/'},(error,result,response)=>{
        console.log(result);
        console.log(response.body.EnumerationResults.Blobs.BlobPrefix);
    }) 

基本上第 1 点结果就足够了，您不一定必须使用 BlobPrefix 来重构您的代码。请参阅 list blobs 的使用分隔符遍历 Blob 命名空间部分了解更多信息.