PHP项目集成Autodesk Viewer：步骤执行频次与入门方法求助

一、各步骤执行频率明确 #

• 创建存储桶：仅需执行一次。一个Autodesk账户可创建多个存储桶，针对你的需求，创建一个专属存储桶后，后续上传文件复用即可。
• 上传文件到存储桶：仅对每个新文件执行一次。已上传的文件无需重复操作。
• 转换为SVF格式：仅对每个新上传的文件执行一次。转换完成后Autodesk会保留SVF资源，后续直接调用渲染即可，不用重复转换。
• 获取授权码（Token）：每次加载Viewer前都要重新获取。Token默认有效期1小时，过期后无法加载模型，所以前端每次请求渲染时，后端都得生成新的Token。
• 浏览器渲染Viewer：用户每次打开查看页面时执行，属于前端常规渲染逻辑。

二、PHP 项目入门实现步骤 #

1. 前置准备 #

先在Autodesk开发者平台创建App，获取Client ID和Client Secret。

2. 后端（PHP）核心代码示例 #

（1）获取访问Token

<?php
$clientId = "你的Client ID";
$clientSecret = "你的Client Secret";

$url = "https://developer.api.autodesk.com/authentication/v1/authenticate";

$postData = [
    "client_id" => $clientId,
    "client_secret" => $clientSecret,
    "grant_type" => "client_credentials",
    "scope" => "data:read viewables:read"
];

$ch = curl_init();
curl_setopt($ch, CURLOPT_URL, $url);
curl_setopt($ch, CURLOPT_POST, true);
curl_setopt($ch, CURLOPT_POSTFIELDS, http_build_query($postData));
curl_setopt($ch, CURLOPT_RETURNTRANSFER, true);
curl_setopt($ch, CURLOPT_HTTPHEADER, [
    "Content-Type: application/x-www-form-urlencoded"
]);

$response = curl_exec($ch);
curl_close($ch);

$tokenData = json_decode($response, true);
$accessToken = $tokenData["access_token"];

echo json_encode(["access_token" => $accessToken]);
?>

（2）获取模型URN

上传并转换文件后，可通过Model Derivative API响应或Data Management API查询得到模型的URN（转换后的资源标识），拿到后即可给前端用于加载模型。

3. 前端核心代码（嵌入PHP页面） #

<!DOCTYPE html>
<html>
<head>
    <meta charset="utf-8">
    <title>Autodesk Viewer</title>
    <link rel="stylesheet" href="https://developer.api.autodesk.com/modelderivative/v2/viewers/7.*/style.min.css" type="text/css">
    <script src="https://developer.api.autodesk.com/modelderivative/v2/viewers/7.*/viewer3D.min.js"></script>
</head>
<body>
    <div id="forgeViewer" style="width: 100%; height: 800px;"></div>

    <script>
        fetch('get-token.php')
            .then(response => response.json())
            .then(data => {
                const accessToken = data.access_token;
                // 注意URN需要Base64编码并去掉末尾的=符号
                const urn = "你的模型URN";

                var options = {
                    env: 'AutodeskProduction',
                    accessToken: accessToken
                };

                Autodesk.Viewing.Initializer(options, function() {
                    var viewer = new Autodesk.Viewing.GuiViewer3D(document.getElementById('forgeViewer'));
                    viewer.start();
                    Autodesk.Viewing.Document.load('urn:' + urn, function(doc) {
                        var viewables = doc.getRoot().getDefaultGeometry();
                        viewer.loadDocumentNode(doc, viewables);
                    }, function(error) {
                        console.error('模型加载失败:', error);
                    });
                });
            })
            .catch(error => console.error('Token获取失败:', error));
    </script>
</body>
</html>

三、关键注意点 #

• URN编码：模型URN需做Base64编码，且要去掉编码后的末尾=符号才能正常使用。
• 权限范围：获取Token时的scope必须包含data:read和viewables:read，否则无法读取模型资源。
• 错误处理：实际开发中要补充完善的错误捕获逻辑，比如Token请求失败、模型加载超时等场景。

内容的提问来源于stack exchange，提问作者Mohammad Ali