azure - 如何使用 PUT 和 SaS Url 将大文件 (~10GB) 直接从浏览器上传到 Azure Blob 存储？

Question

场景很简单:我的Web应用程序由ReactJS SPA作为前端和在VM中运行的Web api作为后端组成；当用户需要上传文件时，后端会生成一个带有 SAS token 的 URL，用于将文件上传到 Azure 存储帐户和 Blob 容器中。后端用这个url回复前端SPA，用户可以直接从本地浏览器上传文件到azure blob存储，不需要再次跨越后端VM。

在后端，我使用此代码生成带有 SAS token 的 url:

function generate_signed_url(BLOB_NAME, AZURE_PRIMARY_KEY) {
    
    const ACCOUNT_NAME = process.env.AZURE_BLOB_STORAGE_ACCOUNT_NAME;
    const CONTAINER_NAME = process.env.AZURE_BLOB_STORAGE_CONTAINER_NAME;
    const ACCESS_KEY = process.env.AZURE_BLOB_STORAGE_ACCESS_KEY;

    const sharedKeyCredential = new StorageSharedKeyCredential(accountName=ACCOUNT_NAME, accountKey=ACCESS_KEY)
      
    //This URL will be valid for 1 hour
    const expDate = new Date(new Date().valueOf() + 3600 * 1000);

    // Generate service level SAS for a blob
    const blobSAS = generateBlobSASQueryParameters({
      containerName: CONTAINER_NAME, // Required
      blobName: BLOB_NAME, // Required
      permissions: BlobSASPermissions.parse("racwd"), // Required
      startsOn: new Date(), // Optional
      expiresOn: expDate, // Required. Date type
      cacheControl: "cache-control-override", // Optional
      contentDisposition: "content-disposition-override", // Optional
      contentEncoding: "content-encoding-override", // Optional
      contentLanguage: "content-language-override", // Optional
      contentType: "content-type-override", // Optional
      ipRange: { start: "0.0.0.0", end: "255.255.255.255" }, // Optional
      protocol: SASProtocol.HttpsAndHttp, // Optional
      version: "2016-05-31" // Optional
    },
    sharedKeyCredential 
    ).toString();

    SaSURL = `https://${ACCOUNT_NAME}.blob.core.windows.net/${AZURE_CONTAINER}/${AZURE_BLOB}?${containerSAS}`;
    
    console.log(`SAS URL for blob is: ${SaSURL}`);
    return SaSURL;
}

在前端 SPA 中，我使用此代码通过 SaS Url 上传文件:

      await axios({
        method: 'PUT',
        url: SaSUrl,
        data: file,
        signal: axiosUploadController.signal
      });

但是，我收到 413 错误:

PUT https://johnapp.blob.core.windows.net/appFiles/raw/largeOne-4GB.zip?sv=2016-05-31&spr=https%2Chttp&st=2023-07-12T16%3A28%3A48Z&se=2023-07-12T17%3A28%3A48Z&sip=0.0.0.0-255.255.255.255&sr=b&sp=racwd&sig=123qwse123qwe%3D&rscc=cache-control-override&rscd=content-disposition-override&rsce=content-encoding-override&rscl=content-language-override&rsct=content-type-override 413 (The request body is too large and exceeds the maximum permissible limit.)

事实证明，单个 PUT 操作存在限制:https://learn.microsoft.com/en-us/rest/api/storageservices/put-blob?tabs=azure-ad#remarks限制为 5000Mb，或 4000Mb；

那么，如何使用 SaS Url 上传这个 10GB zip 文件呢？我需要为我的客户提供服务，以便将来上传更大的文件(~20GB)；

Answer 1

要上传大型 Blob，您需要将 Blob 分成 block (也称为 block )并使用 Put Block 上传这些 block 。 。上传所有 block 后，您需要使用 Put Block List 提交这些 block 。 .

我很久以前写过一篇关于它的博客文章，您可能会觉得有用:https://gauravmantri.com/2013/02/16/uploading-large-files-in-windows-azure-blob-storage-using-shared-access-signature-html-and-javascript/ .

请注意，我是在 JavaScript SDK 出现之前写这篇文章的。请查看 Azure Blob 存储 JavaScript SDK，因为它已经实现了 Put Block 和 Put Block List REST API 操作。