近一年都在做一款在线教育工具（以下统称为“白板”）的开发工作，期间遇到N多的问题与坑，遂在此记录，并及时更新。

第一篇：关于资源访问填坑

因为是在线授课，所以使用我们白板的人员地域范围较广，基本上西到乌鲁木齐，北到哈尔滨，南到海南，国外的有加拿大，美国和日本等留学相对热门国家，所以在网络的资源访问上难免踩到到众多的坑

1、DNS解析失败

这种场景多发生在中西部地区以及教育网的场景下，起初，用户发生这样的问题，反馈过来，鉴于用户多数是电脑小白，技术支持一般会帮用户远程操作，因为软件使用的是阿里云，所以会将用户的DNS地址改成阿里云的。后面考虑到这种方式太原始，于是写了个bat脚本，集成到软件内（不过个人感觉还是太low了，暂时没有其他方案），出现网络跑不通的情况，给予用户相应的提示，用户可以自己run bat进行网络访问诊断；

 

用户网络环境检测脚本界面

 

2、用户网络无法无法访问CDN图片资源

这种场景多发生于教育网或部分运营商网络环境下（如广电等），但也不排除因为节点分布等其他原因导致无法访问cnd，针对这种情况，我们在CDN之外，另外部署了两台服务器作为图片的代理，前端封装一个检测图片url是否有效的方法（代码如下），即拿到用户课件图片中其中一张进行检测地址能否访问，如果http请求是200，则无需启用图片代理服务器，反之则启用第一台代理服务器，同样进行http请求的校验，以此类推，直到所有代理尝试完毕，如果依然无法访问，则给予用户更换网络环境的前端提示。

/*** 做图片url是否有效检测* @param url */testImgUrl(url: string, callback: (res) => void) {    if (typeof XMLHttpRequest !== 'undefined') {        let xhr = new XMLHttpRequest();        xhr.onreadystatechange = function(){            if (xhr.readyState === 4) {                if (xhr.status !== 200) {                    callback('failed');                }else {                    callback(xhr.status);                }            }        };        xhr.timeout = 1000;        xhr.open('get', url, true);        xhr.send(null);    }}