尺有所短,寸有所长
物有所不足,智有所不明

WordPress对接小程序配置过程以及遇到的问题

最近发现一个很棒的开源项目-WordPress版微信小程序  https://github.com/iamxjb/winxin-app-watch-life.net,详细看了下介绍非常棒,不仅支持的功能多且完善,更是开源版(作者也提供功能更多的付费版)。更多关于小程序的功能介绍可以看官网:守望轩

题外话:现在小程序在微信生态内,获取流量相对容易些,而且累计独立用户达到1000 就可以开通流量主功能,本着学习的心态去试试真得劲,哈哈哈;

准备工作:
前提具有WordPress站点且最好是4.7以上版本,因为需要rest json api
首先你需要先花一两天的时间去学习下小程序,来来来,地址在这   https://dwz.cn/xsXXfmHr (网址有效期一年)
网站需要开启HTTPS,微信小程序强制要求的 (不会的话留言后续再写个相关教程)
网站先备份下,防止有什么骚操作导致不必要的损失那就倒霉了,可以使用云端的镜像或快照备份
下载资源,文末我已经打包,方便下载

安装rest-api-to-miniprogram

安装后进入配置页面,配置好你的AppID和AppSecret(可去小程序后台-开发模块获取),如下:

公众号【空名先生】

配置小程序服务域名和业务域名

公众号【空名先生】
如何找到文章id?

打开wordpress后台-文章-所有文章-鼠标放到标题上(不用点击),左下角会出现链接

公众号【空名先生】

如何给小程序专题模块添加自定义封面图?
wordpress后台 => 分类目录 =>选择一个分类进行编辑里面有微信小程序封面直接放进去链接即可

设置完成后,小程序“专题”页就有合适的封面了

修改小程序源码

配置好如上内容,打开微信小程序开发工具,找到项目  utils 文件夹下的 config.js 文件,进行合适的配置即可

公众号【空名先生】

这个时候你就可以看到效果了;其他内容可以自己鼓捣着玩了

注:插件以源码来源于守望轩,感谢博主提供源码和插件!

在此留一个需求:后台数据库有个文章A或者分类B,我想PC网站可以正常浏览,小程序不要展现,这样来解决一些文章小程序官方不允许展示的内容但又不影响我的PC站点。

我的思路:1.直接过滤提供出来的API        2.再小程序里面筛选

有涉及这块或有思路的大佬不吝赐教,感谢!(涉及了WordPress REST API)

资源地址: WordPress小程序

问题1.文章内容中的“<”和“>”字符显示问题

小程序是使用“wxPares工具来实现html转wxml的,如果你的文本包含了代码比如xml会携带<>符号,程序会将其转化,造成解析出现问题,导致文章出现问题。

解决:wxParse里面有个html2json的文件,找到函数transEmojiStr(str),在里面添加以下3行

function transEmojiStr(str){
str = str.replace(/&lt;/g, '<');
str = str.replace(/&gt;/g, '>');
str = str.replace(/&amp;/g, '&');
......
}

//推荐资源站:https://zhimalier.com/

之后找到wxDiscode.js文件,找到函数strcharacterDiscode(str),注释掉关于&lt和&gt的内容即可

问题分析流程:

第一眼看到这个问题很是蒙蔽,但是作为程序员的素养告诉我一定要冷静,我仔细对比了网站上正常的显示和小程序上的错误显示,发现带有”<” “>”两个字符的都出现了错误,再仔细看看其他正常显示的代码文本确定了是这个问题。第一步我先去最大的男性交友网站(GITHUB)看了这个开源项目的介绍,大致意思是他将网站html挨个的解析转化成json,拿到json之后就可以使用官方的小程序编程了,所以问题可能处在html转json这,有了切入点那就开干。等等,我好像还没学过小程序,妈蛋头疼,只能暂时丢下问题利用差不多两天时间去混混小程序
公众号【空名先生】

学习中….

两天后开始调试,找到了核心的解析方法html2json(html,bindName),打印下日志一看啊,果然”<” “>”成为了&lt和&gt,一瞅它里面的处理就是replace方法,呵呵,以为很简单?but,它里面替换使用的表达式有点牛啊没看懂,后来醒悟就是正则表达,唉一时不察浪费了时间。

问题2.图片不显示的问题

这个问题旧比较模糊了,暂时不知道原因,网站图片可以显示,但是小程序读取到的是<img src….> 这些代码,证明没有正确解析,我本来想仔细看看代码的实现,结果不经意的发现正常显示的图片又alt属性,不正常显示的就没有,我去站点后台给一个不正常显示的图片加上alt属性,哎?行了?666,操作有点骚,那就先放一放,需求解决就行。以后有机会再看吧。
公众号【空名先生】

赞(0) 打赏
转载请注明出处:芝麻粒儿博客芝麻粒儿 » WordPress对接小程序配置过程以及遇到的问题
分享到: 更多 (0)

评论 抢沙发

评论前必须登录!

 

觉得文章有用就打赏一下文章作者

支付宝扫一扫打赏

微信扫一扫打赏