Question

我正在尝试使用Angular中的SDK V10将图像上传到Microsoft Azure的Blob存储上。

以下是我当前用于连接到存储并列出所有容器名称的代码：

// connect to the Blob Service
const pipeline = StorageURL.newPipeline(new AnonymousCredential(), {
    retryOptions: { maxTries: 4 },
    telemetry: { value: "HighLevelSample V1.0.0" }
});

const serviceURL = new ServiceURL(
    `${this.blobUri}/${environment.azureContainers.sasToken}`,
    pipeline
);

// List containers
let marker;
do {
    const listContainersResponse: Models.ServiceListContainersSegmentResponse = await serviceURL.listContainersSegment(
      Aborter.none,
      marker
    );

    marker = listContainersResponse.nextMarker;
      for (const container of listContainersResponse.containerItems) {
        console.log(`Container: ${container.name}`);
      }
} while (marker);

现在，我想在列出的一个容器中上传文件（特别是图像）（与这个问题无关，哪个容器都可以），但是我从{{3} }，文件路径是必需的，但我没有。我所拥有的是JS中“文件”类型的对象，据我所知，由于安全原因，无法从浏览器获取文件路径！

您对如何实现这一目标有任何想法吗？如何将图像上传到Angular的Blob存储中？

Answer 1

您所引用的示例适用于有权访问文件系统的Node JS。要在浏览器中上传文件，您将需要使用uploadBrowserDataToBlockBlob方法。

从此samples link

  // Parallel uploading a browser File/Blob/ArrayBuffer in browsers with uploadBrowserDataToBlockBlob

  const browserFile = document.getElementById("fileinput").files[0];
  await uploadBrowserDataToBlockBlob(Aborter.none, browserFile, blockBlobURL, {
    blockSize: 4 * 1024 * 1024, // 4MB block size
    parallelism: 20, // 20 concurrency
    progress: ev => console.log(ev)
  });

如何使用v10 SDK将图像上传到Azure Blob存储？

1 个答案: