HTML src onerror 没有及时加载 fallback

HTML src onerror doesn't load fallback in time

我的 HTML 文件中有以下代码:

<script src="https://cdn.jsdelivr.net/npm/axios/dist/axios.min.js"
 onerror="this.onerror=null;this.src='../js/axios.min.js?v=0.26.1';"></script>

它应该做什么,如果主要来源 src(CDN)失败,它应该从我的服务器加载回退脚本 onerror,作为回退解决方案。

但是当我故意在第一个源中输入一个错字来测试它时,我的网页的内容部分不会加载,因为它无法加载脚本 (Axios),而我的整个页面都依赖于它。 但是在 F12 控制台中,我可以看到之后加载了正确的后备文件。

所以我猜会发生什么,是因为无法加载主要来源src,它加载了备用来源onerror,但“切换”需要一点时间,同时正在加载 HTML 的其他部分。所以它不会等到加载后备源文件。

如果是这样的话,我的问题是: 如果主要来源出错,如何让网站加载等到备用来源加载完毕? 因为没有这个脚本,我的网站根本无法运行,所以没有它继续加载是没有用的。

谢谢。

更新#1: 也许如果我同时添加两个(CDN 和自己的服务器)变体?

<script
src="https://cdn.jsdelivr.net/npm/axios/dist/axios.min.js"</script>
<script src="../js/axios.min.js?v=0.26.1"></script>

仅供参考:我必须在那里有 CDN 变体,我无法删除它。但如果加载失败,我需要一个后备解决方案。所以也许这是一个可以接受的解决方案。

你怎么看?有什么缺点吗?

谢谢。

我找到了可行的解决方案:

<script src="https://cdn.jsdelivr.net/npm/axios/dist/axios.min.js"></script>
<script>
  if (typeof axios == 'undefined') {
    document.write(unescape("%3Cscript src='../js/axios.min.js?v=0.26.1' type='text/javascript'%3E%3C/script%3E"));
  }
</script>

也许它对某些人也有用。

谢谢。