基于wordpress实现一个微信小程序

关注的几个大佬都陆续用上了自己网站的微信小程序，那咱也不能落后，对吧。于是，经过折腾→郁闷→排查问题→解决，最后也实现了一个微信小程序，♪(＾∀＾●)ﾉ。本文来说明一下实现的过程：

前提

1. 有一个微信小程序帐号(用来调试发布微信小程序)
2. 一个配置了SSL的域名(小程序的request等请求是强制https)
3. WordPress4.7级以上的版本(低版本不支持rest json api )
4. wordpress要实现伪静态(实现伪静态的方法)
5. github下载 winxin-app-watch-life.net(小程序主体程序,文末附下载地址)
6. 安装wp-rest-api-for-app插件(基于官方的rest json api 定制,文末附下载地址)

过程

登录微信小程序设置一些小程序的事项，比如：名字，头像，服务类目等等，然后下载微信开发者工具，导入下载的winxin-app-watch-life.net文件夹，如图所示：

按照步骤一步一步来，导入下载的文件夹的位置，然后输入自己的appid(在微信小程序后台，设置→开发设置里面)，然后确定就可以开始了。

注意：下载的winxin-app-watch-life.net目录结构是这样的，文件名字→文件名字→程序内容，所以导入程序的时候要导入第二个文件名字，不然会报错。

进入调试界面，打开config.js文件，config.js文件的路径如下图：

文中红框的地方修改为自己的内容，剩下的就是一些修修改改为自己喜欢的样子。

小程序代码配置完成后，去自己的网站配置一下插件，插件要怎么安装呢，这个插件因为没有上传到wordpress商店，所以商店是没有的，需要自己解压后上传到服务器的插件目录，然后登录到网站后台开启该插件。

AppID和AppSecret都在微信小程序的后台界面可以找到，路径是设置→开发设置。小程序的首页会有轮播图，把你想要放到轮播的文章ID输入里面就可以了。

最后

开始编译，如果报错可以看console的错误是什么，然后对症下药。

注意：

1. 如 果你的网站开启了css,js压缩代码，小程序可能会提示无法访问网络。
2. 如果无法生成海报检查一下该插件目录下的qrcode是否开启读写权限
3. 如果无法生成文章图片的海报，检查一下downloadFile合法域名是否有文章图片的域名

本站小程序，扫一扫体验

感谢

1. winxin-app-watch-life.net下载地址：https://github.com/iamxjb/winxin-app-watch-life.net
2. wp-rest-api-for-app插件 下载地址：https://github.com/iamxjb/winxin-app-watch-life.net
3. 造了一个这么厉害轮子以及该定制插件的作者：守望轩 https://www.watch-life.net

完。