我如何尝试从 CDN 加载脚本并回退到镜像?

How can I attempt to load a script from a CDN and fall back to a mirror?

我正在 ESP8266 上设置一个简单的网络应用程序。它就像一个魅力。对于 UI,我使用的是 Bootstrap,这是一个相当大的框架。这意味着它在提供 css 文件时有点慢,因为存储不是那么快。

有什么方法可以在 html 页面上(有或没有 JavaScript),首先尝试从 CDN 获取 bootstrap,如果我们没有网络访问,在 ESP 上获取镜像?

我不知道从哪里开始。我还认为使用 JavaScript 很难做到这一点,因为这将在 DOM 准备好之后完成。所以在加载后添加样式表,这行不通吗?

有人对此有何建议吗?

使用 https://developer.mozilla.org/en-US/docs/Web/API/XMLHttpRequest 请求 css 文件。如果无法加载,请将页面重新加载到不使用任何外部资源的新页面。

编辑添加解释:

首先,没有简单的方法可以检测 link 元素是否已完成加载 css 文件或失败。因此,对于您的情况,最简单的方法是按照我提到的那样进行,您执行 XHR,如果文件成功加载,则您可以访问网络,否则您没有。加载 2 次没有问题,一次来自 XHR,另一次来自 link 标签,因为,如果您的脚本首先加载它,那么它将被缓存用于 link 标签,如果link 标记首先加载它,然后它将被缓存用于 XHR。一切都很好。

在此之后,如果加载失败,您可能希望从其他位置加载它。动态加载 css 是可能的,但我认为最简单的解决方案是加载不同的页面。这样,即使您将来添加更多资源、更多 css 文件或一些外部库,您将始终拥有页面的 2 个版本,本地版本和网络版本,并且无需对网络不可用系统。