富文本插入图片的时候直接复制链接的风险点和解决方案

业务背景

• 最近由于项目需要开发了一个富文本的功能
• 其中有一个小点是插入图片到富文本中，
  • 插入的时候是可以直接复制图片的链接地址插入的
  • 我本来觉得没啥，但是感觉哪里不太对，于是开始了风险点评估，以及对应的解决方案

风险点评估

• 插入的只是一个图片链接，无法判断内容是否合规，如果是非正规图片是不是就凉了
  • 虽然人眼是可以识别，但有几个问题
    • 已经上传到了我们项目的服务器了，难道再删除一次？
    • 当你的眼睛识别结束的时候，眼睛已经被伤害了啊
• 有的图片资源设置了只有在同域名或者指定域名下才能访问
  • 会导致复制了链接，然后无法显示的问题
• 图片尺寸大小，物理大小等无法控制，毕竟是别人的资源

如果强制需要，排除风险点方案

• 开发图片审核接口
  • 插入图片链接前先传给后台校验资源接口，没问题后再返回给前台
  • 将远程图片地址``下载为本地图片，再调用项目中的图片上传接口转为我们项目的资源，
• 在插入图片链接的输入框里复制或者输入路劲的时候，直接进行图片链接的域名限制，只有指定域名的图片等资源才可插入到富文本编辑器中，从源头解决问题

综合评估

1. 最简单方案
   • 除非是真的很必要，我建议直接将插入图片链接的功能去掉
2. 折中方案，最佳实践
   • 输入链接的时候，对http资源的域名进行输入限制
3. 理想方案，成本太大了
   • 开发图片审核接口，先审核是否合规，合规后下载文件并将其转换为我们项目的资源

致谢

• 由于想到了这个问题就分析归纳了一波，又学到了，感谢这个小需求点
• 感谢过往的经历，不然我真的想不到这么多
• 感谢您百忙之中阅读我的文章，希望对您有帮助
• 如果技术结合项目实战或者底层源码感兴趣，可以关注我噢，我最近两年估计会狂搞一波技术