1. 首頁
  2. /
  3. 騰訊微搭
  4. /
  5. 開發者
👨‍💻
開發者 · 深度擴充套件與整合

騰訊微搭開發者學習路徑

面向工程師的微搭擴充套件開發全景:程式碼塊 / 自定義元件 / 雲函式 SCF / OpenAPI / 自定義聯結器 / 企業微信 API / 小程式深度擴充套件 / 騰訊雲原生整合。

微搭擴充套件開發四層體系

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圖表嵌入複雜看板 / 駕駛艙
日誌服務 CLSSCF 日誌投遞集中檢索與告警
企業微信 開放 API聯結器 + JS-SDK組織架構 / 訊息 / 審批
微信小程式一鍵釋出C 端觸達 / 掃碼 / 支付

多環境 & DevOps 最佳實踐

🧪 開發 / 測試 / 生產

使用微搭多環境隔離,配置變數分別指向不同資料庫與聯結器,避免生產資料汙染。

🧭 版本與灰度

支援版本快照與回滾,關鍵改動先灰度 10% 使用者,監控錯誤率後再全量。

📦 匯出與 Git

應用可匯出 zip 結構化檔案,配合 Git 做版本管理、Code Review 與分支合併。

📊 監控 & 告警

雲函式日誌 → CLS;執行指標 → 雲監控;錯誤率 / 延遲超閾值企微通知值班。

🔐 金鑰管理

第三方金鑰存入『環境變數』或騰訊雲 SSM 引數倉,嚴禁硬編碼進程式碼塊。

🧱 元件庫治理

企業私有元件庫分版本釋出,在應用中按 semver 引用,降級可一鍵回滾。