前言

生活中使用微信小程序的場景越來越多，它實現(xiàn)了用戶對于應(yīng)用“觸手可及、用完即走”的理想需求。微信小程序的開發(fā)難度也低于APP的開發(fā)制作，使用它會更便利、低成本、高經(jīng)濟效益。

但是要完成一個小程序涉及到的技術(shù)棧比較多，要開發(fā)的模塊也很多。比如：

1. 微信小程序端的開發(fā)

2. 小程序與后端接口的開發(fā)

3. 后端管理系統(tǒng)的開發(fā)

等等

今天就來介紹下如何使用web 數(shù)據(jù)庫（此處以kintone平臺為例）+小程序進行整合，實現(xiàn)包括從用戶授權(quán)認證，到整個O2O系統(tǒng)的開發(fā)。

?

小程序開發(fā)

首先談?wù)勑〕绦虻膬?yōu)勢。它對于開發(fā)者友好，打破了平臺壁壘，安卓和ios，我們只需要開發(fā)一套代碼，就能在各種終端使用。用戶系統(tǒng)互通，都是依賴微信的生態(tài)。并且能獲得很多手機的開放能力，包括相機，音視頻等，來實現(xiàn)各種pc端無法實現(xiàn)的功能。

下面就來詳細說下從前后臺完整實現(xiàn)一個小程序需要做哪些。

1.小程序框架

小程序客戶端的開發(fā)主要是使用微信官方提供的開發(fā)框架，也可以使用第三方的開發(fā)框架，比如uniapp，taro等等。

那為什么要使用這些第三方框架呢？為了減少學(xué)習(xí)成本和開發(fā)成本！

因為我們的提供的服務(wù)往往是多終端的。比如說有小程序，有應(yīng)用app，有h5等。因為平臺不同，開發(fā)語言也會不同，如果這些全部交給獨立團隊進行開發(fā)，那成本將非常高。而三方框架就是為了解決這個問題。使用一套工具，一套代碼完成多端開發(fā)，多端部署。一個團隊就能搞定啦?。ɡ硐胫械模绻麡I(yè)務(wù)不太復(fù)雜，的確可以。）

uni-app 是使用 Vue.js 開發(fā)小程序的框架。市面上應(yīng)該有一大半的小程序是使用uniapp來進行開發(fā)的。當(dāng)然不僅是小程序，它還支持 H5、App 等多端開發(fā)。因為是基于 Vue.js的語法，加上國內(nèi)使用vue的程序猿非常多，所以這樣可以減少我們的學(xué)習(xí)成本。

taro是使用react來進行小程序開發(fā)的框架。同樣的，因為react也是非常流行的前端框架，所以也是非常棒的第三方開發(fā)框架。

至于大家傾向于哪種框架，大家可以評論告訴我們，哈哈。

2.單純小程序客戶端難以解決的問題

單純只依靠小程序客戶端，還是有很多問題需要面對。

1. 每次業(yè)務(wù)的修改代碼都需要發(fā)布一個版本。

   如果我們把業(yè)務(wù)的處理封裝成接口放在服務(wù)端后，只要接口的參數(shù)不變，我們都不需要進行小程序的重新發(fā)布。

2. 無法獲取一些微信的能力，比如授權(quán)獲取用戶手機號。

   這些都是需要在服務(wù)端先通過獲取access token，再去調(diào)用微信的api去獲取用戶手機。像這種請求，都是不可以在客戶端完成的?；蛘哒f是不安全，且受限的。同時像業(yè)務(wù)邏輯的處理之后的數(shù)據(jù)落地，也需要在服務(wù)端進行。

3. 客戶端的運算能力有限。

   一些計算型的業(yè)務(wù)放在服務(wù)端比如ocr識別，ai語言模型的調(diào)用等等，使用服務(wù)端強大的算力來解決，加快運算速度。

所以一個功能完整的小程序開發(fā)一般還是需要用到中間的小程序服務(wù)層的。

3.小程序服務(wù)端開發(fā)

服務(wù)端開發(fā)可以使用云原生的方式開發(fā)也可以使用自建服務(wù)器進行開發(fā)。

