WordPress版微信小程序2.2.8版發布


距離上次更新已經一個月了,這期間對WordPress版微信小程序 做的不少小的更新和性能的優化,此次版本更新推出了兩個比較重點的功能:點贊和贊賞。同時,優化了文章頁面的功能布局,在評論區把常用的功能:轉發,復制,點贊,贊賞,都集中在一個操作面板,同時為了不占用文章頁面的空間,做了隱藏。

WordPress版微信小程序開放源碼地址:https://github.com/iamxjb/winxin-app-watch-life.net

了解程序的開發歷程及開發技術,建議看看相關版本的更新文章:

1.用微信小程序連接WordPress網站

2.WordPress版微信小程序1.5版本發布

3.WordPress版微信小程序2.0版本發布

4.利用WordPress REST API 開發微信小程序從入門到放棄

5.WordPress版微信小程序2.1.5版發布

6.WordPress版微信小程序2.1.8版發布

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 后台管理配置appidAppSecret,具體配置在wordpress后台管理的設置菜單里面,找到“微信小程序設置”菜單,點擊進入后,如下圖所示:

WordPress插件地址:https://github.com/iamxjb/wp-rest-api-for-app

小程序要正常運行,必須安裝這個插件,同時這個插件目前還沒有提交到官方,安裝需要上傳文件夾到wordpress的插件目錄進行安裝啟用,不要上傳壓縮文件去安裝。

4.贊賞

支付的功能本身並不復雜,官方文檔描述的也很清晰,但考慮程序是開源,我原來的設想是把相關配置信息和支付功能結合到wordpress插件里,這樣使用程序的人只要安裝插件就可以使用,但寫插件的過程非常不順利,折騰了幾乎一周的時間,發現還有很多坑,於是就放棄了,搞成插件付出的時間成本太大了。

贊賞利用了認證的微信小程序的支付功能。贊賞功能的服務端php程序我是在官方的微信公眾號的微信支付demo基礎上修改完成的。微信公眾號的微信支付官方demo地址:https://pay.weixin.qq.com/wiki/doc/api/jsapi.php?chapter=11_1

贊賞功能必須配合使用這個支付的服務端php程序,該程序我也開源了,開源的地址:

weixin-app-wxpay程序地址:https://github.com/iamxjb/weixin-app-wxpay

安裝的方法:

1、程序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

2、修改lib目錄下的WxPay.Config.php相關配置

const APPID = ‘wx************’;       (小程序appid)

const MCHID = ‘*********’;                (微信支付商戶號)

const KEY = ‘********’;                         (商戶支付密鑰)

const NOTIFY_URL=’https://******/wp-wxpay/pay/notify.php’;          (支付回調地址,修改域名即可)

const BODY =’守望軒Live’;               (消息體的內容,自行隨便給定)

商戶支付密鑰的獲取參見微信支付官方文檔:https://pay.weixin.qq.com/index.php/account/api_cert

修改后,小程序就會調用這個支付程序完成贊賞功能。通過這個贊賞功能的開發,讓我對公眾號(包括小程序)的微信支付的流程,有了大致的了解

注意:在使用小程序贊賞支付功能時候,小程序要申請微信支付,這個申請可以把小程序和已有的支付微信商戶關聯,也可以重新申請一個微信商戶,如果不做這個關聯,是無法支付成功。 

wordpress版微信小程序到目前版本,基本功能都已經完善,在整個開發過程中,對小程序的整個開發流程和核心功能有了比較深入的了解,也越來越對小程序的未來發展充滿信心。

 

----------------------------------------------------------------------------

歡迎關注我的網站和微信公眾號,文章會在我的網站和微信公眾號上同步發布。

本文首發鏈接:https://www.watch-life.net/wordpress/wordpress-weixin-2-2-8.html

我的網站:守望軒

微信公眾號名稱:守望軒

微信公眾號:iwatchlife

你也可以掃描或長按以下二維碼 


免責聲明!

本站轉載的文章為個人學習借鑒使用,本站對版權不負任何法律責任。如果侵犯了您的隱私權益,請聯系本站郵箱yoyou2525@163.com刪除。



 
粵ICP備18138465號   © 2018-2025 CODEPRJ.COM