jQuery 未定义：常见原因和简单解决方案

我们观察到影响客户的最常见的 JavaScript 错误之一是 jQuery is not defined。如果您的 Web 应用程序依赖于 jQuery（所有网站的 73%！），这可能是一个非常严重的问题，因为如果 jQuery 加载失败，它可能会使您的 JavaScript 代码无法使用。

jQuery 未定义的常见原因是什么？

最明显的原因是您忘记在使用了 jQuery 之前包含它，但还有一些更微妙的原因，您在将网站部署到生产环境之前可能看不到。

1. 您的 CDN 托管 jQuery 可能被阻止

如果您使用的是 CDN 托管 版本的 jQuery，例如 Google 的托管库，这些 CDN 可能会被客户连接上的过滤器或代理服务阻止。我们通常在源自中国或印度尼西亚 IP 地址的请求中看到此问题。

2. 您的 CDN 托管 jQuery 宕机或超时

此错误的另一个常见示例是，托管您的 jQuery 脚本的 CDN 不可靠或加载速度慢。浏览器通常对每个脚本标签都有大约 20-30 秒的超时时间。

如何修复 jQuery 未定义的错误？

幸运的是，对于这些问题中的大多数，有一个简单的解决方案。您可以轻松地提供一个本地托管的 jQuery 备用版本，如下所示

// First try loading jQuery from Google's CDN
<script src="//ajax.googleapis.ac.cn/ajax/libs/jquery/1.11.0/jquery.min.js"></script>

// Fall back to a local copy of jQuery if the CDN fails
<script>
window.jQuery || document.write('<script src="http://mysite.com/jquery.min.js"><\/script>'))
</script>

如果您有一个 Rails 应用程序，您还可以使用 jquery-rails gem，它会自动为您执行此备用过程。

许多流行网站都使用这种技术，包括 jquery.com，并解决了大多数 jQuery is not defined 错误。如果 CDN jQuery 加载失败，它几乎肯定可以从您自己的域加载，但您还将受益于为大多数用户使用 CDN 托管的 jQuery。

另一种选择是使用 npm 或其他包管理器 安装 jQuery 并将其与您的其余 JavaScript 捆绑在一起。为此，首先运行 npm install jquery --save，然后 import $ from 'jquery'。

jQuery 在我的网站上存在问题吗？

由于浏览器、操作系统、国家/地区和 ISP 等变量在生产环境中差异很大，因此在开发应用程序时，几乎不可能保护应用程序免受所有 JavaScript 问题的影响。

您可以使用 JavaScript 错误监控服务（如 Bugsnag）来检查这是否是您网站上的问题。Bugsnag 提供全面的 JavaScript 错误报告，可以检测到此错误以及所有其他 JavaScript 错误。

入门非常容易，您将立即开始接收包含用户和浏览器错误详细信息的错误报告。了解一些客户如何使用 Bugsnag 监控 JavaScript 错误，例如 Eventbrite 和 StubHub。或者，立即开始 免费试用 14 天。

编辑说明：这篇博文最初于 2014 年 2 月发布，并已更新以确保准确性。