只需6步,教你從零開發一個簽到小程序

摘要:針對於具備瞬時流量、業務場景比較簡單的小程序,開發者藉助FunctionGraph,可以方便快捷的搭建一個健壯的小程序後臺。

本文分享自華爲雲社區《智慧校園想搞好,FunctionGraph少不了——從零開發簽到小程序so easy!》,作者: 一隻程序猿。

背景

華爲romalab實驗室在構建智慧教育領域app時,以FunctionGraph爲試點,嘗試基於FunctionGraph雲函數開發一個簽到小程序。針對於具備瞬時流量、業務場景比較簡單的小程序,開發者藉助FunctionGraph,可以方便快捷的搭建一個健壯的小程序後臺。

免登方案設計與前後端通信邏輯

方案概述

App在登錄以後,纔會打開小程序。如果小程序和app的用戶體系一致,用戶就不用再次登錄。在首次訪問小程序的時候,調用智慧校園app的免登接口,獲取用戶信息,然後小程序構建自己的登錄狀態。由於雲函數本身屬於無狀態的服務,需要藉助授權服務器(或者簽發jwt)實現自己的接口認證。

小程序在調用後臺業務接口時,攜帶票據。

交互流程圖

(注:智慧校園app是基於華爲內部的移動使能平臺OneMobile構建,此處的OneMobile就可以理解爲智慧校園app)

流程描述

流程描述:

  1. 打開簽到小程序,調用getToken()獲取ssoTikect票據信息
  2. 小程序將ssoTicket傳入到認證函數A中,在A中去調用智慧校園app的開放平臺接口,根據ssoTicket獲得當前的用戶信息
  3. 拿到用戶信息以後,根據該用戶信息,生成票據token ,返還給小程序

  1. 小程序調用業務函數B,在請求中攜帶token
  2. 業務函數B在拿到請求以後,校驗token、換取用戶信息
  3. 校驗通過,根據獲取的用戶信息,執行業務功能,返還結果

業務實現

角色權限管理策略

智慧校園app本身對小程序有着嚴格的權限控制體系,可以在用戶、組織、崗位等維度,對小程序的可見性進行控制。由於簽到打卡這個業務場景比較簡單,且人員有着明顯的角色特徵,老師設置簽到規則,學生掃碼進行簽到。

結合當前的現狀,此次簽到小程序不再單獨構建自己的權限管理體系,而是依託於智慧校園app本身的權限體系。提供兩個小程序,一個是教師使用的“教師上課點名”小程序,用於協助老師生成簽到二維碼。一個是“簽到打卡”小程序,用於學生上課簽到。由智慧校園app在入口處對小程序的使用者進行管控。

App掃碼簽到實現

如何簽到

簽到是通過掃描二維碼進行簽到,在掃碼的時候,將掃碼得到的信息,傳遞到後臺,後臺對二維碼中的課程信息與簽到規則進行比對後,返還簽到結果。小程序根據不同的簽到結果,給用戶展示不同的頁面。

如何掃碼

當前掃碼的入口有兩個,一個在小程序內部,一個在app的右上角。二者調用的都是系統的掃碼能力。

由於在app上掃碼能夠進入簽到小程序並進行簽到,就需要簽到二維碼不僅僅要攜帶課程信息,同時也要攜帶要打開小程序的信息。

如何實現掃碼進入小程序

智慧校園app的掃一掃能力,預製了一些通用的能力,當掃碼得到的結果是某一個固定類型的數據格式,就會自動完成一些操作。

如掃碼能識別打開小程序的數據格式爲:native://openapp?data={"appid":"88157779"},而打開小程序的能力,其實是封裝了jssdk的xm.openApp()的能力。xm.openApp()允許開發者能在一個小程序裏面打開另外一個小程序。

App掃碼簽到代碼實現流程圖

FunctionGraph實現簽到業務

開發函數支持多種語言類型,如nodejs、python、java等。後端邏輯中,除了普通業務邏輯(如跟數據庫交互)之外,最主要的是跟智慧校園app的交互,如獲取用戶信息。交互形式是接口調用,可以直接引用封裝好的客戶端來實現,以nodejs開發語言爲例,直接引入npm包即可。

開發後端函數邏輯

認證函數

