用GitHub创建Steem文章镜像 | Mirroring Your Steem Blogs on GitHub | 免费博客备份服务: steemblog

用GitHub创建Steem文章镜像 | Mirroring Your Steem Blogs on GitHub | 免费博客备份服务: steemblog

本文介绍将Steem文章同步到GitHub pages的开源工具和免费服务:‌

  1. 开源工具 “blog”:https://think-in-universe.github.io/blog/
  2. 免费服务 “steemblog”:https://steemblog.github.io/

Image Source: Pixabay

缘由

最近在用steem的时候,觉得不管是用busy, steempeak还是steemit等,它们的界面设计对于看自己以前的文章并不太方便(当然想看其他人的旧文章也比较麻烦),并且由于国内的网络访问这些站点的速度都不太快,所以以博客服务来看,用户体验是挺差的;至于要方便地搜索、归类自己的文章就更麻烦了。‌

之前曾经有过一些浏览历史文章较方便的服务(如chinabb和steemitfriends),似乎也或者关闭或者收费了,因此暂时没有找到好用的服务。‌

于是想到可以把Steem上的文章备份成镜像,每日自动同步,便于自己梳理和分析;虽然我文章写的不多,但如同在《标签的本质 | The Nature of Tags(一)》里提到的,组织信息是人类的本能,于是便实现了这里的工具和服务。‌

GitHub镜像博客

关于为什么需要自己写文章同步工具,其实是值得询问的:‌

  1. 首先,博客镜像的工作相信之前有人也已经做过了,这并非什么新想法(但我简单搜了一下也没有找到可以立即复用的工具)。但是搭建博客镜像是一项需要适应自身需求的工作,所以自己动手的话可以有更高的灵活性和掌控度。
  2. 其次,即便之前有类似工作的话,可能也并不是同步到GitHub,或者也未必会做到近实时的更新,所以这项工作也可以作为一种服务,也并非完全没有价值。

为了完成这项工作,我们基于steem API、GitHub pagesHexo[1]框架创建了博客镜像搭建工具,效果如下(示例:https://think-in-universe.github.io/blog/):‌

1. 博客首页

左侧是用户的profile,右侧是近期的文章,中间为最近文章。

‌screenshot from https://think-in-universe.github.io/blog/

2. 侧边栏:类别和标签

Steem上的标签和类别,会同步到hexo框架下面,并能够正常显示。遗憾的地方在于由于steem上没有类别层级的概念,所以要分类文章,相对来说没有那么灵活。

‌screenshots from https://think-in-universe.github.io/blog/

3. 侧边栏:近期文章和归档

‌显示最近5篇文章,以及每个月的文章数量。可以看出,作为写作者而言,我是比较懒惰的 :) 和大家比还有很大差距。

‌screenshots from https://think-in-universe.github.io/blog/

4. 文章展示:右侧目录、代码高亮和原文链接

‌在右侧添加了一个目录控件,对于阅读长文是有帮助的。‌

代码高亮对类似本文的有代码的文章有一定帮助,steemit对代码高亮的处理是比较初级的。‌

原文链接其实是为了方便我自己有时候引用文章需要,在steem上找文章比较低效。

‌screenshots from https://think-in-universe.github.io/blog/

5. 搜索

‌搜索功能对于想要快速查阅或引用自己的文章,较有帮助。点击右上角的搜索按钮,可以进行快速搜索。

‌screenshot from https://think-in-universe.github.io/blog/

6. 独立的归档、类别、标签页等

‌如果要单独查看这些信息,可以到分别的独立页面下查看,如有需要,也可以建立其他的标签页。例如,归档页面的时间线,比steem看起来简洁一点:https://think-in-universe.github.io/blog/archives/

‌screenshots from https://think-in-universe.github.io/blog/

