距離上次更新已經一個月了,這期間對WordPress版微信小程序 作的很多小的更新和性能的優化,這次版本更新推出了兩個比較重點的功能:點贊和讚揚。同時,優化了文章頁面的功能佈局,在評論區把經常使用的功能:轉發,複製,點贊,讚揚,都集中在一個操做面板,同時爲了避免佔用文章頁面的空間,作了隱藏。php
WordPress版微信小程序開放源碼地址:https://github.com/iamxjb/win...git
瞭解程序的開發歷程及開發技術,建議看看相關版本的更新文章:github
1.用微信小程序鏈接WordPress網站小程序
2.WordPress版微信小程序1.5版本發佈微信小程序
3.WordPress版微信小程序2.0版本發佈api
4.利用WordPress REST API 開發微信小程序從入門到放棄微信
5.WordPress版微信小程序2.1.5版發佈app
6.WordPress版微信小程序2.1.8版發佈wordpress
WordPress版微信小程序開發系列(一):WordPress REST API佈局
8.WordPress版微信小程序2.2.0版發佈
對於WordPress版微信小程序的開發過程當中,我最大的感覺是難度不是小程序的開發,是wordpress定製化的開發,特別是把定製化的配置須要在插件裏完成,對像我這樣wordpress的插件開發小白開發者來講,難度是可想而知的。整個功能的開發,wordpress插件的開發佔用了80%的工做量。所以,在此次讚揚功能開發中,我放棄使用插件的方式,大大下降了開發和調試的難度,插件開發最大的問題是調試麻煩,出現代碼bug也難於發現。
掃描如下二維碼,打開小程序
下面介紹WordPress版微信小程序2.2.8版本主要更新內容
1.配置文件結構更新
考慮到不少人使用微信小程序的時候不知道在那裏修改配置文件,致使程序沒法運行,這次更新在utils文件夾下增長了config.js文件,代碼以下:
//配置域名
var DOMAIN = 「www.watch-life.net「;
export default {
getDomain: DOMAIN
}
只要把域名修改成你網站的域名便可,無需再修改其它地方,小程序就能夠運行起來了。
2.評論區集成功能按鈕
考慮到文章頁面的附加不少,好比:點贊、複製、轉發、讚揚,評論,返回首頁等,因而在這個版本里,我把這些功能集中在評論區,考慮到這些功能按鈕數量比較多,把使用頻率最高的評論和返回首頁顯示在評論面板上,而把使用頻率相對較低的點贊、複製、轉發、讚揚隱藏在評論面板下方,經過「+」號圖標觸發顯示。以下圖所示: 可能這些功能使用路徑有些深,不過我人以爲對於資訊類的小程序來講,主要是看文章,其餘的功能都是錦上添花,但願不要由於錦上添花的功能影響了文章的閱讀。
3.點贊
這個功能是實現並不複雜,用戶在點擊「點贊」圖標後,在wordpress後臺記錄用戶的openid和點贊記錄,考慮到點贊是和文章的id關聯的,我把點讚的記錄保存在wordpress 的postmeta表裏。由於須要獲取用的微信openid,所以須要經過小程序的appid和AppSecret來獲取微信用戶信息。 基於此,我調整了插件程序wp-rest-api-for-app,須要在wordpress 後臺管理配置appid和AppSecret,具體配置在wordpress後臺管理的設置菜單裏面,找到「微信小程序設置」菜單,點擊進入後,以下圖所示:
WordPress插件地址:https://github.com/iamxjb/wp-...
小程序要正常運行,必須安裝這個插件,同時這個插件目前尚未提交到官方,安裝須要上傳文件夾到wordpress的插件目錄進行安裝啓用,不要上傳壓縮文件去安裝。
4.讚揚
支付的功能自己並不複雜,官方文檔描述的也很清晰,但考慮程序是開源,我原來的設想是把相關配置信息和支付功能結合到wordpress插件裏,這樣使用程序的人只要安裝插件就可使用,但寫插件的過程很是不順利,折騰了幾乎一週的時間,發現還有不少坑,因而就放棄了,搞成插件付出的時間成本太大了。
讚揚利用了認證的微信小程序的支付功能。讚揚功能的服務端php程序我是在官方的微信公衆號的微信支付demo基礎上修改完成的。微信公衆號的微信支付官方demo地址:https://pay.weixin.qq.com/wik...
讚揚功能必須配合使用這個支付的服務端php程序,該程序我也開源了,開源的地址:
weixin-app-wxpay程序地址:https://github.com/iamxjb/wei...
安裝的方法:
一、程序wp-wxpay目錄須要放置在網站的根目錄。程序的wp-wxpay目錄是一級目錄,目錄結構以下:
├── wp-wxpay
├──────lib
├──────────WxPay.Api.php
├──────────WxPay.Config.php(配置文件)
├──────────WxPay.Data.php
├──────────WxPay.Exception.php
├──────────WxPay.Notify.php
├──────logs
├──────pay
├──────────app.php (微信小程序調用讚揚調用程序)
├──────────log.php
├──────────notify.php
├──────────WxPay.JsApiPay.php
二、修改lib目錄下的WxPay.Config.php相關配置
const APPID = ‘wx’; (小程序appid)
const MCHID = ‘*’; (微信支付商戶號)
const KEY = ‘’; (商戶支付密鑰)
const NOTIFY_URL=’https://...’; (支付回調地址,修改域名便可)
const BODY =’守望軒Live’; (消息體的內容,自行隨便給定)
商戶支付密鑰的獲取參見微信支付官方文檔:https://pay.weixin.qq.com/ind...
修改後,小程序就會調用這個支付程序完成讚揚功能。經過這個讚揚功能的開發,讓我對公衆號(包括小程序)的微信支付的流程,有了大體的瞭解
wordpress版微信小程序到目前版本,基本功能都已經完善,在整個開發過程當中,對小程序的整個開發流程和核心功能有了比較深刻的瞭解,也愈來愈對小程序的將來發展充滿信心。