手把手教你搭建一个博客app,带用户等功能

演示APP
链接https://52ttyx.lanzoum.com/iRKHE346ua4d
密码:ao4p

打个小广告

RuleApi是一款Java语言开发的API程序,用于快速构筑自己的社区,文章博客,资源论坛等后端API。它起源于国产开源程序Typecho数据库,并支持与Typecho网站对接,但目前已经支持独立运行。

目前快捷安装是通过Linux下一键脚本实现环境和程序的安装,但RuleApi作为Springboot框架开发的程序,理论上可以在所有支持java环境的操作系统中运行。如果你使用的是CentOS系统,则可以继续阅读此文档完成安装,如果是其它操作系统,请阅读手动安装的文章。

请认真看完所有的叙述,不要只看一半教程就开始操作,出错了又来说有Bug!

教程开始

第一步:前期准备部分

服务器配置要求

最低配置:1核CPU 700M运行内存

推荐配置:2核CPU 2G运行内存

系统要求:CentOS7及以上版本,Ubuntu还有Debian均可,建议可以安装好宝塔面板(方便管理)。Windows也支持运行,但不支持使用脚本快捷安装,请选择手动安装。

前置要求

1.Typecho(1.0 or 1.1 or 1.2):可选择不安装 。Typecho是一款国内有名的个人博客开源程序,拥有丰富的模板和插件生态。

2.Redis(5.0-7.0):推荐6.0,Redis是现在最受欢迎的NoSQL数据库之一。

3.Mysql(5.5-5.7):推荐5.6

4.准备一个域名用于访问RuleApi

Typecho

Typecho是一款php语言开发的国产开源程序,RuleApi起源于Typecho,并完美支持Typecho数据库。如果你需要额外的网页访问端,则可以先安装Typecho。如果你不需要,则直接跳过这里,进入下面的步骤。

请不要做如下操作

请不要在服务器自己安装Java环境和tomcat!!!!!!,这将直接导致API安装后无法运行 ,并且造成后续的一系列问题,相当于 五分钟的事情你非要画蛇添足变成一两个小时搞不定!!!!

第二步:执行安装脚本

首先,执行如下命令,进入服务器opt目录

cd /opt

对于Centos

执行下方RuleApi安装脚本,根据提示完成安装。

wget https://www.ruletree.club/api/ruleapi.sh && sh ruleapi.sh install

如果上述脚本执行出现网络错误 ,可选择备用节点:点击进入

对于Ubuntu

执行下方RuleApi安装脚本,根据提示完成安装。

curl -O https://www.ruletree.club/api/ubuntu/ruleapi.sh && chmod +x ruleapi.sh && ./ruleapi.sh install

对于Debian

执行下方RuleApi安装脚本,根据提示完成安装。

curl -O https://www.ruletree.club/api/debian/ruleapi.sh && chmod +x ruleapi.sh && ./ruleapi.sh install

命令和填写范例如下:

请输入运行端口(输入8080或者其它端口,千万别80或者443):这里可以不填,或者填写不合其它应用冲突的端口

请输入数据库名:如果安装了Typecho,就填写和Typecho一致的数据库信息

请输入数据库用户名:如果安装了Typecho,就填写和Typecho一致的数据库信息

请输入数据库密码:如果安装了Typecho,就填写和Typecho一致的数据库信息

请输入redis密码(一般是空):

请输入系统管理密码(建议英文加数字):系统管理里面也叫做访问Key

第四步:外网访问

安装完成RuleApi后,需要外网访问才可以使用。所以,如果安装了宝塔面板,请新创建 一个纯静态网站(不需要ftp,不需要数据库,只要纯静态并且分配单独的域名,一般是二级域名 ),配置SSL证书(主要提升安全性和后续方便),随后将如下代码放入这个新建网站的伪静态 配置中。下方的代码实现了反向代理和跨域,同时8080请替换为你上个步骤设置的API端口,127.0.0.1这条请不要变更 。

location ^~ / {
  add_header 'Access-Control-Allow-Origin' '*';
  add_header 'Access-Control-Allow-Methods' 'GET, POST, OPTIONS, PUT, DELETE';
  add_header 'Access-Control-Allow-Credentials' 'true';
  add_header 'Access-Control-Allow-Headers' 'Authorization,Content-Type,Accept,Origin,User-Agent,DNT,Cache-Control,X-Mx-ReqToken,X-Data-Type,X-Requested-With,X-Data-Type,X-Auth-Token';
  if ( $request_method = 'OPTIONS' ) { 
    return 200;
  }
  proxy_pass http://127.0.0.1:8080;
  proxy_set_header Host $host;
  proxy_set_header X-Real-IP $remote_addr;
  proxy_set_header X-Forwarded-For $proxy_add_x_forwarded_for;
  proxy_set_header REMOTE-HOST $remote_addr;
}

访问界面如下,随后请点击“安装及更新 ”按钮,输入你上个步骤设置的系统管理密钥 ,即可完成安装。如果你未安装Typecho ,将会弹出提示框询问你是否需要独立安装 。

到此,RuleApi安装完成,你使用的域名即为API接口地址 。

第五步:API后续管理

注意,项目启动之后,运行日志将输出到/opt目录下out.txt文件,如果启动后出现异常或者无法访问,可以打开这个文件查看具体的原因。/opt/application.properties为主要的配置文件,如果出现安装脚本配置错误,项目无法正常启动,就可以在这个文件进行修改。

管理命令

启动RuleAPi

sh /opt/ruleapi.sh start

停止RuleAPi

sh /opt/ruleapi.sh stop

重启RuleAPi

sh /opt/ruleapi.sh restart

删除RuleAPi

sh /opt/ruleapi.sh uninstall

查看帮助信息

sh /opt/ruleapi.sh help 

更新和升级

通过如下指令可更新到最新正式版

sh /opt/ruleapi.sh update

通过如下指令可更新到内测版本(功能多,但可能存在未知问题)

sh /opt/ruleapi.sh updateBeta

开机自启和宕机自启

目前脚本已经添加了monitor监听方法,执行后将检测RuleAPI是否正常运行,如果未运行状态则执行启动命令。具体指令如下:

sh /opt/ruleapi.sh monitor

所以,只需要让这个命令几分钟执行一次,监听项目是否运行正常,未运行就开始运行,就可以实现开机自启和宕机自启,以宝塔面板为例,直接在计划任务中增加如下的任务即可,间隔可以3分钟到10分钟,这样开启或者宕机后几分钟内就会自行启

接下来是APP打包

APP源码下载地址

请勿将本程序用于诈骗、色情、赌博、木马、病毒等违法行为,如有违反该条例,我们将配合公安机关追究法律责任!目前将响应相关法律政策,逐步加入API封禁机制,违法违规站点将直接永久禁用API,届时将无法使用,无法安装 。

本文章主要是讲解RuleAPP的详细配置,包括数据的调用,第三方登录和在线支付的配置。在这篇教程中,除了基本的配置外,还会讲解目录的结构,开发的框架等信息,帮助各位更好的使用RuleApp建设自己的客户端应用。

首先要明确一点,RuleAPP是完全开源的,所有的地方都可以随意的修改删除或者增加新功能满足自己的需求。

下载地址:点击进入

请认真看完所有的叙述,不要只看一半教程就开始操作,出错了又来说有Bug!

注意点

RuleApp在安卓苹果,h5和小程序的不同运行情况下,界面会有所不同,这是为了全部兼容而出现的正常情况。

教程步骤

导入项目

安装HBuliderX后,访问uniapp插件中心的地址,就可以直接通过按钮导入RuleApp项目。

如果是从github下载的内测版,可以选择通过文件夹导入。

全局配置

在完成APP源码导入后,请确认你的RuleApi已经安装完成。如未完成请参考之前的教程安装RuleApi,如已完成,请进入RuleApi的管理中心,找到如下图所示模块,创建一个新的APP应用,填写你自定义的配置即可。

创建之后,就会得到应用Key,然后复制你的接口地址,和应用key,打开APP源码中如下图所示的文件,填写即可。其它圈出来的地方,也可以根据自己的需求配置。

还有几个重要的地方是如下的配置,对于文章ID,则直接去数据库或者看文章页面中的参数ID获取,而如下的URL链接规则,则是根据你文章的实际访问路径进行拆解。

图片上传

图片上传是很重要的功能,RuleApi提供了多个接口,使用不同的接口需要做不同的配置。具体可以打开RuleApi的可视化配置中心,如下图所示,从已支持的上传方式中任选其一进行配置即可。

APP更新检测

回到RuleApi中的应用模块,可以看到在应用管理的时候,有如下几个参数。

对于APP而言,它是通过比对版本码判断是否需要更新的,所以可以确保在每次发布新版的时候,上面配置的版本码始终和最新版APP一致 ,如下图所示。这样就可以确保每次都可以让旧版用户弹出更新提示。

manifest.json说明

对于RuleApp而言,这个文件负责配置第三方登录,消息通知,图标和启动图,还有h5打包,还有打包相关。图标和启动图想必已经很直观了,这里就只说几个注意点。

第三方登录

这里有个注意点就是,用的就开,用不上的别开,开了打包肯定报错。QQ微博微信这三个的,都去各自的开发者平台申请appid等信息,每个APP都是不一样的,具体的各自的开发者平台都有教程。

对于小程序登录,需要前往API配置中心,额外配置这些内容。

支付配置

请不要在manifest.json配置任何支付相关的东西!!!!支付配置全部在RuleApi

网页唤醒APP

找到如下图所示的位置,设置APP的UrlSchemes,这里自己定义一个英文的名称就好(小写),千万不要和我的一样,不然可能会直接在你的网页唤醒规则之树的APP(不过你免费打广告我也乐意)

设置完成后,比如我设置的名称是ruleapp,那么在网页中,就可以通过超链接的或者js跳转的形式直接点击打开,比如如下代码。

<a href="ruleapp://">打开app</a>

而这里,我提供了两个参数,一个是快捷登录(配合会员中心项目),一个是打开app文章阅读。

ruleapp://?scan=快捷登录码
ruleapp://?info=文章ID

无论是在网页上采用a标签或者js自动跳转,只要用户安装了app,都可以被唤醒。

配置unipush消息通知

目前RuleApp使用的是unipush1.0版本,所以在打包时需要勾选Push模块1.0。 然后前往dcloud开发者中心:点击进入,点击应用后根据下图所属开通,证书签名如果是云端证书就去云端证书那里拿,如果是自己的证书就百度怎么获取。

设置好之后,根据下图获取圈出来的三个,填写到RuleApi推送设置就好了,顺序是124,3不需要

APP统计

uniapp官方是支持全平台统计的,所以无论怎样编译都可以被统计到,但前提是需要开启相关功能。主要都在mainifest.json,下图除了第一个勾,其它的都别动,建议使用1.0版本。

然后,就可以在统计配置中,选择想要统计的平台。

完成配置后,打包一个新版本,统计就会生效了。而查看统计则前往官方地址即可:

uni统计,uni-app统计,多端统计

其它配置

首页数据推荐

用管理员账户登录APP,找到管理员中心,打开内容管理,选择已发布文章,就可以看到文章的推荐、轮播、和图文设置 。然后回到内容管理,打开标签分类,就可以看到分类和标签的推荐,还可以设置缩略图。这里对应的就是首页的幻灯片、专题和推荐文章。

pages.json

这个文件定义了所有可以打开的页面,如果没有在里面定义,页面就无法开启。
pages.json的底部定义了使用H5编译后打开的首页名称,和底部的四个选项卡图片和文字,可以根据自己的需求进行修改。

Typecho自定义字段

目前RuleApi已经集成了Typecho的自定义字段功能,而在APP代码内,暂时只通过这个功能实现了图文显示类型。因为我使用的是typecho小灯泡模板,所以我的类型字段是abcimg,可以个根据自己的模板进行修改,涉及的APP文件主要有以下三个。

/page/home/home.vue
/page/contents/contentlist.vue
/page/manage/contents.vue

如果要改成自己的字段,可以先在可视化配置中心定义,然后在APP的api.js定义,如下图所示。

然后在从上述三个文件中搜索abcimg,改成自己所用typecho模板的字段和对应值。如果自己二次开发需要用到更多的自定义字段,可以去看RuleApi的接口文档。

链接分享

RuleApp的链接分享功能通过拼接Url实现,具体涉及的参数如下图所示。

如果安装了typecho,那么就可以根据当前Typecho的伪静态设置或者访问链接来设置,比如上图的设置就是在Typecho开启伪静态后的默认模式下的设置。

举例就是,如果你的网站访问文章,地址是如下这样:

https://www.ruletree.club/archives/2786/

那么linkRule =WEB_URL+"archives/{cid}/"这段代码,就会拼接WEB_URL设置的https://www.ruletree.club/和替换{cid}为实际的文章ID。这样就实现了分享功能,如果不一致将直接访问404。

如果你未安装Typecho,可以将RuleApp打包为h5模式发布成网页,这样就可以通过类似如下的地址访问网页。

网站地址/#/pages/contents/info?cid=1613

那么linkRule就可以配置为如下

linkRule =WEB_URL+“/#/pages/contents/info?cid={cid}”

这也取决于RuleApp h5版本的运行目录,根据实际情况配置即可。

小程序端编译

RuleAPP支持编译为微信小程序,QQ小程序,并在理论上支持所有小程序平台(如果编译出现问题,可以来群里反馈)。

小程序要求域名必须备案,接口必须https,否则在发布后会出现网络错误,切记!!!

7 个赞

教程很详细,但对于我还有点复杂,帮顶

感谢大佬分享
:xhj28:

1 个赞

已经很简单了,终端执行安装命令,然后电脑打包APP就行了,uniapp打包APP很简单的

佬,有无能直接把wordpress打包为app的项目?

好,我再看一下,没仔细看

这么长说的肯定是对的,支持大佬

uniapp插件市场有小程序版,然后用小程序框架打包双端

1 个赞

收到,谢谢

g感谢分享

这个牛逼

真大佬

看不懂!必须支持

好硬核啊,

此话题已在最后回复的 30 天后被自动关闭。不再允许新回复。