其中unicloud（也是uniapp這家公司的）它提供了一個叫服務(wù)空間的解決方案。就是一種云原生的開發(fā)方式。它依托云服務(wù)商提供了一套云端nodejs的運行時環(huán)境，還提供了對象存儲、mongodb數(shù)據(jù)庫、redis緩存數(shù)據(jù)庫等等。

然后云服務(wù)商你又可以自行選擇阿里云，騰訊云等。相當(dāng)于原本你需要一個個配置的服務(wù)幫你打包賣給你，然后又提供了完整的接口去連接這些云服務(wù)，從底層抹平了云服務(wù)廠商間的差異。

事實證明，這套下來還是省去了很多開發(fā)成本以及云原生開發(fā)的學(xué)習(xí)成本。當(dāng)然如果你想使用其他語言進行后端開發(fā)，比如java、python、php等，那你也可以使用騰訊的云托管，通過docker來進行部署。而uniapp+unicloud的開發(fā)相當(dāng)于你只使用js來實現(xiàn)全棧的開發(fā)。

?

kintone的角色

在小程序開發(fā)之前，我們需要先實現(xiàn)一個后臺系統(tǒng)，或者叫后端的開發(fā)。

拿kintone開發(fā)社區(qū)小程序舉例。我們的開發(fā)社區(qū)小程序做了“每日一題”、“活動報名”、“積分商城”等功能。 在這個系統(tǒng)中存儲的數(shù)據(jù)部分來自于用戶，還有部分數(shù)據(jù)則來自于系統(tǒng)本身的運營。比如系統(tǒng)運營人員通過后臺添加活動，添加的每日答題等等。

所以我們希望通過后端完成以下工作：

• 數(shù)據(jù)庫的設(shè)計

• 后臺管理系統(tǒng)

• api接口的開發(fā)（供云函數(shù)調(diào)用）

以此簡要說明下kintone的能力和定位。 我們逐個進行分析。

1. 首先是數(shù)據(jù)庫設(shè)計，我們需要根據(jù)業(yè)務(wù)需求，設(shè)計數(shù)據(jù)庫的結(jié)構(gòu)，kintone通過拖拽就能實現(xiàn)。數(shù)據(jù)庫中常見的外鍵，也能通過lookup實現(xiàn)。

2. 然后是后臺系統(tǒng)的開發(fā)，我們需要根據(jù)業(yè)務(wù)實現(xiàn)包括且不限于增刪改查等等這些功能。而在kintone中我們在通過拖拽生成應(yīng)用后，會自動實現(xiàn)增刪改查這些功能。其次是平臺自身能力。平臺系統(tǒng)本身也需要自己的用戶表，權(quán)限表等等來滿足運營人員的管理。

3. 最后是通過api提供對外開放的能力，kintone提供rest api接口，提供包括各種語言的sdk，包括js、java、python、php等。通過這個接口我們就借助云函數(shù)實現(xiàn)數(shù)據(jù)和小程序的雙向流動了。

傳統(tǒng)開發(fā)，需要開發(fā)的東西非常多，成本大大增加。而kintone不僅提供了上述能力，還提供了流程審批，數(shù)據(jù)統(tǒng)計等等附加值業(yè)務(wù)。

案例分析

下面我們以一個簡單的O2O系統(tǒng)的雛形為例，來講下小程序的開發(fā)。

1.登錄

小程序開發(fā)最基礎(chǔ)、通用的功能：登錄。做任何小程序想要識別用戶，第一步就是需要實現(xiàn)使用小程序登錄。也就是通過識別進入小程序的用戶。

如何實現(xiàn)識別用戶？

這部分包含2個部分：

• 小程序中用戶的唯一標(biāo)識 open id?

• 授權(quán)獲取用戶的手機號

open id是小程序中的用戶的唯一標(biāo)識。其實通過它就能實現(xiàn)用戶的自動識別與登錄。但是光有用戶的open id 往往是不夠的，為什么呢？因為很多時候我們的系統(tǒng)是多端的，而pc端無法獲取用戶小程序的open id，所以并不能用它來區(qū)別用戶，所以往往還需要通過授權(quán)獲取用戶手機號這種做法來區(qū)別用戶。

2.微信服務(wù)認證 access token

但是想要獲取手機號，光授權(quán)還不夠，還需要配合服務(wù)端進行一些開發(fā)才能實現(xiàn)。它需要先通過小程序的appId、appSecret來獲取微信服務(wù)的access token，然后通過access token令牌來調(diào)用api獲取用戶手機信息。

