BlobServiceClient cannot connect by connection string, Buffer is not defined

Issue

i want to use storage account in my react webpage. For that i am using BlobServiceClient.

When i am using SAS connection string

const blobServiceClient = BlobServiceClient.fromConnectionString("BlobEndpoint=...")

Everything works fine but when i want to switch for storage account connection string:

const blobServiceClient = BlobServiceClient.fromConnectionString("DefaultEndpointsProtocol=https;...")

my page stuck. My question is, why i can not use standard connection string in BlobServiceClient?

EDIT:

Error from console:

utils.common.ts:184 Uncaught (in promise) ReferenceError: Buffer is not defined
    at extractConnectionStringParts (utils.common.ts:184:22)
    at Function.fromConnectionString (BlobServiceClient.ts:386:28)
    at Component._fetchContainer (Component.tsx:107:53)
    at Component.componentDidMount (Component.tsx:46:20)
    at commitLifeCycles (react-dom.development.js:20663:24)
    at commitLayoutEffects (react-dom.development.js:23426:7)
    at HTMLUnknownElement.callCallback2 (react-dom.development.js:3945:14)
    at Object.invokeGuardedCallbackDev (react-dom.development.js:3994:16)
    at invokeGuardedCallback (react-dom.development.js:4056:31)
    at commitRootImpl (react-dom.development.js:23151:9)

Solution

The reason you are running into this error is because you are trying to connect to your Storage account from a JavaScript app (and not a Node app). Account connection string based connections are only allowed for Node apps.

From the documentation here:

Account connection string or a SAS connection string of an Azure
storage account. [ Note – Account connection string can only be used
in NODE.JS runtime.
]

Answered By – Gaurav Mantri

Answer Checked By – Katrina (AngularFixing Volunteer)

Leave a Reply

Your email address will not be published.