Autodesk Forge Dataviz NPM 包 - 尝试使用 React Viewer

Question

一段时间以来，我一直在尝试使用新的 Forge Dataviz NPM 软件包进行开发，但一直遇到错误。我目前正在尝试加载查看器 (https://forge.autodesk.com/en/docs/dataviz/v1/reference/UI/Viewer/)，但我认为我做错了什么。还是不知道是什么。

这是我的 React 常量：

const TestAutodesk= () => {
  return (
    <div>
      <Viewer
      env="AutodeskProduction"
        docUrn="URN STRING"
        getToken={async () => await fetch("https://developer.api.autodesk.com/authentication/v1/authenticate",requestOptions)
            .then((res) => res.json())
            .then((data) => data.access_token)}
      ></Viewer>
    </div>
  );
};

这些是 requestOptions：

myHeaders.append("Content-Type", "application/x-www-form-urlencoded");
var urlencoded = new URLSearchParams();
urlencoded.append("client_id", "ID");
urlencoded.append("client_secret", "SECRET");
urlencoded.append("grant_type", "client_credentials");

var requestOptions = {
  method: "POST",
  headers: myHeaders,
  body: urlencoded,
  redirect: "follow",
};

最终的应用程序不会将其用作身份验证，我将使用一个安全的后端端点，这只是为了尝试加载查看器并完成前端。这是我在控制台上遇到的错误：

我认为错误是调用 localhost:8080 但它应该调用 Autodesk 端点。对此有任何想法吗？ Api 参考/Dataviz 示例没有说明这一点。

Answer 1

<Viewer> React 组件非常简单 (https://github.com/Autodesk-Forge/forge-dataviz-iot-react-components/blob/main/client/components/Viewer.jsx)，它本身不应该向 localhost 发出任何请求。您是否可能在应用程序的其他地方提出这些请求？

关于getToken 的实现，我建议两件事：

• 直接从客户端代码发出这些请求不是一个好习惯。这样，有人可能会窃取您的 Forge 客户端 ID 和客户端密码。更好的方法是在您自己的后端实现一个自定义端点，该端点生成具有有限权限的令牌，对客户端隐藏凭据。
• 如果您需要向 https://developer.api.autodesk.com/authentication/v1/authenticate 发出原始请求，请注意它需要 4 个（不是 3 个）参数：client_id、client_secret、grant_type 和 scopes。