WordPress网站开发微信小程序实战教程系列第四部分详解-七爪网

WordPress网站开发微信小程序实战教程系列第四部分详解

现在这个数字化的时代，小程序给大众带来了不少方便。有个叫极客小程序的，宣称自己是“+微信小程序”的佼佼者，它的价值所在值得我们深入分析。它的一些新功能可能给用户和其他小程序开发者带来灵感，但也可能因为自封为最佳而引发一些争议。

v1.6版本的文章内链功能

极客小程序v1.6版本的一大亮点是支持文章内链的跳转功能。用户只需点击蓝色链接即可完成跳转。该功能采用的是wx.接口，而非其他接口。原因在于，其他接口在跳转时会保留原页面，导致用户连续点击多篇文章后可能出现无法响应的问题。相比之下，wx.接口在跳转时会关闭当前页面，并跳转到应用内的其他页面，而且首次点击内链时还会给出温馨的提示。

设计此功能充分体现了对用户使用感受的细致考虑。在用户阅读文章时，频繁点击内链是常见操作。若接口问题导致无法顺畅跳转，无疑会降低使用体验。对这类细节的关注，能有效增强用户对小程序的正面印象。

接口调用与用户鉴权

接口调用成功后，官方文档明确指出需要间隔5秒钟才能进行下一次调用。Jeff选择了等待5秒钟后再进行调用的做法。不过，小程序默认并未实施用户认证，这就意味着只要掌握了打开方法，任何人都可随意进入。缺乏用户认证，在数据安全和隐私保护上存在潜在风险。在一些重视安全措施或需保护用户隐私的场景中，这可能会带来问题。以企业内部使用的小程序为例，涉及商业机密信息时，若没有鉴权机制，就很容易出现信息泄露的隐患。

数据清理与优化

小程序会进行数据整理的工作。比如，它会清除不必要的data字段。在“极客”小程序首页，文章请求RestAPI之后，会更新文章内容，将原有属性设为null以释放空间。这样的操作能提升小程序的运行速度。如果不进行这样的数据整理，随着数据量的增加，小程序可能会变得不流畅，影响用户的使用体验。

同时，先前版本在文章发布日期旁边会标注阅读量，但并未实现与网站端的数据同步。这对那些需要统一数据管理的运营人员来说，无疑增加了统计工作的难度。

// https://devework.com/wordpress-weapp-4.html
// 设置置顶标题栏
setTimeout(() => {
	wx.setTopBarText({
		text: title
	});
}, 5000);

富文本组件的评价

极客小程序里的富文本组件（rech-text）目前尚有不足。它主要解决了HTML标签错误和提升了图片加载速度。但与其它组件相比，它还有差距。这个组件的表现对内容展示至关重要。一旦图片加载慢或标签出错，页面可能会混乱，影响阅读。以资讯小程序为例，若用户因组件问题无法正常浏览新闻，他们可能会放弃使用这个小程序。

// https://devework.com/wordpress-weapp-4.html
// toggle vconsole
let debugFlag = wx.getStorageSync('openDebug') || false;
console.log(debugFlag);
if (!debugFlag) {
	wx.setEnableDebug({
		enableDebug: true
	});
	wx.setStorage({
		key: "openDebug",
		data: true
	})
} else {
	wx.setEnableDebug({
		enableDebug: false,
		success: function (res) {
			console.log(res.data)
		}
	});
	wx.setStorage({
		key: "openDebug",
		data: false
	})
}

RESTAPI在升级后的变化

小程序更新至4.8版后，对RESTAPI进行了一些调整。比如，若请求的文章页码超过了总页数，系统会返回400错误代码，并提示“请求的页码超出总页数”。这一调整旨在优化数据请求的流程。在之前版本中，类似请求可能会导致错误或显示异常。

运营者和用户都深知这一点的重要性。设想用户想要寻找一篇详尽的深度文章，他们可能会频繁地翻阅页面，寻找目标。若缺乏明确的指引，他们可能会在搜索中浪费大量时间，甚至对小程序产生厌倦情绪。

// https://devework.com/wordpress-weapp-4.html
// 修复onReachBottom 多次执行的bug
onReachBottom() {
		let self = this;
		// 1s 内多次ReachBottom 话仅算一次
		//获取点击当前时间
		let curTime = Date.now();
		//上一次加载的时间
		let lastTime = this.data.lastLoadTime;
		console.log(lastTime, curTime, curTime - lastTime);
		if (curTime - lastTime < 1000) {
			console.log("不正常的加载间隔时间");
			return;
		}
		// ...
		// 其它功能代码
		// ...
	},