Having trouble with DefaultAzureCredential in Azure

My current project involves utilizing Azure Storage, and to authenticate I am leveraging the DefaultAzureCredential. After logging in with the az login command, I encountered an error response when running my Azure function.

{ "message": "{"odata.error":{"code":"AuthorizationPermissionMismatch","message":{"lang":"en-US","value":"This request is not authorized to perform this operation using this permission.\nRequestId:1fedb6ef-3002-0070-7133-fc1d53000000\nTime:2023-10-11T11:09:48.2823331Z"}}}" }

Upon attempting to troubleshoot in the console:

const credential = new DefaultAzureCredential();

console.log(credential)

The output showed:

DefaultAzureCredential { [2023-10-11T11:17:18.644Z] UnavailableMessage: 'DefaultAzureCredential => failed to retrieve a token from the included credentials. To troubleshoot, visit  [https://aka.ms/azsdk/js/identity/defaultazurecredential/troubleshoot.'](https://aka.ms/azsdk/js/identity/defaultazurecredential/troubleshoot.%27), [2023-10-11T11:17:18.645Z] _sources: [

I am puzzled as to why tokens are not being retrieved from my CLI. Even after attempting to use AzureCliCredential, the issue persists.

If anyone has insights on how to address this problem, please share your solutions.

My setup includes a Macbook Air M1 2020 running OS Ventura 13.3.

Answer №1

After experimenting with DefaultAzureCredentials in my local VS Code and attempting to access a blob within my storage container using a typescript Azure function, I successfully managed to retrieve the Blob content as shown below:-

To achieve this, I granted myself the Storage Blob Data Contributor role at the Storage account level as illustrated below:-

This role is assigned at the subscription level and inherited, but it can also be added at the storage account resource level.

Snippet of my httpTrigger1.ts file:

import { app, HttpRequest, HttpResponseInit, InvocationContext } from "@azure/functions";
import { BlobServiceClient, ContainerClient } from "@azure/storage-blob";
import { DefaultAzureCredential } from "@azure/identity";

const containerName = "data"; // Replace with your container name
const blobName = "blob.txt"; // Replace with your blob name

export async function httpTrigger1(request: HttpRequest, context: InvocationContext): Promise<HttpResponseInit> {
    context.log(`Http function processed request for url "${request.url}"`);

    const name = request.query.get('name') || await request.text() || 'world';

    // Using DefaultAzureCredential for authentication
    const credential = new DefaultAzureCredential();

    // Initializing BlobServiceClient with DefaultAzureCredential
    const blobServiceClient = new BlobServiceClient("https://siliconrg54.blob.core.windows.net", credential);

    // Accessing a container
    const containerClient = blobServiceClient.getContainerClient(containerName);

    // Accessing a blob
    const blobClient = containerClient.getBlobClient(blobName);
    const blobContent = (await blobClient.download(0)).readableStreamBody;

    return { body: `Hello, ${name}! Blob Content: ${blobContent.toString()}` };
}

app.http('httpTrigger1', {
    methods: ['GET', 'POST'],
    authLevel: 'anonymous',
    handler: httpTrigger1
});
az login
az account set --subscription "Subscription-name"

Output:

In addition, I have successfully logged into my Account via the Vs code extension here:-

Reference:

Assign an Azure role for access to blob data - Azure Storage | Microsoft Learn

Similar questions

If you have not found the answer to your question or you are interested in this topic, then look at other similar questions below or use the search

The width of mat-table columns remains static even with the presence of an Input field

I'm currently working on an Angular component that serves the dual purpose of displaying data and receiving data. To achieve this, I created a mat-table with input form fields and used {{element.value}} for regular data display. Each column in the tab ...

Leveraging the power of JSON within a JavaScript object in an Azure HTTP trigger

const df = require("durable-functions"); module.exports = async function (context, req) { const client = df.getClient(context); context.log(`Function Name = '${req.params.functionName}'.`); context.log(`Body = '${ ...

What is the best approach for setting up a global pipe that can be utilized across various modules?

One of my Angular projects includes a custom pipe called CurrConvertPipe. import {Pipe, PipeTransform} from '@angular/core'; import {LocalStorageService} from './local-storage'; @Pipe({name: 'currConvert', pure: false}) expor ...

Associate the generic operator <T> with a FunctionConstructor

In my TS function, I deserialize JSON into a specific type/object by providing it with a constructor function of that type which reconstructs the object from JSON. Here is how it looks like: export function deserializeJSON<T>(JSONString: string, ty ...

What is the best way to inject Angular services into Tabulator JS?

I have been working on implementing a rowClick() function for a Tabulator table. This function is supposed to pass the row's data to a service. import { Component, AfterViewInit } from '@angular/core'; import { FuzeUser } from 'src/app/ ...

typescript logic description found

Currently, I am working on a React TypeScript project and have come across the following code: import { Trans, translate, InjectedTranslateProps } from 'react-i18next'; Following that, we have: export const Home: React.SFC<InjectedTranslate ...

Attempting to showcase information on the Angular frontend

When attempting to retrieve the Street name, I am seeing [object Object]. What is the optimal approach for displaying JSON data on the client side? I managed to display a street name but struggled with other components. How can I access the other elements ...

Incorporate the leaflet Draw feature into your Angular 2 application

I am a newcomer to Angular2, created using Cli. While I successfully imported Leaflet into my Angular2 project without any Angular2 directives, I am struggling to do the same with the Leaflet Draw extension. I haven't been able to make Draw work. In e ...

The 'provide' name in the app.module.ts file is not recognized by TypeScript, resulting in error code ts(2304)

Having an issue with declaring an interceptor in app.module.ts while using Angular 11 and Visual Studio Code IDE. https://i.sstatic.net/pbbau.png I attempted to resolve it by installing types: npm install @types/node --save-dev I also made modifications ...

Using TypeScript to retrieve a strongly typed promiseValue from an angular $modalInstanceA

New to TypeScript Question: I'm working on returning a strongly typed promise from angular's $modalInstance. Here is an example of what I have: this.$modal.open(options).result.then(result => { At the moment, 'result' is of typ ...

Converting a string[] to an EventEmitter string[] in Angular 4 with TypeScript: Step-by-step guide

Programming Language: Typescript – written as .ts files Development Framework: Angular 4 I'm currently working on an application that is supposed to add chips (similar to tags in Angular 1) whenever a user types something into the input box and hi ...

Having trouble with reloading or navigating directly to a dynamic route in Next JS?

Having an issue with NextJS - specifically with dynamic routes on a few pages: queries/[id].tsx queries/index.tsx During development, everything works fine when accessing: https://localhost:3006/queries/1324 The problem arises after building the project, ...

Using Typescript to iterate through an array of asynchronous functions

When working with nodejs/nest, I have a scenario where an object of functions is defined by keys. However, when looping through these functions, the async behavior seems to break down. Can you explain why functions called from serializationByService do not ...

Trouble with storing data in Angular Reactive Form

During my work on a project involving reactive forms, I encountered an issue with form submission. I had implemented a 'Submit' button that should submit the form upon clicking. Additionally, there was an anchor tag that, when clicked, added new ...

Error message: Unable to connect to Windows Azure server due to unavailable RPC Server

Our team is currently working on the Windows Azure platform. Everything runs smoothly when we test the application from Visual Studio. However, once we deploy it to Windows Azure and attempt to run it from the designated URL, we encounter an issue with RPC ...

Tips for integrating TypeScript with Vue.js and Single File Components

After extensive searching online, I have struggled to find a straightforward and up-to-date example of setting up Vue.js with TypeScript. The typical tutorials out there either are outdated or rely on specific configurations that don't apply universal ...

What is the method for removing an item from my TypeScript to-do list?

I am fairly new to TypeScript and I'm currently facing some challenges in deleting an item from my to-do list. I could use some guidance on how to go about implementing this feature. I have created a deleteHandler function that needs to be integrated ...

Dynamic importing fails to locate file without .js extension

I created a small TS app recently. Inside the project, there is a file named en.js with the following content: export default { name: "test" } However, when I attempt to import it, the import does not work as expected: await import("./e ...

TS2304: Unable to locate variable '_ZonePrivate'

I'm facing an issue while testing my angular 9 application. When I try to run it using ng serve, it seems to be running fine, but I encounter the error message Cannot GET / when attempting to display the page. The same error persists when I build it w ...