问题描述
提示:
很无语的一个事情,前几天做的一个简易读卡器程序给实施人员在医院设备安装调试,结果实施人员怎么调试都不行,很懵逼。
本地开发过程中没发现一点问题,于是远程排查了下,是CDN链接没正确加载,导致程序报错。
那么避免这种情况,可以准备一个CDN列表,动态切换加载去不断的链接
原理也很简单,就是利用script的错误回调和JS的标签操作dom创建和插入,一个一个尝试
<script>
function loadResource(links, fnSuccess, fnError) {
const script = document.createElement('script');
script.onerror = function () {
document.head.removeChild(script);
fnError();
};
script.onload = fnSuccess
script.src = links.shift();
document.head.appendChild(script);
}
function autoSwitch(resourceList) {
if (!resourceList.length) return
const resource = resourceList.shift();
loadResource([resource], function (success) {
console.log('CDN节点:'+resource+" 加载成功!");
}, function (err) {
console.log('CDN节点:'+resource+" 加载失败!");
autoSwitch(resourceList);
});
}
// cdn 链接列表
const resourceList = [
'https://cdn.jsdelivr.net/npm/axios/dist/axios.js',
'https://cdn.jsdelivr.net/npm/axios/dist/axios.min.js',
'https://cdn.jsdelivr.net/axios/dist/axios.js',
];
autoSwitch(resourceList);
PS:其实把远程链接文件下载下来放在本地也可以