Question

开发具有以下结构的HTML应用程序：

<html>
<head>
    <!-- other head elements -->
    <script src="jquery.js?_v=3736f12"></script>
    <script src="error.js?_v=291bb66"></script>
</head>

<body>
    <!-- other body elements -->
    <script src="foundation.js?_v=880a16f"></script>
    <script src="my_lib.js?_v=1c3b21e"></script>
</body>
</html>

error.js所做的是它侦听window.onerror事件，当它被触发时，它会通过ajax向服务器发送错误消息，通知我们开发人员。通过这种方式，我们可以了解用户javascript何时投诉。

my_lib.js是一个非常大的库，它可以完成很多任务，它通常建立在Foundation框架和它们的javascript库之上，它们位于HTML结构中的my_lib.js之前。

现在我可以回答我的问题。这些天我们遇到类似的错误：

TypeError：window.Foundation未定义
TypeError：undefined不是对象（评估'window.Foundation.Abide'）
未捕获的TypeError：无法读取未定义的属性“Dropdown”（在代码Foundation.Dropdown中）

这些错误通常来自my_lib.js内部的基础全局Foundation和来自各种userAgent的使用，更常见的是来自移动设备，但不仅限于此。错误的时间通常在就绪事件之前或有时在就绪事件和加载事件之间。疯狂的是，这些错误并非总是来自同一个用户（即使他们在同一页面上两次），它们有时会出现，我们无法重现单个错误。

我很确定，我们永远不会明确地将Foundation设置为未定义，如果我们是，那么每个吹风机都会出现onload问题。

这让我怀疑在评估my_lib.js之前是否总是评估了foundation.js。从我在这里的帖子阅读SO我明白标签是按顺序评估的，并且正在等待彼此（我们从不使用异步或延迟）。

我能够从服务器日志中获得的另一个线索是，通常在用户在一段时间不活动后进入/重新加载我们的网站时会发生这些错误。例如，在长时间不活动后登录或刷新后仍然登录。

有没有人知道为什么要这样做？

非常感谢。

Answer 1

听起来像是一个经典的竞争条件，当你的代码被执行时，库可能会被加载，也可能不被加载，如果不是你的回复未定义。

要在执行任何依赖库的代码之前避免这种情况，请确保例如触发了此事件。

(document.readyState === 'complete') {
  // good to go!
}

为什么基金会全球有时未定义？

1 个答案: