typecho原生微信小程序
2023年 07月 18 日

如默

说明

一直想把网站做成小程序,github上typecho的小程序也都是远古版本,今年官方也升级到了typecho 1.2.1版本,目前还没有可用的小程序,我自己抽空写了一个,开源给大家使用。

先附上开源地址:Gitee国内 Github

其中,Restful后端接口插件,mp为小程序源码,img为介绍图片

环境

本站环境如下:

# PHP版本:8.1.17
# 网站服务器:nginx/1.22.1
# 数据库:Pdo_Mysql[Version:5.7.42-log]
# Typecho版本:1.2.1

微信小程序没有使用uni-app等框架,采用原生小程序和Vant前端框架,本小程序秉承简洁原则,大方美观

小程序二维码见本站右侧顶部,或扫一扫下图:

如默星空小程序

如默星空小程序

主要功能及优点

  • 首页文章列表、文章搜索、文章分类浏览、文章归档时间轴、关于
  • 浏览文章评论、分享页面、复制联系信息
  • 文章代码高亮、行号、语言显示
  • 文章链接自动复制
  • 文章表格横向滚动
  • 一键返回顶部
  • 接口请求时间限制,防止崩溃
  • 使用缓存,提升加载速度

预览图

首页

首页

分类

分类

归档

归档

关于

关于

代码高亮

代码高亮

评论

评论

后端

代码中typecho-plugin-Restful文件夹为接口插件,修改名称为Restful,上传到插件目录,启用即可。

默认后端请求地址为https://xxx.com/api/,可自行在插件中设置,此插件源码地址为:typecho-plugin-Restful

前端

小程序代码,appjs里修改后端接口地址:

// app.js
App({
  onLaunch() {
    // 获取当前年份
    const date = new Date();
    const currentYear = date.getFullYear();
    this.globalData.currentYear = currentYear;
  },

  globalData: {
    baseURL: "https://xxx",
    currentYear: null,
  },
});

这个接口地址需要在微信小程序开发后台添加一下,然后执行npm install,然后构建npm即可

已知问题

  • 评论功能暂不支持,目前也不打算支持,因为不简洁而且不容易过审

计划更新

  1. 增加黑暗模式(功能不复杂,开发版已支持,就是实在懒得适配css,很烦)
  2. 自己写接口,就当练习了
  3. 未完待续……

小程序审核

审核之前,后台最好备份一下数据,然后留两三篇技术文章,不要抄袭,不要发资讯之类的,一般都没问题,评论最好不要有。

本站小程序从提交审核到通过,14分钟,很快,如下图:

微信小程序审核

微信小程序审核

结语

这个微信小程序的本意就是方便在移动端浏览文章,所以阅读是最重要的功能,其余都是点缀,不希望太复杂,虽然网站是响应式布局,但很少有人用手机访问。

BUG反馈请提交issue,留言请在本文留言,欢迎提出意见,开源程序,随缘更新。

typecho原生微信小程序

说明

一直想把网站做成小程序,github上typecho的小程序也都是远古版本,今年官方也升级到了typecho 1.2.1版本,目前还没有可用的小程序,我自己抽空写了一个,开源给大家使用。

先附上开源地址:Gitee国内 Github

其中,Restful后端接口插件,mp为小程序源码,img为介绍图片

环境

本站环境如下:

# PHP版本:8.1.17
# 网站服务器:nginx/1.22.1
# 数据库:Pdo_Mysql[Version:5.7.42-log]
# Typecho版本:1.2.1

微信小程序没有使用uni-app等框架,采用原生小程序和Vant前端框架,本小程序秉承简洁原则,大方美观

小程序二维码见本站右侧顶部,或扫一扫下图:

如默星空小程序

如默星空小程序

主要功能及优点

  • 首页文章列表、文章搜索、文章分类浏览、文章归档时间轴、关于
  • 浏览文章评论、分享页面、复制联系信息
  • 文章代码高亮、行号、语言显示
  • 文章链接自动复制
  • 文章表格横向滚动
  • 一键返回顶部
  • 接口请求时间限制,防止崩溃
  • 使用缓存,提升加载速度

预览图

首页

首页

分类

分类

归档

归档

关于

关于

代码高亮

代码高亮

评论

评论

后端

代码中typecho-plugin-Restful文件夹为接口插件,修改名称为Restful,上传到插件目录,启用即可。

默认后端请求地址为https://xxx.com/api/,可自行在插件中设置,此插件源码地址为:typecho-plugin-Restful

前端

小程序代码,appjs里修改后端接口地址:

// app.js
App({
  onLaunch() {
    // 获取当前年份
    const date = new Date();
    const currentYear = date.getFullYear();
    this.globalData.currentYear = currentYear;
  },

  globalData: {
    baseURL: "https://xxx",
    currentYear: null,
  },
});

这个接口地址需要在微信小程序开发后台添加一下,然后执行npm install,然后构建npm即可

已知问题

  • 评论功能暂不支持,目前也不打算支持,因为不简洁而且不容易过审

计划更新

  1. 增加黑暗模式(功能不复杂,开发版已支持,就是实在懒得适配css,很烦)
  2. 自己写接口,就当练习了
  3. 未完待续……

小程序审核

审核之前,后台最好备份一下数据,然后留两三篇技术文章,不要抄袭,不要发资讯之类的,一般都没问题,评论最好不要有。

本站小程序从提交审核到通过,14分钟,很快,如下图:

微信小程序审核

微信小程序审核

结语

这个微信小程序的本意就是方便在移动端浏览文章,所以阅读是最重要的功能,其余都是点缀,不希望太复杂,虽然网站是响应式布局,但很少有人用手机访问。

BUG反馈请提交issue,留言请在本文留言,欢迎提出意见,开源程序,随缘更新。


赞 (2)

猜您想看

CentOS7下Docker安装Gitea配合宝塔面板实现反代

前几天用二进制安装了Gitea,过程有些繁琐,而且配置SSH也比较麻烦,现在用Docker安装一下,特此记录。

01

爱之初体验:phpstudy-linux面板(小皮面板)首次使用感受

前一阵子看到phpstudy发布了Linux面板,类似于宝塔,遂想体验一番。

02

2019 单反 or 微单?

如题,最近时长有想买单反的人,在问我究竟该买单反还是微单? 解释的多了,就想记录一下,方便查阅。

03

宝塔面板安装OLAINDEX 4.0记录

一款 OneDrive 目录文件索引应用,基于优雅的 PHP 框架 Laravel5.8 搭建,并通过 Microsoft Graph 接口获取数据展示,支持多类型帐号登录,多种主题显示,简单而强大。

04

Python处理excel查找相同列内容并输出对应行数据

前两天帮同学处理了一个excel,可以用Python实现,记录一下。

05

mindoc接口文档在线管理系统(使用宝塔面板安装配置教程)

本文以centOS7为例,介绍如何配置安装mindoc并使用宝塔面板配置

06

评论区(2条评论)

我要评论

Vaptcha 初始化中...

lu
LV1
  

感谢博主,只是本人小白不懂,干着急,

如默
博主
   lu

没事,慢慢来,不需要懂什么技术,可以随时问

回复 1