热插拔3d框架

Question

我正在做的AR项目要求我在.hcap体积视频场景和交互式游戏场景之间来回转换几次。我正在使用第8面墙/ three.js (HoloVideoObject)作为.hcap场景，并希望使用Playcanvas作为游戏场景。我需要在同一个网页上交换场景的原因是，客户端不希望用户多次请求相机许可。在将html/js注入主体以交换场景之前，我首先调用此清理函数：

const cleanUpScene = (scene) => {
  switch(scene) {
    case SceneType.HCAP:
      XR8.stop()
      const {scene, camera, renderer} = XR8.Threejs.xrScene()
      renderer.xr.dispose()
      renderer.dispose()
      XR8.clearCameraPipelineModules()

      $('#camerafeed').remove()
      break

    case SceneType.Game:
      XR8.PlayCanvas.stopXr()
      pc.app.destroy()
      XR8.clearCameraPipelineModules()

      $('#application-canvas').remove()
      $('#camerafeed').remove()
      break

    default:
      break;
  }
}

我能够成功地交换场景，但在多次交换之后，我得到了以下错误消息：

> There are too many active WebGL contexts on this page, the oldest context will be lost.
...
> TypeError: null is not an object (evaluating 'A.TEXTURE_2D')

第二个错误发生在第一个错误的几个实例之后。我看到一些帖子推荐在WebGLRenderingContext上调用loseContext()。我已经尝试添加了：

const cleanUpScene = (scene) => {
  switch(scene) {
    case SceneType.HCAP:
      ...
      renderer.xr.dispose()
      renderer.getContext().getExtension('WEBGL_lose_context').loseContext()
      renderer.dispose()
      ...
      break

    case SceneType.Game:
      ...
      XR8.PlayCanvas.stopXr()
      pc.app.graphicsDevice.gl.getExtension('WEBGL_lose_context').loseContext()
      pc.app.destroy()
      ...
      break

    default:
      break;
  }
}

在几次交换之后，添加这将导致在上面列出的两个之间出现一条新的错误消息：

> WebGL: INVALID_OPERATION: loseContext: context already lost

我的猜测是，尽管画布元素已被销毁，但仍有一些内容保留了对WebGLRenderingContext的引用。

有没有人对发生了什么以及如何解决这个问题有什么想法？感谢您阅读本文，并提前感谢您的任何建议。

Answer 1

不幸的是，对于我的用例，唯一有效的解决方案是完全销毁web gl上下文和关联的3d框架的应用程序实例。上面的“上下文已经丢失”错误已经在第8墙的v16.1.4.1227版本中打了补丁。