博客图床配置之七牛云

之前我曾写过一篇 Mac 上的 Markdown 写作工具——MWeb 相关的文章 《电脑写作利器 MWeb|如何使用第三方预览样式?》,主要是讲如何在 MWeb 中使用第三方预览样式,让文章的预览视图看起来更舒服。

这一次我想写一下 MWeb 的图床配置问题,MWeb 内置了「发布服务」的功能,支持将本地编辑好的文章直接发布到 Wordpress、Medium、少数派等网站。

但要想让整个过程一气呵成的话,我们需要先解决图床配置的问题,这样你发布的文章中的图片才不会出现丢失或上传失败的问题。

多个平台

在解决这个问题之前,我们需要先了解什么是图床?

图床是什么?

图床,可以理解为一个存放图片的网络空间或服务器,你发布到朋友圈的图片,别人之所以能看到,是因为你上传的图片放在了腾讯提供的网络空间上。

这个网络空间充当了桥梁的角色,对已成为微信好友的人或设置为最多可见 10 张图片的陌生人开放,这样别人就看到了你发布在朋友圈的图片。

对应到写文章这件事,我们也需要将文章中用到的图片,上传到写作平台的图床(服务器),这样读者在读文章时才能顺利看到我们附上的图片。

但如果你和我一样,会将一篇文章发布到不同的平台,例如将首发在公众号的文章发布到知乎,你大概率会遇到一个蛋疼的问题——粘贴到知乎编辑器的文章会出现多个「图片上传失败」的提示。

之前为了解决这个问题,我的方法是:先将微信文章复制到简书,再从简书复制到知乎编辑器。这个方法几乎能完美解决图片上传失败,少数时候会遇到 Gif 上传失败的问题。

说句题外话,从上面这种解决方法推测,微信为了避免被别的写作平台当成图床(避免被薅羊毛),它禁用了图片的外链引用,当它识别到当前的环境不是在微信体系内,图片就会显示失败,这就导致了图片上传失败的问题。

而现在,我有了一个更好的解决方法——将图片上传到自己的图床帐户中。这个方法可以省去上面「粘贴到简书」的中间步骤,简化整个流程,更重要的是,你可以更方便地将文章分发到多个平台,例如自己的个人博客或其他写作平台。

有哪些可用的图床?

免费图床

网上有不少人整理了多个免费的图床,但目前我用过的免费图床只有两个:路过图床和微博图床。

  • 路过图床 https://imgchr.com/
    全球CDN加速, 支持外链, 原图保存, 最大单张支持10 MB
  • 新浪微博图床 https://www.crx4chrome.com/crx/17508/
    为了让微博图床更易用,有人开发了一个浏览器插件「新浪微博图床」,支持选择/拖拽/粘贴上传图片,并生成图片地址、HTML、UBB 和 Markdown 等格式

微博图床插件
免费图床虽然可以不花钱,但我悲观地认为,大多免费且赚不了钱的服务终究走不了长远,也许未来的某一天,你就会突然收到「XX 关停」的通知。

如果你想更妥善地保存自己的图片数据,最好还是选择大一点或者收费的图床工具。

收费图床

七牛云虽然是一个主打收费的服务,但它对所有注册的实名用户,还是免费提供了每月 10 GB 的存储空间、每月 10 GB 的 CDN 回源流量,具体可见下图。

其实我对这些术语也不是很清楚,但这些免费额度,对于一个没什么访问量的博客来说,已经够用了。

七牛云价格费用
了解更多关于七牛云计费方式的内容,可以参考官方的文档:
https://www.qiniu.com/prices/kodo?source=kodo

首次使用七牛云,它会给每个人分配一个临时的测试域名,有效期为一个月,过期之后如果你还想使用七牛云作为图床的话,就需要自己去注册一个域名。

MWeb 七牛云图床配置

MWeb 本身支持的图床服务较多,例如七牛云、腾讯云和阿里云等,还支持自定义更多图床。

MWeb支持的图床
配置之前,我们先在浏览器打开七牛云的「控制台」,切换到「对象存储」,新建一个公开的空间,这里我将空间名称命名为 blog-picbed20,空间名称自行定义,后面会用到。

创建空间

打开创建好的空间,需要添加「CDN 加速域名」,域名的格式为「cdn.+自己注册的域名」,接着需要配置右侧的「CNAME」,将鼠标移动到 CNAME 上方,它会给出配置 CNAME 的指导。

cname

复制七牛云空间的 CNAME 值,接着打开你注册的域名的「DNS 解析页面」,因为我是在腾讯云注册的域名,这里打开的就是腾讯云的管理后台。

在解析列表中新增一条记录,主机记录为 cdn,记录类型选择 CNAME,记录值位置粘贴刚从七牛云得到的 CNAME 值。

增加解析记录
完成这个步骤后,回到七牛云的控制台,刷新页面,直至 CDN 加速域名的状态显示为「成功」,则表示完成了七牛云的配置。

成功
回到 MWeb,打开「偏好设置」,切换到「发布服务」,添加「七牛云存储」,API 地址选择离你较近的地区即可。

空间名称:前面创建七牛云空间自定义的名称
域名:http://cdn.+自己注册的域名

MWeb配置
而其中的 Access Key 和 Secret Key 则需要再次回到七牛云的后台获取,点击右上角的帐户头像,在弹出的菜单中,选择「密钥管理」,创建一个新的密钥。

下图的 AK 和 SK 分别对应 MWeb 里的 Access Key 和 Secret Key,分别粘贴到 MWeb 中相应的位置,就完成了 MWeb 中图片的配置。

创建密钥
借助 MWeb 集成的将本地图片上传到图床的功能,当你将文章从 MWeb 发布或粘贴到其他平台之前,先选择顶部的菜单「发布–把本地图片传至图床」。

-w629

在弹出的窗口中,选择「七牛云图床」,接着点击右下角的「上传本地图片」,MWeb 就会将本地的图片上传到七牛云图床,再自动返回图片上传到图床后的「远程地址」。

上传本地图片

此时如果你想将文档发布到公众号或知乎,先点击「复制带样式的 HTML」,再切换到发布内容的平台,使用 Command + V 粘贴,文章和图片也会随之过去了,一气呵成,不会出现图片丢失的问题。

-w583
第一次看完整个配置,你可能会觉得非常麻烦,但就像老话说的「万事开头难」,开头的坑趟过去了,后面等着你的可能就是一马平川的广阔天地。

完成第一次稍微有些麻烦的配置,你就可以持续享受一次配置带来的多次收益,这某种程度上也可以算是一种「复利」行为,何乐而不为?

以上,希望有帮助。


本博客所有文章除特别声明外,均采用 CC BY-SA 4.0 协议 ,转载请注明出处!