Как я могу получить доступ к Azure хранилищу BLOB-объектов, используя JS в браузере

Question

Я пытаюсь получить доступ к Azure хранилищу BLOB-объектов в веб-приложении (Vue).
Однако я получаю следующую ошибку:

catch: Строка подключения к учетной записи поддерживается только в Node.js среде

Как получить доступ к Azure хранилищу BLOB-объектов?
Я исследовал, но не был уверен, в чем причина.
Может кто-нибудь подсказать, пожалуйста ?

---

код. vue

const { BlobServiceClient } = require("@azure/storage-blob");

mounted: function () {
  this.init()
},
methods: {
  init: function () {
    this.accessBlob()
        .then(() => console.log('Done'))
        .catch((ex) => console.log('catch:', ex.message));
    },
  accessBlob: async function(){
      const config = require("./config/config.json");
      const AZURE_STORAGE_CONNECTION_STRING = config.storageAccountOrConnectionString;

      const blobServiceClient = await BlobServiceClient.fromConnectionString(AZURE_STORAGE_CONNECTION_STRING);
      console.log(blobServiceClient);
    }
  }

Answer 1

Согласно официальному документу , при использовании метода BlobServiceClient.fromConnectionString для подключения блоба Azure строка подключения к учетной записи может использоваться только во время выполнения NODE.JS .

Поэтому я предлагаю нам использовать хранилище BLOB-объектов sas token connect Azure. Например

1. Создать токен sas (я использую sdk crypto-js для его создания)

import * as CryptoJS from 'crypto-js';

 const accountName =environment.accountName;
  const key=environment.key;
  const start = new Date(new Date().getTime() - (15 * 60 * 1000));
  const end = new Date(new Date().getTime() + (30 * 60 * 1000));
const signedpermissions = 'rwdlac';
  const signedservice = 'b';
  const signedresourcetype = 'sco';
  const signedexpiry = end.toISOString().substring(0, end.toISOString().lastIndexOf('.')) + 'Z';
  const signedProtocol = 'https';
  const signedversion = '2018-03-28';

  const StringToSign =
      accountName+ '\n' +
      signedpermissions + '\n' +
      signedservice + '\n' +
      signedresourcetype + '\n' +
       '\n' +
      signedexpiry + '\n' +
       '\n' +
      signedProtocol + '\n' +
signedversion + '\n';

 var str =CryptoJS.HmacSHA256(StringToSign,CryptoJS.enc.Base64.parse(key));
 var sig = CryptoJS.enc.Base64.stringify(str);


  const sasToken =`sv=${(signedversion)}&ss=${(signedservice)}&srt=${(signedresourcetype)}&sp=${(signedpermissions)}&se=${encodeURIComponent(signedexpiry)}&spr=${(signedProtocol)}&sig=${encodeURIComponent(sig)}`;

Соединение Azure Blob

import {
BlobServiceClient
  AnonymousCredential,
  newPipeline
} from "@azure/storage-blob";



const pipeline = newPipeline(new AnonymousCredential());
 const blobServiceClient =new BlobServiceClient(`https://${accountname}.blob.core.windows.net?${sasToken}`,
                                                             pipeline  )