时间戳

首页 > 解决方案 > tf.browser.fromPixels() 不起作用，因为“DOM 尚未准备好”

javascript - tf.browser.fromPixels() 不起作用，因为“DOM 尚未准备好”

问题描述

我正在尝试使用 TensorFlow.js 的tf.browser.fromPixels()功能。不幸的是，我收到以下错误：

backend_webgl.ts:309 Uncaught Error: The DOM is not ready yet. Please call tf.browser.fromPixels() once the DOM is ready. One way to do that is to add an event listener for `DOMContentLoaded` on the document object
    at e.fromPixels (backend_webgl.ts:309)
    at t.fromPixels (engine.ts:870)
    at fromPixels_ (browser.ts:55)
    at Object.fromPixels (operation.ts:45)
    at ex4.html:10

但我是tf.browser.fromPixels()从传递给的函数内部调用的window.addEventListener('DOMContentLoaded', ...)。知道为什么我会收到此错误以及如何使该fromPixels功能正常工作吗？

<html>
<head>
    <script src="https://cdn.jsdelivr.net/npm/@tensorflow/tfjs@1.2.7/dist/tf.min.js"></script>
</head>
<body>
    <img id="test" src="https://jpeg.org/images/jpeg-home.jpg">
    <script>
        window.addEventListener('DOMContentLoaded', ev => {
            const img = document.getElementById('test')
            tf.browser.fromPixels(img).print()
        })
    </script>
</body>
</html>

标签： javascripttensorflowdom-eventstensorflow.jsdomcontentloaded

解决方案

        if (document.readyState !== 'complete') {
          throw new Error(
              'The DOM is not ready yet. Please call ' +
              'tf.browser.fromPixels() once the DOM is ready. One way to ' +
              'do that is to add an event listener for `DOMContentLoaded` ' +
              'on the document object');
        }

Github 张量流/tfjs

根据上面的代码，抛出错误是因为document.readyStateis not complete。

DOMContentLoaded 事件在初始 HTML 文档完全加载和解析后触发，无需等待样式表、图像和子框架完成加载。 https://developer.mozilla.org/en-US/docs/Web/API/Window/DOMContentLoaded_event

文档的 readyState 可以是以下之一：

loading
文档仍在加载中。

交互
文档已完成加载，文档已被解析，但图像、样式表和框架等子资源仍在加载。

完成
文档和所有子资源已完成加载。该状态指示加载事件即将触发。
https://developer.mozilla.org/en-US/docs/Web/API/Document/readyState

DOMContentLoaded在尚未加载任何子资源之前调用。所以在执行代码时，document.readyState仍然是interactive.

只需忽略错误所说的内容，然后尝试load事件侦听器。

推荐阅读