Загрузка в хранилище больших двоичных объектов azure — this.blobStorage.createBlobServiceWithSas не является функцией

#angular #azure-blob-storage #angular7

#angular #azure-blob-хранилище #angular7

Вопрос:

Я следил за этой статьей, чтобы разрешить мне загружать файл непосредственно в хранилище больших двоичных объектов Azure. Но в данный момент я получаю сообщение об ошибке

«this.blobStorage.createBlobServiceWithSas не является функцией»

Убедившись, что я не пропустил ни одной инструкции, я просмотрел исходный код для руководства на GitHub, я увидел разницу

AppModule.ts в учебном пособии

 declare var AzureStorage: IAzureStorage;

@NgModule({
  declarations: [AppComponent],
  imports: [BrowserModule],
  providers: [
    BlobStorageService,
    {
      provide: BLOB_STORAGE_TOKEN,
      useValue: AzureStorage.Blob
    }
  ],
  bootstrap: [AppComponent]
})
export class AppModule {}
  

AppModule в GitHub

 export function azureBlobStorageFactory(): IBlobStorage {
  return window['AzureStorage'].Blob;
}

@NgModule({
  declarations: [AppComponent],
  imports: [BrowserModule],
  providers: [
    BlobStorageService,
    {
      provide: BLOB_STORAGE_TOKEN,
      useFactory: azureBlobStorageFactory
    }
  ],
  bootstrap: [AppComponent]
})
export class AppModule {}
  

Я соответствующим образом обновил свой код, но по-прежнему безуспешно.

Затем я добавил точку останова, чтобы остановить выполнение перед this.blobStorage .createBlobServiceWithSas вызовом. На этом этапе я запускаю window['AzureStorage'] в консоли, и это возвращает значение undefined.

Может кто-нибудь, пожалуйста, посоветовать мне, что я делаю неправильно?

Редактировать:

В angular.json я добавил требуемый файл. Итак, если я запускаю window['AzureStorage'].Blob в консоли, я получаю объект, который я могу использовать, но я по-прежнему получаю ту же ошибку, что и ранее в моей базе кода

 {
  ...
  "projects": {
    "Client": {
      ...
      "architect": {
        "build": {
          "builder": "@angular-devkit/build-angular:browser",
          "options": {
            ...
            "scripts": [
              "src/assets/azure-storage/azure-storage.blob.js"
            ]
          },
   ...
}
  

Ответ №1:

Моя первая проблема заключалась в том, что я не обновил, angular.json чтобы включить azure-storage.blob.js скрипт (я обновил это в вопросе после внесения этого изменения). Мне также нужно было изменить способ заполнения службы app.module.ts, как показано ниже:

из этого

 export function azureBlobStorageFactory(): IBlobStorage {
  return window['AzureStorage'].Blob;
}

@NgModule({
  ...
  providers: [
    AzureBlobStorageService,
    {
      provide: BLOB_STORAGE_TOKEN,
      useValue: azureBlobStorageFactory()
    }
  ...
  

к этому

 @NgModule({
  ...
  providers: [
    AzureBlobStorageService,
    {
      provide: BLOB_STORAGE_TOKEN,
      useValue: window['AzureStorage'].Blob
    }
  ...