GitLab

问题

资源服务/案例管理开发过程中，项目Upload组件回显时，不展示图片，却展示了图标+url。

• 试验了图片url，浏览器能展示，说明url本身没问题。
• 域名是banner.linhuiba.com，也不存在访问安全策略之类的问题。

原因

查看接口返回数据发现图片对象的type字段值是”image”，这个不是正常的mine type，antd的Upload组件无法识别，因此无法展示图片。

• 常见的图片文件mime type有
  • image/gif
  • image/bmp
  • image/jpeg
  • image/jpg
  • image/png

这个数据是从其他项目导入到中台项目的，可能是某个前端项目中上传图片组件时将图片对象中的type字段设置为了”image”，历史数据中制造了这个问题。

对策

历史数据问题已成事实，为了能在前端正常展示，可以临时替换type，让Upload组件正常展示

    Array.isArray(data.pictureMedia) && data.pictureMedia.forEach(itm => {
      if (itm.type === 'image') {
        itm.type = 'image/png'; // 临时替换type，让Upload组件正常展示
      }
    });