reactjs - SharedKeyCredential 不是构造函数。 Azure存储 react 应用程序

Question

我正在尝试使用以下代码将 block blob上传到react应用程序中的Azure存储。但是，我收到以下错误。

TypeError: SharedKeyCredential is not a constructor

有什么想法吗？

@azure/[email protected]

import React from 'react';

const {
  Aborter,
  BlobURL,
  BlockBlobURL,
  ContainerURL,
  ServiceURL,
  StorageURL,
  SharedKeyCredential,
  AnonymousCredential,
  TokenCredential
} = require("@azure/storage-blob"); // Change to "@azure/storage-blob" in your package

function App() {
  return (
    <div className="App">

      <button onClick={onClicked()} />

    </div>
  );

  async function onClicked() {

    // Enter your storage account name and shared key
    const account = "REMOVED_MY_ACCOUNT";
    const accountKey = "REMOVED_ACCOUNT_KEY";

    // Use SharedKeyCredential with storage account and account key
    const sharedKeyCredential = new SharedKeyCredential(account, accountKey);

    // Use TokenCredential with OAuth token
    const tokenCredential = new TokenCredential("token");
    tokenCredential.token = "renewedToken"; // Renew the token by updating token field of token credential

    // Use AnonymousCredential when url already includes a SAS signature
    const anonymousCredential = new AnonymousCredential();

    // Use sharedKeyCredential, tokenCredential or anonymousCredential to create a pipeline
    const pipeline = StorageURL.newPipeline(sharedKeyCredential);

    // List containers
    const serviceURL = new ServiceURL(
      // When using AnonymousCredential, following url should include a valid SAS or support public access
      `https://${account}.blob.core.windows.net`,
      pipeline
    );

    // Create a container
    const containerName = `newcontainer${new Date().getTime()}`;
    const containerURL = ContainerURL.fromServiceURL(serviceURL, containerName);

    const createContainerResponse = await containerURL.create(Aborter.none);
    console.log(
      `Create container ${containerName} successfully`,
      createContainerResponse.requestId
    );

    // Create a blob
    const content = "hello";
    const blobName = "newblob" + new Date().getTime();
    const blobURL = BlobURL.fromContainerURL(containerURL, blobName);
    const blockBlobURL = BlockBlobURL.fromBlobURL(blobURL);
    const uploadBlobResponse = await blockBlobURL.upload(
      Aborter.none,
      content,
      content.length
    );
    console.log(
      `Upload block blob ${blobName} successfully`,
      uploadBlobResponse.requestId
    );

  }
}

export default App;

编辑:我调用了错误的 API。您可以创建一个使用 .Net/React 模板的新 Visual Studio 项目。这是我正在寻找的代码示例。

Answer 1

我是存储JS SDK的开发者。 SharedKeyCredential 仅在 Node.js 运行时可用。对于浏览器，出于安全考虑，请使用共享访问签名 (SAS) 或 OAuth token 进行身份验证。