使用 JavaScript 或 TypeScript 取得容器或 Blob 的 URL

您可以使用用戶端物件的 url 屬性，取得容器或 Blob URL：

• ContainerClient.url
• BlobClient.url
• BlockBlobClient.url

注意

本文中的範例假設您已使用開始使用 Azure Blob 儲存體 和 JavaScript 或 TypeScript 文章中的指引來建立 BlobServiceClient 物件。

取得容器或 Blob 的 URL

下列範例會藉由存取用戶端的 url 屬性來取得容器 URL 和 Blob URL：

JavaScript

// create container
const containerName = `con1-${Date.now()}`;
const { containerClient } = await blobServiceClient.createContainer(containerName, {access: 'container'});

// Display container name and its URL
console.log(`created container:\n\tname=${containerClient.containerName}\n\turl=${containerClient.url}`);

// create blob from string
const blobName = `${containerName}-from-string.txt`;
const blobContent = `Hello from a string`;
const blockBlobClient = await containerClient.getBlockBlobClient(blobName);
await blockBlobClient.upload(blobContent, blobContent.length);

// Display Blob name and its URL 
console.log(`created blob:\n\tname=${blobName}\n\turl=${blockBlobClient.url}`);

// In loops, blob is BlobItem
// Use BlobItem.name to get BlobClient or BlockBlobClient
// The get `url` property
for await (const blob of containerClient.listBlobsFlat()) {
    
    // blob 
    console.log("\t", blob.name);

    // Get Blob Client from name, to get the URL
    const tempBlockBlobClient = containerClient.getBlockBlobClient(blob.name);

    // Display blob name and URL
    console.log(`\t${blob.name}:\n\t\t${tempBlockBlobClient.url}`);
}

TypeScript

async function getUrls(blobServiceClient: BlobServiceClient): Promise<void> {
  
  // create container
  const containerName = `con1-${Date.now()}`;
  const {
    containerClient,
    containerCreateResponse
  }: {
    containerClient: ContainerClient;
    containerCreateResponse: ContainerCreateResponse;
  } = await blobServiceClient.createContainer(containerName, {
    access: 'container'
  });

  if (containerCreateResponse.errorCode)
    throw Error(containerCreateResponse.errorCode);

  // Display container name and its URL
  console.log(
    `created container:\n\tname=${containerClient.containerName}\n\turl=${containerClient.url}`
  );

  // create blob from string
  const blobName = `${containerName}-from-string.txt`;
  const blobContent = `Hello from a string`;
  const blockBlobClient = await containerClient.getBlockBlobClient(blobName);
  const blockBlobUploadResponse: BlockBlobUploadResponse =
    await blockBlobClient.upload(blobContent, blobContent.length);

  if (blockBlobUploadResponse.errorCode)
    throw Error(blockBlobUploadResponse.errorCode);

  // Display Blob name and its URL
  console.log(
    `created blob:\n\tname=${blobName}\n\turl=${blockBlobClient.url}`
  );

  // In loops, blob is BlobItem
  // Use BlobItem.name to get BlobClient or BlockBlobClient
  // The get `url` property
  for await (const blob of containerClient.listBlobsFlat({
    includeMetadata: true,
    includeSnapshots: false,
    includeTags: true,
    includeVersions: false,
    prefix: ''
  })) {
    // blob
    console.log('\t', blob.name);

    // Get Blob Client from name, to get the URL
    const tempBlockBlobClient: BlockBlobClient =
      containerClient.getBlockBlobClient(blob.name);

    // Display blob name and URL
    console.log(`\t${blob.name}:\n\t\t${tempBlockBlobClient.url}`);
  }
}

提示

在迴圈中逐一查看物件時，請使用 對象的 name 屬性來建立客戶端，然後使用用戶端取得 URL。 列舉程式不會傳回用戶端物件，而會傳回項目物件。

程式碼範例

• 檢視本文中的 JavaScript 和 TypeScript 程式代碼範例 （GitHub）

另請參閱

• 開始使用 Azure Blob 儲存體和 JavaScript
• 取得 Blob (REST API)