打开第二个查看器时 AutoDesk Forge 查看器 API 引发错误

Posted 2023-03-16

【中文标题】打开第二个查看器时 AutoDesk Forge 查看器 API 引发错误

【英文标题】：AutoDesk Forge Viewer API Throwing error when opening a second viewer

【发布时间】：2022-01-03 09:32:26

【问题描述】：

我的查看器在我的 Web 应用程序中的集成方式存在问题。在运行我的查看器的第一个实例中，我没有遇到任何问题。看，我的应用程序的每个页面上都有许多不同的查看器。但是，当我想打开第二个查看器时，我会得到标准控制台日志...

“三.WebGLRenderer 71 WebGLRenderer.js:29:12 WEBGL_debug_renderer_info 在 Firefox 中已弃用并将被删除。请使用渲染器。 WebGLRenderer.js:232:30 WebGL 渲染器：角度（Intel(R) HD Graphics 400 Direct3D11 vs_5_0 ps_5_0，D3D11-27.20.100.8854）WebGLRenderer.js:237:20 WebGL 供应商：Google Inc. (Intel)"

... 后面跟着错误：

Rendering to a canvas that was resized to zero. If you see this message you may be accidentally leaking a viewer instance. ErrorCode:14. Logger.js:188:18
_reportError Logger.js:188
beginScene RenderContext.js:607
initialize Viewer3DImpl.js:368
initialize Viewer3D.js:608
initialize GuiViewer3D.js:59
start Viewer3D.js:374
showViewer showViewer.js:72
(Async: promise callback)
K envinit.js:718
showViewer showViewer.js:68
updateStatus showViewer.js:11
getStatus showViewer.js:48
i x12:2
fireWith x12:2
A x12:4
c x12:4
(Async: EventHandlerNonNull)
send x12:4
ajax x12:4
ajax xtrue:4
getStatus showViewer.js:37
showViewer showViewer.js:97
anonymous Autodesk-Forge-Viewer--testing--update--Forge-Viewer-.js:89
v x12:6
B x12:6
v x12:6
run_without_catching_not_ready x12:6
v x12:6
value x12:6
r x12:6
value x12:6
n x12:6
n x12:6
traceSpan x12:6
n x12:6
(Async: setTimeout handler)
exports x12:13
R x12:6
value x12:6
value x12:6
value x12:6
value x12:6
value x12:6
initialize x12:6
value x12:6
autorun_top x12:6
value x12:6
run x12:6
value x12:6
value x12:6
value x12:6
value x12:6
value x12:6
run_once x12:6
run x12:6
value x12:6
value x12:6
value x12:6
value x12:6
value x12:6
value x12:6
value x12:6
exports x12:6
value x12:6
value x12:6

有人知道为什么会这样吗？起初我以为“......不小心泄露了查看器......”错误意味着 html 元素没有关闭，但事实并非如此。我很茫然，我不确定问题是什么。这是我的查看器代码：

    function showViewer()
    let viewer;
    let options = 
        env: 'AutodeskProduction',
        api: 'derivativeV2',
        getAccessToken: function(onTokenReady) 
            var token = viewerAccessToken;
            var timeInSeconds = 3600;
            onTokenReady(token, timeInSeconds);
        
    ;
    Autodesk.Viewing.Initializer(options, () => 
        let htmlDiv = document.getElementById('forgeViewer');
        viewer = new Autodesk.Viewing.GuiViewer3D(htmlDiv);
        instance.data.viewer = viewer;
        let startedCode = viewer.start();
        viewer.setTheme("light-theme");
        viewer.loadExtension("Autodesk.CustomDocumentBrowser").then(() => 
            viewer.loadExtension("Autodesk.Viewing.MarkupsCore");
            viewer.loadExtension("Autodesk.Viewing.MarkupsGui");
        );
        if (startedCode > 0) 
            console.error('Failed to create a Viewer: WebGL not supported.');
            $("#loadingStatus").html("Failed to create a Viewer: WebGL not supported.");
            return;
        
        console.log('Initialization complete, loading a model next...');
    );
    let documentId = `urn:` + viewerUrn;
    let derivativeId = `urn:` + instance.derivativeUrn;
    Autodesk.Viewing.Document.load(documentId, onDocumentLoadSuccess, onDocumentLoadFailure);
    function onDocumentLoadSuccess(viewerDocument) 
        let defaultModel = viewerDocument.getRoot().getDefaultGeometry();
        viewer.loadDocumentNode(viewerDocument, defaultModel);
    
    function onDocumentLoadFailure() 
        console.error('Failed fetching Forge manifest');
        $("#loadingStatus").html("Failed fetching Forge manifest.");
    

【参考方案1】：

这个问题通常是由 CSS 布局引起的。当您尝试在宽度和高度为零或将display 设置为none 的<div> 中实例化查看器时，查看器将无法初始化其WebGL 渲染管道。

这是一个简单的 Forge 应用程序，它在一个页面上初始化两个查看器：https://github.com/petrbroz/forge-simple-viewer-nodejs/tree/sample/multiple-viewers（请注意，代码位于名为 sample/multiple-viewers 的分支中）。

【讨论】：

谢谢！结果是样式问题和我需要引入逻辑以使每个新查看者都有不同的 ID 的事实（你看，可能有几十个查看者取决于你在哪个页面上...... ) 但是由于某种原因，文档浏览器仅适用于第一个查看器（但如果您不使用第一个文档浏览器，则第二个查看器将起作用）。我会继续解决这个问题：）谢谢

出于好奇，您是否知道是否可以将参数传递给扩展？例如，我的查看器附加了一个唯一的时间戳，我想将其传递给我的扩展程序“customDocumentBrowser”，以便它可以使用时间戳制作适当的 ID :) 非常感谢，你很有帮助，我很感激！

乐于助人 :) 看看我的博文forge.autodesk.com/blog/…。有一节介绍如何将选项传递给扩展。

嘿，我在访问扩展程序中的对象时遇到问题。我越来越不确定。关于扩展构造函数我有什么需要了解的吗？

选项由查看器作为构造函数的第二个参数传递给扩展。第一个参数是查看器本身的实例。