Get started with Azure Blob Storage and JavaScript or TypeScript

Article
11/25/2024

This article shows you how to connect to Azure Blob Storage by using the Azure Blob Storage client library for JavaScript. Once connected, use the developer guides to learn how your code can operate on containers, blobs, and features of the Blob Storage service.

If you're looking to start with a complete example, see the client library quickstart for JavaScript or TypeScript.

API reference | Package (npm) | Library source code | Samples

Prerequisites

Azure subscription - create one for trial
Azure storage account - create a storage account
Node.js LTS
TypeScript, if applicable
For client (browser) applications, you need bundling tools.

Set up your project

This section walks you through preparing a project to work with the Azure Blob Storage client library for JavaScript.

Open a command prompt and navigate to your project folder. Change <project-directory> to your folder name:

cd <project-directory>

If you don't have a package.json file already in your directory, initialize the project to create the file:

npm init -y

From your project directory, install packages for the Azure Blob Storage and Azure Identity client libraries using the npm install or yarn add commands. The @azure/identity package is needed for passwordless connections to Azure services.

JavaScript
TypeScript

npm install @azure/storage-blob @azure/identity

npm install typescript @azure/storage-blob @azure/identity

Authorize access and connect to Blob Storage

To connect an app to Blob Storage, create an instance of the BlobServiceClient class. This object is your starting point to interact with data resources at the storage account level. You can use it to operate on the storage account and its containers. You can also use the service client to create container clients or blob clients, depending on the resource you need to work with.

To learn more about creating and managing client objects, including best practices, see Create and manage client objects that interact with data resources.

You can authorize a BlobServiceClient object by using a Microsoft Entra authorization token, an account access key, or a shared access signature (SAS). For optimal security, Azure recommends using Microsoft Entra ID with managed identities to authorize requests against blob data. For more information, see Authorize access to blobs using Microsoft Entra ID.

To authorize with Microsoft Entra ID, you need to use a security principal. Which type of security principal you need depends on where your app runs. Use the following table as a guide:

Where the app runs	Security principal	Guidance
Local machine (developing and testing)	Service principal	To learn how to register the app, set up a Microsoft Entra group, assign roles, and configure environment variables, see Authorize access using developer service principals
Local machine (developing and testing)	User identity	To learn how to set up a Microsoft Entra group, assign roles, and sign in to Azure, see Authorize access using developer credentials
Hosted in Azure	Managed identity	To learn how to enable managed identity and assign roles, see Authorize access from Azure-hosted apps using a managed identity
Hosted outside of Azure (for example, on-premises apps)	Service principal	To learn how to register the app, assign roles, and configure environment variables, see Authorize access from on-premises apps using an application service principal

Authorize access using DefaultAzureCredential

An easy and secure way to authorize access and connect to Blob Storage is to obtain an OAuth token by creating a DefaultAzureCredential instance. You can then use that credential to create a BlobServiceClient object.

The following example creates a BlobServiceClient object using DefaultAzureCredential:

const accountName = "<account-name>";
const accountURL = `https://${accountName}.blob.core.chinacloudapi.cn`;
const blobServiceClient = new BlobServiceClient(
  accountURL,
  new DefaultAzureCredential()
);

This code example can be used for JavaScript or TypeScript projects.

To use a shared access signature (SAS) token, append the token to the account URL string separated by a ? delimiter. Then, create a BlobServiceClient object with the URL.

const accountName = "<account-name>";
const sasToken = "<sas-token>";
const accountURL = `https://${accountName}.blob.core.chinacloudapi.cn?${sasToken}`;
const blobServiceClient = new BlobServiceClient(accountURL);

This code example can be used for JavaScript or TypeScript projects.

To learn more about generating and managing SAS tokens, see the following articles:

Note

For scenarios where shared access signatures (SAS) are used, Azure recommends using a user delegation SAS. A user delegation SAS is secured with Microsoft Entra credentials instead of the account key.

To use a storage account shared key, provide the key as a string and initialize a BlobServiceClient object.

const credential = new StorageSharedKeyCredential(accountName, accountKey);
const blobServiceClient = new BlobServiceClient(
  `https://${accountName}.blob.core.chinacloudapi.cn`,
  credential
);

This code example can be used for JavaScript or TypeScript projects.

You can also create a BlobServiceClient object using a connection string.

const blobServiceClient = BlobServiceClient.fromConnectionString(connectionString);

For information about how to obtain account keys and best practice guidelines for properly managing and safeguarding your keys, see Manage storage account access keys.

Important

The account access key should be used with caution. If your account access key is lost or accidentally placed in an insecure location, your service may become vulnerable. Anyone who has the access key is able to authorize requests against the storage account, and effectively has access to all the data. DefaultAzureCredential provides enhanced security features and benefits and is the recommended approach for managing authorization to Azure services.

Build your app

As you build apps to work with data resources in Azure Blob Storage, your code primarily interacts with three resource types: storage accounts, containers, and blobs. To learn more about these resource types, how they relate to one another, and how apps interact with resources, see Understand how apps interact with Blob Storage data resources.

The following guides show you how to access data and perform specific actions using the Azure Storage client library for JavaScript:

Guide	Description
Configure a retry policy	Implement retry policies for client operations.
Copy blobs	Copy a blob from one location to another.
Create a container	Create blob containers.
Create a user delegation SAS	Create a user delegation SAS for a container or blob.
Create and manage blob leases	Establish and manage a lock on a blob.
Create and manage container leases	Establish and manage a lock on a container.
Delete and restore	Delete blobs and restore soft-deleted blobs.
Delete and restore containers	Delete containers and restore soft-deleted containers.
Download blobs	Download blobs by using strings, streams, and file paths.
Find blobs using tags	Set and retrieve tags, and use tags to find blobs.
List blobs	List blobs in different ways.
List containers	List containers in an account and the various options available to customize a listing.
Manage properties and metadata (blobs)	Get and set properties and metadata for blobs.
Manage properties and metadata (containers)	Get and set properties and metadata for containers.
Performance tuning for data transfers	Optimize performance for data transfer operations.
Set or change a blob's access tier	Set or change the access tier for a block blob.
Upload blobs	Learn how to upload blobs by using strings, streams, file paths, and other methods.

Get started with Azure Blob Storage and JavaScript or TypeScript

Prerequisites

Set up your project

Authorize access and connect to Blob Storage

Authorize access using DefaultAzureCredential

Build your app

Additional resources