微搭擴充套件開發四層體系
L1
低碼 JS 程式碼塊
前端互動與業務邏輯,含 $page $w $app 內建變數。
適用:欄位聯動 / 動態顯示 / 複雜校驗
L2
自定義元件
基於 React / Vue 開發,透過 CLI 打包釋出到元件庫。
適用:富文字編輯器 / 地圖 / 圖表 / 影片播放
L3
雲函式 SCF
Node.js / Python 後端函式,可被頁面 / 流程 / 定時任務呼叫。
適用:複雜業務規則 / 資料清洗 / 三方 API 組合
L4
自定義聯結器
把第三方 REST API 註冊為資料來源,在拖拽中直接使用。
適用:ERP / CRM / HR 系統對接
低碼 JS 程式碼塊示例
1. 動態審批路由(金額 ≥ 5 萬加 CFO)
// 事件:表單提交前 const amount = Number($w.amountInput.value || 0); const dept = await app.cloud.callFunction({ name: 'getManager', data: { userId: app.dataSources.user.openid, level: 1 } }); let approvers = [dept.data, 'finance_head_id']; if (amount >= 50000) approvers.push('cfo_id'); return { approverIds: approvers.filter(Boolean) };
2. 呼叫自定義聯結器查詢 ERP
// 事件:頁面載入 const res = await app.dataSources.ErpCustomer.wedaGetRecords({ filter: { where: { region: { $eq: '華東' } } }, pageSize: 50 }); $w.customerTable.setData(res.records); // 錯誤兜底 if (!res.records?.length) app.utils.toast('無資料');
騰訊雲原生整合矩陣
| 騰訊雲產品 | 整合方式 | 典型用途 |
|---|---|---|
| 雲資料庫 TDSQL-C / MongoDB | 資料來源直連 | 業務主資料讀寫 |
| 物件儲存 COS | 內建上傳元件 | 圖片 / 附件 / 大檔案 |
| 雲函式 SCF | 函式呼叫 | 後端業務 / 三方 API 組合 |
| API 閘道器 | 自定義聯結器 | 統一鑑權與限流 |
| 騰訊雲 BI | 圖表嵌入 | 複雜看板 / 駕駛艙 |
| 日誌服務 CLS | SCF 日誌投遞 | 集中檢索與告警 |
| 企業微信 開放 API | 聯結器 + JS-SDK | 組織架構 / 訊息 / 審批 |
| 微信小程式 | 一鍵釋出 | C 端觸達 / 掃碼 / 支付 |
多環境 & DevOps 最佳實踐
🧪 開發 / 測試 / 生產
使用微搭多環境隔離,配置變數分別指向不同資料庫與聯結器,避免生產資料汙染。
🧭 版本與灰度
支援版本快照與回滾,關鍵改動先灰度 10% 使用者,監控錯誤率後再全量。
📦 匯出與 Git
應用可匯出 zip 結構化檔案,配合 Git 做版本管理、Code Review 與分支合併。
📊 監控 & 告警
雲函式日誌 → CLS;執行指標 → 雲監控;錯誤率 / 延遲超閾值企微通知值班。
🔐 金鑰管理
第三方金鑰存入『環境變數』或騰訊雲 SSM 引數倉,嚴禁硬編碼進程式碼塊。
🧱 元件庫治理
企業私有元件庫分版本釋出,在應用中按 semver 引用,降級可一鍵回滾。