关于云存储:Docsify腾讯云对象存储-COS一键搭建云上静态博客

57次阅读

共计 1513 个字符,预计需要花费 4 分钟才能阅读完成。

最近始终在想如何利用 COS 简化动态博客的搭建过程。搜了很多的动态博客搭建过程,发现大部分的动态博客都要通过编译能力生成动态页面。功夫不负有心人,终于让我找到了一个超简洁博客的搭建办法。

成果预览

http://docsify-1252452803.file.myqcloud.com/

本文应用到工具

  1. 腾讯云对象存储
  2. COSBrowser 客户端
  3. Docsify
  4. 一颗可能写 markdown 的聪慧大脑 ????

本文办法的长处

  1. 不须要装置 node,谁都能够一键主动搭建;
  2. 本地不须要全局装置 doscify;
  3. 不须要保护两份代码;
  4. 若在写作过程中不小心把文件全删了,还能够复原回来;
  5. 一边写作一边刷新页面即可实时在线上看到后果。

上面,就让我来给大家瞅瞅,我是如何做到一键搭建云上动态博客。

后期筹备工作

第一步

首先,你要在腾讯云对象存储控制台创立一个存储桶。这里作为例子,我创立一个名为 docsify 的存储桶。地区能够就近抉择,拜访权限要选私有读公有写。

第二步

关上 COS 的动态网站性能。

第三步

关上 COS 的默认 CDN 减速,源站类型抉择 动态网站源站

一键搭建博客

下载 COSBrowser 客户端,用腾讯云账号登录,并进入刚刚创立的那个存储桶。

  1. 关上客户端,并点击腾讯云账号登录。
  2. 进入刚刚创立的存储桶。
  3. 点击上传按钮,抉择链接文件上传,并将下列 url 文件资源复制到输入框中,而后点击上传。

开始写文档

上一步上传胜利后,能够看到当前目录下创立的几个文件。

  • vue.css 博客依赖的款式文件,不须要管
  • docsify.min.js 博客依赖的脚本文件,不须要管
  • index.html 博客的入口文件
  • README.md 会做为主页内容渲染

间接在 COSBrowser 客户端编辑 README.md 就能更新主页内容,当然也能够增加更多页面。

多页文档

假如你存储桶的目录构造如下:

那么对应的拜访页面将是:

定制侧边栏

为了取得侧边栏,您须要创立本人的_sidebar.md。您能够在 COSBrowser 新建 _sidebar.md 文件。默认状况下侧边栏会通过该文件主动生成。

首先配置 loadSidebar 选项,具体配置规定见配置项 #loadSidebar。

编辑 index.html 文件:

而后编辑 _sidebar.md 文件

再刷新线上页面,即可看到侧边栏。

线上实时预览

在上述操作后,间接在浏览器关上 http://docsify-1252452803.cos-website.ap-guangzhou.myqcloud.com/ 就能在线上看到文档。

留神这里可能进行实时预览的链接为 动态网站拜访链接,不是减速域名链接。

每次编辑完后刷新浏览器页面就能实时看到更新后的文档内容。

但如果想要更新 CDN 缓存,则须要去 CDN 控制台 对该 url 进行刷新。

常识补充

1、COSBrowser 如何进行文件复原(找回历史文件)?

COSBrowser 客户端编辑窗口有一个小小的【时钟】按钮,点击该按钮可关上编辑器历史。然而该性能仅帮您保留最近 100 次所有文档编辑的记录。

若须要 COS 帮您主动保留正本,则能够开启存储桶的版本控制性能。

这样,您就能够在历史版本中下载该文件的历史版本并进行复原了。

2、如何把截图上传到 COSBrowser?

您能够应用其余工具的快捷键在屏幕里截图,截好的图会主动存在剪辑版中。

当您在 COSBrowser 客户端用快捷键 CTRL+V 即可将截图上传到当前目录下。

3、如何在 .md 文档中援用图片?

您能够通过绝对路径或相对路径援用图片。

4、如何为上传的图片加上 COS 数据处理的一些性能(如:水印)

如果是要为图片带上水印,能够间接在绝对路径 / 相对路径上加上 COS 数据处理的水印参数。参考文档

正文完
 0