App在登錄以後,纔會打開小程序。如果小程序和app的用戶體系一致,用戶就不用再次登錄。而小程序如何在不登錄的情況下想要拿到當前使用該App的用戶,就需要藉助app的接口,實現免登。認證函數的作用就是獲取當前app的使用者,並且能夠簽發小程序自己的自定義登錄狀態,如簽發一個jwt

認證函數的入參爲小程序前臺從app獲取到的ssoTicket。

具體實現如下:

1. 獲取智慧校園app的api調用SDK代碼,執行npm pack打包,生成OneMobileSDK-0.0.1.tgz, 在新項目中安裝該依賴npm install OneMobileSDK-0.0.1.tgz,然後將node-modules文件壓縮成zip,上傳到FunctionGraph的依賴倉庫中去。在創建函數時添加該依賴。

a.創建依賴包

b.上傳依賴文件

c.添加依賴

2. 參照步驟1,將mysql-node的依賴,加入到FG的依賴倉庫中去,在創建函數時添加該依賴。

3.調用OneMobileBaseSDK裏面的getUserInfoBySsoTicket(ssoTicket),獲取用戶信息

a.在代碼中引用SDK

b.調用接口

4. 校驗用戶信息。

5. 根據獲取到的用戶信息,生成業務接口的調用憑證,返還給小程序前臺。

簽到函數

關於簽到函數,在操作流程上面和認證函數相似,這裏不做過多的闡述。其主體的流程如下:

1. 創建函數時,添加mysql-node相關依賴

2. 校驗簽到信息

3. 將簽到結果入庫

4. 返還簽到結果給小程序

接口開放

函數開發完成以後,需要將函數開放給小程序使用,具體操作步驟如下。

1. 在函數詳情頁面,點擊觸發器頁籤

2.創建觸發器,觸發器類型選擇APIG。由於代碼中有認證邏輯,所以網關層不做認證

3.獲取創建的APIG調用地址,小程序前端即可根據業務需要,調用相應的rest接口。

總結

此次小程序開發識別到的問題

智慧校園app

  1. FullCode模式下,頁面的碎片化問題亟待解決,智慧校園app缺少頁面預覽工具以及通用的組件庫。
  2. 免登接口只能在容器中才能調用,而調試的時候部分接口強依賴ssoTicket,只能通過集成vconsole,然後在手機中執行getToken()指令纔可以獲取ssoTicket。
  3. 公司內部沒有調試環境,公網調測,每次都需要傳包到開放平臺,操作起來很麻煩。
  4. 文檔仍需補齊,一些非常規能力,如掃碼打開小程序功能,沒有相應的文檔支撐
  5. 缺少支撐一套前端調測多套環境的解決方案

FunctionGraph

  1. 代碼分佈在3個地方:前臺代碼由智慧校園app託管運行、網關api直接配置在APIG、函數代碼在Function裏。功能調試成功後,如果有一鍵歸檔(或者下載)功能或者下載工具會比較好。同樣,希望也有一鍵部署功能的工具。
  2. 當前加密配置粒度是單個函數,以連接數據庫爲例,多個函數連接同一個數據庫,需要在每個函數中都增加數據庫賬號密碼加密配置,繁瑣而且無法保證數據一致。

能力待提升

智慧校園app

  1. 參照微信,求助IDE團隊,爲提供小程序開發工具
  2. 參照welink爲開發者提供開放平臺的調測工具,並能一鍵生成不同語言的接口調用代碼
  3. 構建小程序專門的雲開發平臺,小程序流量走App基座的網關,打通各個雲服務,服務之間鑑權由開發平臺承接,小程序開發者更專注於業務能力構建。

FunctionGraph

  1. 能夠通過函數應用生命週期管理功能解決函數開發、部署、發佈(到APIG)一體化的問題
  2. 能夠實現用戶或租戶級別的配置共享

參考文檔:

https://support.huaweicloud.com/usermanual-romalab/lab_03_0001.html

https://www.huaweicloud.com/product/functiongraph.html

 

點擊關注,第一時間瞭解華爲雲新鮮技術~

發表評論
所有評論
還沒有人評論,想成為第一個評論的人麼? 請在上方評論欄輸入並且點擊發布.
相關文章