React Autodesk Forge 创建存储桶

Posted 2023-03-16

【中文标题】React Autodesk Forge 创建存储桶

【英文标题】：React Autodesk Forge Create Buckets

【发布时间】：2022-01-08 17:53:00

【问题描述】：

我正在尝试从反应应用程序的前端创建一个存储桶，一旦我解决了这个问题，我将通过后端发出请求。我在 useEffect 钩子内传递一个选项对象并将结果记录到控制台。标头在我从 .env 传入的环境变量上返回未定义。我想知道现在如何从 .env 或硬代码中传入标头？我还需要将范围传递到标题 bucket:create, bucket: read

Buckets.js

import React,  useEffect  from 'react'
import axios from 'axios'

const Buckets = () => 
useEffect(() => 
const options = 
  method: 'POST',
  url: 'https://developer.api.autodesk.com/authentication/v1/authenticate',
  headers: 
    ContentType: 'application/json',
    Authorization: process.env.REACT_APP_FORGE_ACCESS_TOKEN,
    client_id: process.env.REACT_APP_FORGE_CLIENT_ID,
    client_secret: process.env.REACT_APP_FORGE_CLIENT_SECRET,
  ,

console.log(options)
, [])

return <div>Buckets</div>

导出默认存储桶

【参考方案1】：

代码 sn-p 有几个问题：

首先，您应该永远将客户端密码暴露给浏览器；在服务器端实现存储桶创建非常简单 其次，您在代码中使用的process.env 构造是Node.js 功能，而不是浏览器中可用的功能；这很可能是标题最终为空的原因

因此，我只建议您在服务器端实现任何 Forge 请求（例如，通过关注 https://learnforge.autodesk.io），然后通过几个端点将该功能公开给您的 React 前端。

编辑：如 cmets 中所述，我正在开发“用于 Node.js 的非官方 Forge SDK”，并且该库确实为浏览器提供了实验性支持。试试这样的：

    <script src="https://cdn.jsdelivr.net/npm/forge-server-utils/dist/browser/forge-server-utils.js"></script>
    <script>
        const client = new forge.DataManagementClient( client_id: '...', client_secret: '...' );
        client.listBuckets()
            .then(buckets =>  console.log('Buckets', buckets); )
            .catch(err =>  console.error('Could not get buckets', err); );
    </script>

【讨论】：

AI 提到，一旦我完成这项工作，我将把客户端密码移到后端，根据 cra 文档，您可以声明环境变量 create-react-app.dev/docs/adding-custom-environment-variables。

抱歉，我按下了回车键。嗨 Petr， 如前所述，一旦我完成这项工作，我将把客户端密码移到后端，根据 cra 文档，您可以声明环境变量 create-react-app.dev/docs/adding-custom-environment-variables。无论如何，我能够从邮递员的后端获取请求，但现在我想从我的反应前端复制它。是否有任何示例说明如何实现这一点？有很多示例显示查看器，但没有显示存储桶或存储桶中的对象。

由于这不是一个好的做法（而且它是一个潜在的安全风险），我们并没有真正提供/推广实现这一点的示例。

我在我的“非官方 Forge SDK for Node.js”中有一个对浏览器的实验性支持：github.com/petrbroz/forge-server-utils#client-side-experimental。但是，假设您已经拥有通过其他方式生成的访问令牌。我不确定您是否能够通过传入客户端 ID 和密码来生成新令牌。在这种情况下，您可能会开始遇到其他问题，例如，CORS。