紧急通知!如果你的博客有统计相关功能,请放弃本方案!!

前言

这篇文章将会以图文的形式详细给大家说明一下由Typora + bilibili组合的图床搭建步骤,以及图片格式转换方式和压缩
本文参考文献:typora-plugin-bilibili(github)
本文涉及插件下载:main(Windows)
本文涉及网站:Typora官方中文站(MD编辑) | Onlineconvertfree(图片压缩) | bilibili

教程(图床)

本方案的图床并不支持图片删改,请您备份好图片!!!

本方案将会使用到Typora工具,该工具正版需付费购买激活(价格89),可以试用不到一个月!

若不打算购买可以试用盗版历史版本(不推荐!本文不给予链接!)

您可以先前去了解一下Typora,购买是非必要的一步!!

前置资源准备

  1. 首先咱们先下载一下插件的压缩包点我下载
    (注意:上面的资源是Windows版本的,其他版本请见后面链接)typora-plugin-bilibili(github)
  2. 下载好后咱们把压缩包进行解压
  3. 接下来咱们把里面的main.exe文件放在一个指定的文件夹中(注意:文件路径全英,不得有空格)
  4. 接下来我们下载Markdown编辑器Typora请先进行购买,随后下载,最后激活
  5. 打开网页版b站,登录好你的账户
  6. 按下F12打开控制台
  7. 根据下图操作获取你的token(SESSDATA)
    点我查看教程图片

    t1
    t2

  • 点击应用程序
  • 然后在左侧侧边栏一次找到存储--Cookie--https://www.bilibili.com
  • 随后在其中找到对应名称SESSDATA,其后面的值就是我们接下来步骤中要用到的token,请复制到任意地方记下来这里获取的token可能会在某天面临失效,只需要重复刚才的步骤重新获取一遍即可!!

组装步骤

点我查看教程图片

t3
t4

  1. 打开你的Typora,点击左上角文件,点击偏好设置
  2. 在左侧点击图像并勾选插入图片时...中的下面两个选项

    对本地位置的图片应用上述规则

    对网络位置的图片应用上述规则

  3. 找到上传服务设定--上传服务,选择自定义命令
  4. 在下面的命令中输入咱们刚才下载的main.exe的插件的绝对路径 + 空格 + token= + 你的token(SESSDATA)
  5. 随后点击验证图片上传
  6. 出现成功上传图片并获得新的URL字样就说明你已经完成80%了,你可以点击下面的链接进行测试,若图片成功加载无误则没有问题

解决防盗链问题

打开你们的博客根目录,打开themes/butterfly/layout/includes/head.pug
在一堆meta元素下面加入以下代码meta(name="referrer" content="no-referrer")

1
meta(name="referrer" content="no-referrer")

然后保存就可以啦

图片上传

图片上传仅需将本地图片拖入Typora中然后右键图片点击上传图片,这样就大功告成啦~~~

教程(图片压缩)

Onlineconvertfree(强烈推荐)

点我跳转网站
这个网站能支持转换各种格式,而且在转换成webp后自动压缩合适程度,十分好用节省时间!但是别的格式有没有压缩效果暂且没有试过

iloveimg(多功能网站)

点我跳转网站
这个网站能够压缩JPG\PNG\SVG\GIF文件,并保持最佳质量,不错之选

TinyPNG(压缩推荐)

点我跳转网站
十分简洁,高速,便捷的压缩网站!十分推荐!

footer