腾讯云cos html,Docsify+腾讯云对象存储 COS，一键搭建云上静态博客

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

效果预览

本文使用到工具

本文方法的优点不需要安装 node，谁都可以一键自动搭建；

本地不需要全局安装 doscify；

不需要维护两份代码；

若在写作过程中不小心把文件全删了，还可以恢复回来；

一边写作一边刷新页面即可实时在线上看到结果。

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

前期准备工作

第一步

首先，你要在腾讯云对象存储控制台创建一个存储桶。这里作为例子，我创建一个名为 docsify 的存储桶。地域可以就近选择，访问权限要选公有读私有写。

第二步

打开 COS 的静态网站功能。

第三步

打开 COS 的默认 CDN 加速，源站类型选择静态网站源站。

一键搭建博客

下载 COSBrowser 客户端，用腾讯云账号登录，并进入刚刚创建的那个存储桶。打开客户端，并点击腾讯云账号登录。

进入刚刚创建的存储桶。

点击上传按钮，选择链接文件上传，并将下列 url 文件资源复制到输入框中，然后点击上传。

开始写文档

上一步上传成功后，可以看到当前目录下创建的几个文件。vue.css 博客依赖的样式文件，不需要管

docsify.min.js 博客依赖的脚本文件，不需要管

index.html 博客的入口文件

README.md 会做为主页内容渲染

直接在 COSBrowser 客户端编辑 README.md 就能更新主页内容，当然也可以添加更多页面。

多页文档

假设你存储桶的目录结构如下：

那么对应的访问页面将是：

定制侧边栏

为了获得侧边栏，您需要创建自己的_sidebar.md。您可以在 COSBrowser 新建 _sidebar.md 文件。默认情况下侧边栏会通过该文件自动生成。

首先配置 loadSidebar 选项，具体配置规则见配置项#loadSidebar。

编辑 index.html 文件：

然后编辑 _sidebar.md 文件

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

线上实时预览注意这里能够进行实时预览的链接为静态网站访问链接，不是加速域名链接。

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

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

知识补充

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

COSBrowser 客户端编辑窗口有一个小小的【时钟】按钮，点击该按钮可打开编辑器历史。但是该功能仅帮您保存最近 100 次所有文档编辑的记录。

若需要 COS 帮您自动保存副本，则可以开启存储桶的版本控制功能。

这样，您就可以在历史版本中下载该文件的历史版本并进行恢复了。

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

您可以使用其他工具的快捷键在屏幕里截图，截好的图会自动存在剪辑版中。

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

3、如何在 .md 文档中引用图片？

您可以通过绝对路径或相对路径引用图片。

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

如果是要为图片带上水印，可以直接在绝对路径/相对路径上加上 COS 数据处理的水印参数。参考文档

腾讯云cos html,Docsify+腾讯云对象存储 COS，一键搭建云上静态博客相关推荐

轻松实现微信小程序上传多文件/图片到腾讯云对象存储COS（免费额度）
概述对象存储(Cloud Object Storage,COS)是腾讯云提供的一种存储海量文件的分布式存储服务,用户可通过网络随时存储和查看数据. 个人账户首次开通COS可以免费领取50GB 标准存 ...
如何开通并快速入门腾讯云对象存储COS服务？
简介对象存储(Cloud Object Storage,COS)控制台是 COS 为用户提供的最简单且易于上手的操作方式.用户无需编写代码或运行程序,可直接通过 COS 控制台使用 COS 服务. ...
基于hadoop构建对象存储系统_Hadoop社区正式支持腾讯云对象存储COS
8月4日消息,知名大数据开源社区Hadoop近日宣布对腾讯云对象存储COS的正式支持.后续,开发者在基于Hadoop架构进行大数据分析时,能够在不修改代码的情况下,无缝高效地使用腾讯云COS来处理海量 ...
electron 使用json作为本地存储_使用腾讯云对象存储 COS 作为 Velero 后端存储，实现集群资源备份和还原...
Velero(以前称为 Heptio Ark)是一个开源工具,可以安全地备份和还原,执行灾难恢复以及迁移 Kubernetes 集群资源和持久卷,可以在 TKE 集群或自建 Kubenetes 集群中 ...
腾讯云对象存储cos使用
腾讯云对象存储cos使用一.新建密钥 1.登录腾讯云进入控制台 2.新建密钥二.创建对象存储 1.进入对象存储,并创建存储桶三.创建项目 pom文件 yml文件创建一util层 control ...
认证+1！腾讯云对象存储COS、存储一体机TStor首批通过信通院云原生存储能力评估
数字经济发展日新月异,企业走向数字化,诞生了海量的软件和服务.软件行业高数据规模,高自动化.高迭代速度的要求,给传统软件行业带来了挑战.为推动软件架构更加健全,管理更加高效,云原生的概念应运而生,强调 ...
腾讯云对象存储COS + 数据万象CI = 完善的图片解决方案
沈唁 PHP工程师,开源爱好者,WordPress插件Sync QCloud COS 作者,GitHub@sy-records 在日常开发当中,我们必然会遇到一些图片存储问题,例如用户头像.聊天产生的 ...
腾讯云对象存储 COS 服务之 XML Python SDK 实践
文章目录前言 1 SDK 安装 2 测试代码准备 - 文件上传和下载 2.1 初始化 2.2 文件上传 2.3 文件下载 3 测试验证 END 前言腾讯云对象存储(Cloud Object Sto ...
【Java】购买腾讯云服务器，并部署Spring boot项目，再到部署自己的个人博客，域名备案，安全连接配置
云服务器部署一.购买腾讯云服务器二.简单配置 2.1 进入控制台 2.2 配置防火墙 2.3 配置访问密码三.远程ssh登录连接服务器四.云服务器安装软件 4.1 安装JDK 4.2 安装My ...

腾讯云cos html,Docsify+腾讯云对象存储 COS，一键搭建云上静态博客

腾讯云cos html,Docsify+腾讯云对象存储 COS，一键搭建云上静态博客相关推荐

最新文章

热门文章