之前在发布一篇文章的时候发现上传的gif图一直显示失败,但是在发布前使用markdown外链的方式,在预览文章时显示却是完全正常的。不知道有没有同学遇到跟我一样的问题,在这里把我的解决方法贴出来希望可以帮到需要的同学。
例如下图
Paste_Image.png图片信息:图形交换格式 (GIF)-1.7 MB
尺寸:617 × 742
外链链接http://i13.tietuku.com/458bac81eeb2e2af.gif
被简书上传后的站内链接https://img.haomeiwen.com/i969941/09e433f5d5ae3233.gif?imageMogr2/auto-orient/strip%7CimageView2/2/w/1240
可以看到,站内链接分为两部分:
前半部分
https://img.haomeiwen.com/i969941/09e433f5d5ae3233.gif
也就是资源的URI;
后半部分
imageMogr2/auto-orient/strip%7CimageView2/2/w/1240```
---
发布后文章中就是个裂开的占位图。
当直接复制并打开完整的站内链接时,会得到这样一个错误:
![Paste_Image.png](https://img.haomeiwen.com/i969941/3d7ee7232dd7c52d.png?imageMogr2/auto-orient/strip%7CimageView2/2/w/1240)
当单独复制并打开资源URI的时候可以看到能够正常显示:
![单独的URI打开效果,此处用的链接只为显示效果](https://img.haomeiwen.com/i969941/e90b5c4eac0a906f.gif?imageMogr2/auto-orient/strip)
所以现在可以确定,上传到简书的图片是好好的保存在简书服务器中的,那么显示不正常的原因应该就是后半段了
imageMogr2/auto-orient/strip%7CimageView2/2/w/1240
这一段参考此处
[http://developer.qiniu.com/docs/v6/api/reference/fop/image/imageview2.html](http://developer.qiniu.com/docs/v6/api/reference/fop/image/imageview2.html)
可知是七牛的图片处理,但是看完了文档也没看出来什么(😳)
唯一可疑的就是这处
2.新图的宽/高/长边/短边,不会比原图大,即本接口总是缩小图片;
---
好了,原因一知半解的找出来了,下面上解决方案吧。
解决方案就两个字:
# 压缩
![ImageOptim](https://img.haomeiwen.com/i969941/90f6fdb648dce7af.png?imageMogr2/auto-orient/strip%7CimageView2/2/w/1240)
这是作者用的压缩工具,非常好用。
上文中1.7M的gif经过压缩后体积仅为339KB
使用压缩后的gif再次上传后就可以显示正常了。
全文完。
网友评论