access token如何保存？

access token的過期時間一般是2小時，而且官方也建議大家在token有效期內(nèi)對這個access token進行緩存。所以一般的做法都是先存入redis，并且設(shè)置expire時間。每次要執(zhí)行微信的api前先在緩存中獲取token，如果不存在就先去獲取access token并且存入緩存中。

在unicloud的開發(fā)中，他們的服務(wù)空間提供了另一種方法，就是通過使用定期觸發(fā)器，在token過期的時間內(nèi)（比如說2小時）定時獲取token并且保存在redis中。這樣免去你在應(yīng)用邏輯中遇到token過期，再去取token的情況。節(jié)約請求時間。

當(dāng)然你也可以通過kintone來存儲token。（只需要設(shè)置過期時間，注意瀏覽權(quán)限）

3.授權(quán)能力

除了授權(quán)獲取手機號，通過用戶授權(quán)還能獲得更多能力。比如常見的用戶的地理信息、通訊地址、發(fā)票信息等。這些都可以通過授權(quán)方式來獲取。不過這里有些坑需要注意，授權(quán)的接口經(jīng)常會做調(diào)整，比如之前常用的獲取通過wx.getUserInfo獲取用戶頭像昵稱的能力現(xiàn)在在新創(chuàng)建的小程序中已經(jīng)無法使用了。

4.小程序客戶端與服務(wù)端之間的身份認證

我們不能每次發(fā)起請求就要跳一次登錄，所以需要將登錄狀態(tài)轉(zhuǎn)化為服務(wù)之間的身份認證。

小程序客戶端和小程序服務(wù)端的身份認證該如何去做呢？這塊可不是微信幫你做好的，需要你自己去做。

常見的身份認證方式還分兩種：

1. 一種是有狀態(tài)的身份認證，比如說session認證。
   session是需要在服務(wù)端保存的。會耗費服務(wù)端資源。

2. 還有一種是無狀態(tài)的身份認證。比如說jwt token。
   jwt token則是一種去中心化的認證。它通過非對稱加密來實現(xiàn)。所以不需要服務(wù)器。

這兩者區(qū)別今天就不做展開分析。因為比較復(fù)雜。今天我們就主要以jwt ?token認證來講講小程序如果使用它來做身份認證。

jwt 優(yōu)點很多，去中心化、無狀態(tài)、不需要服務(wù)端存儲，只需要每次請求都在頭部中帶上認證信息。不過他也有個缺點，token如果泄露，你無法讓他失效。

我們可以使用一些用戶的信息（用戶名）通過私鑰來生成jwt token，以后小程序端每次只要帶上這個token就能實現(xiàn)身份認證了。

具體我們通過微信官方的圖來做一個解釋說明

小程序登錄 | 微信開放文檔 (qq.com)

微信登錄的流程是通過wx.login()來獲取用戶的open_id，其中open_id就是你在這個小程序中的唯一用戶id，可以用它來識別用戶。

身份認證信息如何使用？

在小程序端，一些需要身份認證的畫面，發(fā)起請求時都會帶上token。然后在云函數(shù)端會對token校驗，如果校驗成功則去kintone發(fā)起rest api請求獲取數(shù)據(jù)。失敗，則返回報錯信息。

如果服務(wù)端不做認證的識別，那請求很容易被偽造。以一個業(yè)務(wù)請求舉例，比如參加活動、答題等請求。請求參數(shù)是用戶id、積分。那你只需要偽造這個請求，帶上這個用戶id和偽造一個很大的積分，如果服務(wù)端不加識別就接受，是不是這個用戶的積分就能被隨意篡改了？

5.refresh token 機制

此時我們發(fā)現(xiàn)只用access token來進行用戶身份認證會遇到一個問題。如果把token時間設(shè)置的過長，那就有token泄漏的風(fēng)險。而你又無法主動將客戶端的token失效。（除非服務(wù)端將jwt ?token持久化下來，然后主動讓他失效。但是存儲下來這就違背了jwt token去中心化、無狀態(tài)的設(shè)計初衷了）。但你將token時間設(shè)置的過短，則會出現(xiàn)用戶需要頻繁登錄的問題，影響用戶體驗。此時我們經(jīng)常會采用access ?token + refresh token的方式來進行驗證。具體是怎么做的呢？用一張圖來做解釋，其實這也是淘寶、京東這些客戶端如何實現(xiàn)永久登錄的一個方法。

