欢迎您访问程序员文章站本站旨在为大家提供分享程序员计算机编程知识!
您现在的位置是: 首页

判断图片是否可从服务器正常取回

程序员文章站 2022-06-10 20:28:15
...
  • 场景

做OEM定制化功能,在服务端只保存的当前图片的静态路径,但是当重新部署环境时,图片目录会被覆盖,此时基于产品健壮性考虑,在加载OEM定制logo等图片时,先做下判断,看定制数据能否正常取回。

  • 解决方案
 /**
   * 验证图片后 进行热更新
   * @param {string} url  图片路径
   * @param {string} key
   * @param {boolean} img
   * @private
   */
 private __getImg(url?:string, key?: string, img = true) {
    if (img) {
      const imgObj = this.__isHasImg(url);
      if (imgObj) {
        const me = this;
        const ImgObj = new Image();
        ImgObj.onload = function() {
          if (ImgObj.width > 0 && ImgObj.height > 0) me.__updateByKey(key, url);
        };
        // 浏览器兼容性处理
        if (ImgObj.complete && ImgObj.width > 0 && ImgObj.height > 0) me.__updateByKey(key, url);
        ImgObj.src= url;
      }
    } else {
      this.__updateByKey(key, url);
    }
  }
// 关键代码
const ImgObj = new Image();
        ImgObj.onload = function() {
          if (ImgObj.width > 0 && ImgObj.height > 0) me.__updateByKey(key, url);
        };
        // 浏览器兼容性处理
        if (ImgObj.complete && ImgObj.width > 0 && ImgObj.height > 0) me.__updateByKey(key, url);
        ImgObj.src= url;