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

时间:2017-10-24 19:27:22

标签: javascript html css esp8266

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

有没有办法在html页面上(有或没有JavaScript),首先尝试从CDN获取引导程序,如果我们没有网络访问权限,请在ESP上获取镜像?

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

有人对如何做到这一点有任何建议吗?

1 个答案:

答案 0 :(得分:2)

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

编辑添加解释:

首先,没有简单的方法来检测链接元素是否已完成加载css文件或是否失败。所以,最简单的方法就是按照我的提法做,你做XHR,如果文件成功加载,那么你有网络访问权限,否则就没有。加载2次没有问题,一个来自XHR,另一个来自链接标记,因为,如果您的脚本首先加载它,那么它将被缓存为链接标记,如果链接标记首先加载它,那么它将被缓存为XHR。一切都很好。

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