用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 pages和Hexo[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/

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