R-Markdown编辑器本地图片上传功能更新,放宽上传限制,临时还是长期保存,你说了算.

R-Markdown编辑器本地图片上传功能更新，放宽上传限制，临时还是长期保存，你说了算。

之前本地图片上传有一些限制，比如单张500k，10张上限，当时想着如果一篇文章太多本地图片，会导致文档体积太大，微信加载可能会缓慢，后来想想一篇文章可能也用不了几张图，于是我决定把本地图片上传功能重构一下。

本次改动，本地图片上传分为了临时保存和长期保存两种方式。临时保存只有工具栏左边一个临时上传图片入口，粘贴、拖拽默认使用长期保存方式。

临时保存：适用于文章编辑后直接发表，不需要保存图片，编辑器会在合适的时机自动清理LocalStorage中的图片。

长期保存：图片会被存储到浏览器IndexedBD数据库，长期存储，只要不手动清理，图片一直都在。

之前本地图片上传有十张的限制。现在去掉了这个限制，你想插多少张就插多少张。建议开启图片质量压缩，按需调节，默认保存为JPG格式。

长期保存的单张图片压缩后大小上限也提高到了5M，临时图片压缩后提高到了2M的限制。

实测一张2M左右的图片，谷歌浏览器中开启90%压缩，可以压到200～300K。苹果系统中safari浏览器压缩后要高一些。

虽然现在限制放宽了。但还是要提醒，适当使用。本地图片大小是计入文档大小的，假如一篇文章达到几十兆，用户网络慢的时候，看到你的文章可能显示白屏一段时间。如果真的需要很多高清图片，还是建议使用在线图片比较稳妥。

你可能一张图片会在不同的文章使用，当你上传图片后， 编辑器会检查是否已经存在相同的图片，如果存在会复用之前的图片，不会又存一遍，一定程度上节省存储空间。

长期存储和临时上传的图片，在文档里的链接长得不一样。

临时上传的图片，链接是这个格式：IMG_数字_随机码。这种链接随时可能会被清理。

长期存储的图片，链接前面带一个 idb: 前缀，这是 IndexedDB 的标志。编辑器看到这个前缀，就知道要去本地数据库里读取。

所以如果你在文档里看到 idb: 开头的图片链接，说明这张图已经落盘保存了，可以放心关窗口。看到不带 idb: 的，就是还在用临时模式，请注意及时保存，不然可能需要重新添加。

长期存储也有一个问题，留得久了，缓存里会堆一堆你可能已经不用的图片。

比如你写初稿时插了五张图，后来觉得不合适全删了。文档里没有了，但 IndexedDB 里还留着。

在「设置」弹窗的「图片设置」面板最下面，有一个「清理图片缓存」的入口。点进去会展示当前缓存里的所有图片，你可以挨个看哪些还在用、哪些已经没用了。

右上角有个多选按钮，点一下进入批选模式，勾选要删的图片，再点清理选中就行。也可以不用多选，直接单张清理。

清理之前多看一眼，删了就真没了。如果文档里还在引用这张图，图片就渲染不出来了，需要重新添加。

这个功能是我直接复用的清理缓存界面，你可以在图库里面选择一张图片直接插入到编辑器。

你还可以选中一张图片置顶，置顶的图片会优先靠前显示，不想置顶时可以选中后取消置顶。

好了，今天的分享就到这里，如果使用中遇到问题欢迎反馈。