CDN 怎么引入 callback

Question

最近用的 cdn 老是出错，先是 bootcss 直接挂了，换成 unpkg 之后发现某些时刻需要挂 vpn 才能访问，可否引入两套 cdn , 一套引入失败后再引入另外一套。
本来想用 link 和 script 的 onerror 方法，但是发现在 js 中插入的 link 的 onerror 方法好像不会执行。

const cssCdns = [
    {
      key: 'element',
      // link1: 'https://unpkg.com/element-ui/lib/theme-chalk/index.css',
      link1: 'https://ttt',
      link2: 'https://cdn.staticfile.org/element-ui/2.4.7/theme-chalk/index.css'
    },
    {
      key: 'iview',
      link1: 'https://unpkg.com/iview/dist/styles/iview.css',
      link2: 'https://cdn.staticfile.org/iview/3.0.1/styles/iview.css',
    },
    {
      key: 'highlight',
      link1: 'https://unpkg.com/highlight.js/styles/solarized-light.css',
      link2: 'https://cdn.staticfile.org/highlight.js/9.12.0/styles/solarized-light.min.css',
    },
  ],
  jsCdns = [
    {
      link1: 'https://unpkg.com/vue/dist/vue.min.js',
      link2: 'https://cdn.staticfile.org/vue/2.5.17/vue.min.js'
    },
    {
      link1: 'https://unpkg.com/vue-router@3.0.1/dist/vue-router.min.js',
      link2: 'https://cdn.staticfile.org/vue-router/3.0.1/vue-router.min.js'
    },
    {
      link1: 'https://unpkg.com/vuex@2.2.1/dist/vuex.min.js',
      link2: 'https://cdn.staticfile.org/vuex/3.0.1/vuex.min.js'
    },
    {
      link1: 'https://unpkg.com/iview/dist/iview.min.js',
      link2: 'https://cdn.staticfile.org/iview/3.0.1/iview.min.js'
    },
    {
      link1: 'https://unpkg.com/element-ui/lib/index.js',
      link2: 'https://cdn.staticfile.org/element-ui/2.4.7/index.js'
    },
    {
      link1: 'https://unpkg.com/highlight.js@9.12.0/lib/highlight.js',
      link2: 'https://cdn.staticfile.org/highlight.js/9.12.0/highlight.min.js'
    },
  ]
  let css=document.createElement('link');
  cssCdns.forEach(item => {
    css.setAttribute('rel', 'stylesheet');
    css.setAttribute('type', 'text/css');
    css.setAttribute('href', item.link1);
    css.setAttribute('key', item.key);
    // css.setAttribute("onload","cssLoadOK('"+url+"')");
    css.setAttribute('onerror', 'cssLoadError()');
    document.head.appendChild(css);
  })
  function cssLoadError () {
    debugger;
    console.log('error');
  }

不过在head中直接引入 link 标签的话 onerror 方法是会执行的=。=
link 直接引入失败 status 显示 failed , 但是在 js 中循环插入失败 status 是 canceled。js 中要是不用 forEach 而是直接插入一个也是 failed。应该是这个问题。不过怎么解决还在探索=。=

Answer 1

将 let css = document.createElement('link');放到 forEach 中即可。
这样可以解决 css 的问题，但是 js 的 cdn onerror 好像不能用这个方法=。= 因为我是放在 vue-cli 中使用的，虽然执行了 onerror 方法，但是无法确保新的 cdn 在界面载入之前加载完成。所以 js 代码会报错，我再找找=。=

更新：

<script>window.Vue || document.write('<script src="./static/js/vue.js"><\/script>')</script>