此時，根據(jù)refresh token的失效時間，只要在失效時間段內(nèi)登錄，比如每周、每月登錄一次，就能換取新的access token和refresh token。這樣就實現(xiàn)了永遠登錄狀態(tài)。不需要重新登錄了。

最后是token的客戶端保存。我們需要用到手機端存儲storage。但是每次進入小程序，都需要從storage中取出token，然后將token放入全局狀態(tài)管理（vuex或pinia）。以便每個頁面都能判斷用戶登錄狀態(tài)。所以推薦使用小程序上的一個pinia持久化插件”pinia-plugin-unistorage”，通過它可以實現(xiàn)小程序初始化時會自動從storage中獲取，而數(shù)據(jù)更新時，又會自動同步到storage中。保持了數(shù)據(jù)在storage和pinia中的一致性。

6.小程序服務(wù)端框架

在小程序端向服務(wù)端發(fā)起請求時，服務(wù)端身份校驗的這部分代碼可以以中間件形式的方式進行開發(fā)。在小程序端也有類似koa的分層開發(fā)框架。（koa是nodejs端常用的web開發(fā)框架）比如uni-cloud-router，可以實現(xiàn)mvc方式進行開發(fā)，同時它也提供了中間件的方式，可以用它來實現(xiàn)用戶身份認證，權(quán)限校驗等功能。

7.簡單的O2O系統(tǒng)設(shè)計

剛才我們講了我已經(jīng)通過微信授權(quán)獲取到了用戶的手機號，同時也通過自己設(shè)計token實現(xiàn)了小程序端和服務(wù)端的認證連接，那接下來的就來設(shè)計一個實例，如何開發(fā)一個小程序來實現(xiàn)O2O功能。O2O大家應(yīng)該很熟悉，比如在抖音、大眾點評上進行團購、線上消費、生成二維碼、線下商家掃碼核銷買單等。今天我們拿類似的功能做類比。比如：

• 通過小程序進行線上報名參加學(xué)習(xí)會，報名后返回一個參會二維碼。

• 參會那天，工作人員可對此二維碼進行掃碼核銷。

• 核銷后，自動給此小程序賬號增加積分。

• 后期可以進行積分兌換獎品。

那我們分析下，要實現(xiàn)這樣的功能有哪些要做的，又有哪些注意點呢？

首先通過例圖來分析我們需要做什么？

8.kintone應(yīng)用構(gòu)建

接下來我們需要在kintone上進行應(yīng)用的設(shè)計，相當(dāng)于傳統(tǒng)開發(fā)中的數(shù)據(jù)庫設(shè)計：

1. ?用戶表：用來存儲小程序端授權(quán)登陸的用戶。?

2. 活動表：管理員可以通過增刪改查上線一些我們的學(xué)習(xí)會。 ?

3. 活動參與表：用戶的報名數(shù)據(jù)被記錄到這張表里。

4. 積分表：記錄用戶的積分。用戶報名成功，以及參加活動后后臺核銷成功都會更新積分。

5. 積分變更履歷表：來跟蹤用戶所有的積分變化。這樣出現(xiàn)程序問題或者惡意漏洞，被修改積分時，做到有跡可循。

其中活動參與表、積分表，都可以設(shè)計一個lookup字段來和用戶表進行微信openid的關(guān)聯(lián)。實現(xiàn)外鍵的關(guān)聯(lián)。

這幾張表通過簡單的拖拽就實現(xiàn)了。

?

?

小程序開發(fā)中常用插件及用法

更多代碼參考：微信小程序+kintone的開發(fā)實踐?

?文章來源地址http://www.zghlxwxcb.cn/news/detail-617944.html

到了這里，關(guān)于微信小程序+web數(shù)據(jù)庫的開發(fā)實踐的文章就介紹完了。如果您還想了解更多內(nèi)容，請在右上角搜索TOY模板網(wǎng)以前的文章或繼續(xù)瀏覽下面的相關(guān)文章，希望大家以后多多支持TOY模板網(wǎng)！