Question

我一直关注this article，使我可以直接将文件上传到Azure Blob存储。但我目前收到错误消息

“ 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 {}

GitHub中的AppModule

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']，并且返回未定义。

有人可以告诉我我做错了什么吗？

编辑：

在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"
            ]
          },
   ...
}

Answer 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
    }
  ...

上载到Azure Blob存储-this.blobStorage.createBlobServiceWithSas不是函数

1 个答案: