Solo 生成导出静态站点

本贴最后更新于 1712 天前,其中的信息可能已经时移世异

本文是《Solo 从设计到实现》的一个章节,该系列文章将介绍 Solo 这款 Java 博客系统是如何从无到有的,希望大家能通过它对 Solo 从设计到实现有个直观地了解、能为想参与贡献的人介绍清楚项目,也希望能为给重复发明重新定义博客系统的人做个参考 ❤️

自 v3.9.0 开始,Solo 开始支持生成并导出静态站点,以方便用户部署 GitHub Pages 这类静态网站托管服务。实例可见于此:

换句话说,Solo 可以支持在本地 localhost 上写作,然后用户自行部署 Pages 托管站点,这样就不用搭建服务器运维了。Solo 静态部署同样支持浏览量计数和社区评论互动,让静态博客也能和动态博客一样充满生机。

使用流程

  1. 功能入口:管理后台 - 工具 - 静态站点
  2. 输入待生成的静态站点地址,比如 https://88250.github.io
  3. 点击“生成”按钮触发静态站点页面资源生成
  4. 生成完毕后界面会返回导出的目录路径

技术实现

Solos.GEN_STATIC_SITE = true;

genURI("/tags.html");
genURI("/archives.html");
genURI("/links.html");
genURI("/categories.html");
genURI("/index.html");
genURI("/blog/info");
genURI("/manifest.json");
genURI("/rss.xml");

genArticles();
genTags();
genArchives();
genCategories();
genSkins();
genJS();
genImages();
genPlugins();
genFile("sw.js");
genFile("robots.txt");
genFile("CHANGE_LOGS.md");

Solos.GEN_STATIC_SITE = false;
  • genURI :用于生成独立的动态模板页面
  • genArticlesegenTagsgenArchives 等:分别用于生成文章、标签、存档等
  • genJSgenImagesgenPlugins :分别用于生成 JS、图片、插件
  • genFile :用于生产单个的静态文件

对于文章,仅导出:

  • 状态为发布状态的,即不导出草稿夹
  • 没有密码的文章,即公开文章

除了页面相关资源的生成,静态博客站点还需要浏览计数统计和评论功能,为此我们做了两个组件来进行支持:

  • uvstat:博客总浏览数、文章浏览数的计数组件
  • vcomment:提供社区评论,将社区端回帖相关交互特性共享给博客端节点

UVStat

引入 uvstat.js 后将需要统计的计数项用 span 包裹:

<span data-uvstaturl="${servePath}${article.articlePermalink}">${article.articleViewCount}</span>

然后调用 addStat 进行计数请求, renderStat 进行计数结果渲染,细节请参考项目文档。

uvstat 部署在社区服务器上,是 B3log 分布式社区的重要基础设施,Solo 已经全部切换到该服务上实现浏览计数了。

VComment

引入 vcomment.js 后在评论列表处引入:

<div id="vcomment" data-name="${article.authorName}" data-postId="${article.oId}"></div>
<div id="soloComments" class="fn__none">
  <@comments commentList=articleComments article=article></@comments>
</div>

Solo 本地的评论列表依然保留,只是默认不展现,当通过 vcomment “加载为空”后才展现本地评论列表。“加载为空”只有一种情况:该文章没有同步到社区,所以不存在和该文章关联的回帖。

这样用户如果不想推送文章到社区,也可以使用本地的评论系统,如果推送过了,就优先走社区评论系统。走社区评论系统的优势是能够最大限度共享社区交互功能,比如回帖回复、二级评论、感谢、通知等。

技术实现方面主要用到了 CORS,接口完全由社区提供,本地直接加载社区服务端渲染的 HTML,提交时带 CSRF Token 避免跨站脚本攻击。

1 操作
88250 在 2020-02-27 16:45:20 更新了该帖

相关帖子

优质回帖

欢迎来到这里!

我们正在构建一个小众社区,大家在这里相互信任,以平等 • 自由 • 奔放的价值观进行分享交流。最终,希望大家能够找到与自己志同道合的伙伴,共同成长。

注册 关于
请输入回帖内容 ...
  • CodingOX

    厉害,辛苦了!

  • 其他回帖
  • emmith 1

    发现一个 bug,生成静态站点时(win10),要是路径名中有空格,会失败,因为空格变成了占位符 %20,没有空格则不报错

    1 回复
  • haoker

    谢谢哈,已解决,站点导出的时候,没改成 https,导致的请求问题,后面改回来,清空缓存就好了

  • @88250 我发现一个问题,生产的静态文件,url 还是原来博客页面里面的,会跳到原来的网站

    1 回复
  • 查看全部回帖