页面展示大体如此,主要的价值在于从文章的角度,信息的组织更为清晰。如果想要获得一个类似的博客镜像,大抵有两种方法:‌

  1. 如果你了解GitHub和GitHub pages如何使用,可以使用本文发布的开源代码(https://github.com/think-in-universe/blog),根据其中的README,搭建一个类似的镜像就行了。
  2. 如果你希望可以使用一个免费的博客镜像服务,可以参考文章最后一章提到的 steemblog 博客镜像服务,或者直接联系我。

如何实现博客镜像工具?

‌为了实现以上功能,我们可以基于博客框架Hexo[1],搭建从Steem同步数据、并发布到GitHub pages的博客镜像工具,可以支持基于用户名、标签、日期等查询方式的数据同步。下面简要介绍如何实现这一博客镜像工具。‌

工具的代码在GitHub开源:https://github.com/think-in-universe/blog

关于具体如何使用此工具,可以参考上面项目中的README的介绍:可以在本地安装后使用,也可以通过travis-ci部署。‌

本项目的代码里重用了 @cn-hello 小门童实现时的一些基本框架,所以需要增加的功能较少。工具的工作流程如下,也比较简单:‌

  1. 下载你的Steem文章;
  2. 用Hexo编译成静态文件;
  3. 用GitHub pages部署博客;

(1)下载你的Steem文章

‌由于重用了之前的SteemReader的方法,我们可以指定通过账户或者标签以及时间(天数)来获取文章。‌

blog/builder.py

1
2
3
4
5
6
7
8
9
10
11
class BlogBuilder(SteemReader):

def __init__(self, account=None, tag=None, days=None):
SteemReader.__init__(self, account=account, tag=tag, days=days)

def download(self):
if len(self.posts) == 0:
self.get_latest_posts()
if len(self.posts) > 0:
for post in self.posts:
self._write_content(post)

‌code from https://github.com/think-in-universe/blog | MIT License

为了将文章下载为hexo可识别的markdown格式,需要在markdown中加入相关ymal或json的元数据。以下为markdown模板,包含了标题、类别、日期、标签等信息,并指定显示文章的目录。‌

blog/message.py

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
MESSAGES["blog"] = """
---
title: "{title}"
catalog: true
toc_nav_num: true
toc: true
date: {date}
categories:
- {category}
tags:
{tags}
thumbnail: {thumbnail}
---


{body}
"""

code from https://github.com/think-in-universe/blog | MIT License

使用Steem API,获取steem文章的元数据和markdown文本。‌

blog/builder.py

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
def _write_content(self, post):
folder = self._get_content_folder()
c = SteemComment(comment=post)

# retrieve necessary data from steem
title = post.title.replace('"', '')
body = post.body
date_str = post.json()["created"]
date = date_str.replace('T', ' ')
tags = "\n".join(["- {}".format(tag) for tag in c.get_tags()])
category = c.get_tags()[0]
thumbnail = c.get_pic_url() or ''
url = c.get_url()

# build content with template
template = get_message("blog")
content = template.format(title=title, date=date, tags=tags, category=category, thumbnail=thumbnail, body=body, url=url)

# write into MD files
filename = os.path.join(folder, "{}_{}.md".format(date_str.split('T')[0], post["permlink"]))
with open(filename, "w", encoding="utf-8") as f:
f.write(content)

logger.info("Download post [{}] into file {}".format(title, filename))

code from https://github.com/think-in-universe/blog | MIT License

(2)用Hexo编译成静态文件

‌我们需要为建立的博客设置一个美观的主题。‌

我们这里使用了 https://github.com/ppoffice/hexo-theme-icarus 主题,需要将其作为一个git submodule加入到git repository中。‌

.gitmodules

1
2
3
[submodule "theme"]
path = themes/icarus
url = https://github.com/ppoffice/hexo-theme-icarus.git

‌code from https://github.com/think-in-universe/blog | MIT License

随后使用hexo命令来将markdown转换成生成静态的文档。‌

blog/command.py

1
2
3
4
5
6
7
@task(help={
})
def build(ctx):
""" build the static pages from steem posts """

os.system("cp -f _config.theme.yml themes/icarus/_config.yml")
os.system("hexo generate")

‌code from https://github.com/think-in-universe/blog | MIT License

(3)用GitHub pages部署博客

‌正式部署时,我们有两种方式,一是在本地使用hexo命令部署,或者在travis-ci 中定期每日进行同步。‌

hexo命令部署:blog/command.py

1
2
3
4
5
6
7
@task(help={
})
def deploy(ctx):
""" deploy the static blog to the GitHub pages """

build(ctx)
os.system("hexo deploy")

‌code from https://github.com/think-in-universe/blog | MIT License

travis-ci部署:.travis/deploy.sh

1
2
3
4
5
6
7
8
9
10
11
12
13
14
[ -z "${GITHUB_PAT}" ] && exit 0
[ "${TRAVIS_BRANCH}" != "master" ] && exit 0

git config --global user.email "${GIT_EMAIL}"
git config --global user.name "${GIT_USERNAME}"

git clone --depth 1 --branch gh-pages --single-branch https://${GITHUB_PAT}@github.com/${TRAVIS_REPO_SLUG}.git site
cd site
cp -r ../public/* ./

NOW=$(date +"%Y-%m-%d %H:%M:%S %z")
git add --all *
git commit -m "Site updated: ${NOW}" || true
git push -q origin gh-pages

‌code from https://github.com/think-in-universe/blog | MIT License

另外,需要注意,由于用travis-ci 部署时需要用户提供Git用户信息(用于commit到gh-pages)以及GitHub的token,所以需要以环境变量的方式进行配置。‌

博客镜像服务 http://steemblog.github.io/

‌今天在微信群中 岩哥 @andrewma 提到想要一个分析文章标签的服务,我想起搭建的这个博客镜像也有标签云和标签统计,所以帮助建一个类似的镜像服务就能解决该问题。‌

但由于岩哥对GitHub并不熟悉,使用上面提到的博客镜像工具可能较为困难,所以在此基于https://github.com/think-in-universe/blog 项目,建一个organization account用户管理博客,帮助有需要的人建博客镜像的子目录,这就是steemblog。‌

1. 如何使用博客镜像服务

‌目前,这个博客镜像服务可以在 https://steemblog.github.io 找到。‌

如果要添加一个新的用户到镜像同步中,只需添加账户到用户列表中即可(目前是手动添加的)。例如,我们添加了 @robertyan 和 @andrewma 到列表中。我们可以在以下链接访问他们的博客镜像:‌

  1. https://steemblog.github.io/@robertyan/
  2. https://steemblog.github.io/@andrewma/

与之前的工具需要手动配置用户信息不同,这里自动从steem同步了用户的profile。(不过跟我手动配置的差不多)

‌screenshot from https://steemblog.github.io/@robertyan/

@andrewma的博客镜像也创建成功了,不过头像和缩略图的处理可能需要做一些改进。

‌screenshot from https://steemblog.github.io/@andrewma/

比如岩哥关心的标签信息,可以在https://steemblog.github.io/@andrewma/ 中找到:

‌screenshots from https://steemblog.github.io/@andrewma/

同样的,我们可以继续添加新的用户,他们的镜像可以在 https://steemblog.github.io/@{账户名} 中找到。‌

对于这样的博客镜像,如有需要或建议,可以在文章后面留言讨论。‌

2. 如何建立博客镜像服务

https://github.com/steemblog/blog 是在 https://github.com/think-in-universe/blog 的基础上构建的,为了适应多用户的子目录的需要,需要对原来的项目的目录结构和部署方式做一些调整。‌

(1)从steem下载文章的同时,自动同步用户信息

通过steem获取的账户信息,自动更新_config.yml_config.theme.yml

相对应的模板在 blog/message.py 中,由于内容太长,这里不贴出。‌

blog/builder.py

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
def update_config(self):
if not self.account:
return

organization = BLOG_ORGANIZATION
logo = BLOG_AVATAR
favicon = BLOG_FAVICON

language = settings.get_env_var("LANGUAGE") or "en"

a = SteemAccount(self.account)
author = self.account
name = a.get_profile("name") or ""
# about = a.get_profile("about") or ""
location = a.get_profile("location") or ""
avatar = a.get_profile("profile_image") or ""
website = a.get_profile("website") or ""

# build config file with template
template = get_message("config")
config = template.format(organization=organization, language=language,
name=name, author=author)
filename = CONFIG_FILE
with open(filename, "w", encoding="utf-8") as f:
f.write(config)
logger.info("{} file has been updated for the account @{}".format(filename, author))

# build config theme file with template
template = get_message("config.theme")
config = template.format(organization=organization,
favicon=favicon, logo=logo,
author=author, name=name, location=location,
avatar=avatar, website=website)
filename = CONFIG_THEME_FILE
with open(filename, "w", encoding="utf-8") as f:
f.write(config)
logger.info("{} file has been updated for the account @{}".format(filename, author))

‌code from https://github.com/steemblog/blog | MIT License

(2)在生成静态网页时,相互隔离不同用户的路径

将不同账户的页面放置到@account子目录下。‌

blog/message.py

1
2
3
4
5
6
7
8
9
10
# URL
## If your site is put in a subdirectory, set url as 'http://yoursite.com/child' and root as '/child/'
url: http://{organization}.github.io
root: /@{author}/
permalink: :category/:post_title/
permalink_defaults:

# Directory
source_dir: source
public_dir: public/@{author}

‌code from https://github.com/steemblog/blog | MIT License

编译指定的steem用户的文章为静态页面,隔离放置在发布目录下。‌

blog/command.py

1
2
3
4
5
6
7
8
9
10
11
@task(help={
})
def build_all(ctx):
""" download the posts of all the accounts, and generate pages """

accounts = settings.get_env_var("STEEM_ACCOUNTS") or []
if accounts and len(accounts) > 0:
for account in accounts.split(","):
clean(ctx)
download(ctx, account)
build(ctx)

‌code from https://github.com/steemblog/blog | MIT License

(3)部署时,将页面推送到 steemblog.github.io‌

只需修改 .travis/deploy.sh 中的目标代码仓库的参数即可。‌

最后

‌究其本质,本文是对steem上的数据进行处理的一种尝试,在开放的区块链数据的基础上,我们可以根据场景,采取多种灵活的数据展现方式,这里的镜像博客无疑又是其中的一种。‌

希望本文提供的工具或服务对你有帮助,如果需要帮助你开启博客镜像服务,可以在本文留言,我会尽量提供支持。由于travis的使用也有一些限制,优先帮助前5位留言的朋友提供服务 :)‌

参考文献

  1. https://hexo.io
  2. Hexo icarus主题:https://github.com/ppoffice/hexo-theme-icarus
  3. 博客镜像工具:https://think-in-universe.github.io/blog/
  4. 博客镜像服务:https://steemblog.github.io/


Posted from my blog with SteemPress : https://robertyan.000webhostapp.com/2019/05/%e7%94%a8github%e5%88%9b%e5%bb%basteem%e6%96%87%e7%ab%a0%e9%95%9c%e5%83%8f-mirroring-your-steem-blogs-on-github-%e5%85%8d%e8%b4%b9%e5%8d%9a%e5%ae%a2%e5%a4%87%e4%bb%bd%e6%9c%8d%e5%8a%a1%ef%bc%9a-st


This page is synchronized from the post: 用GitHub创建Steem文章镜像 | Mirroring Your Steem Blogs on GitHub | 免费博客备份服务: steemblog

Comments

Your browser is out-of-date!

Update your browser to view this website correctly. Update my browser now

×