跳至主要內容

開啟 MiniApp 與前端 SDK(web_app 按鈕、initData vs initDataUnsafe)

用 sendMessage 傳送 MiniApp 入口按鈕、載入 MPChat WebApp SDK,並正確讀取 initData 與 initDataUnsafe,附目前欄位支援範圍。

前端規則:讀取 initData(原始簽名字串)並發給後端驗證。initDataUnsafe 僅用於 UI 顯示,絕不能作為身分證明。


總覽

開啟 MiniApp 有兩種方式:sendMessage 的 web_app 按鈕,或直達連結。開啟後,MPChat SDK 同步暴露初始化資料。

傳送入口按鈕

{
  "chat_id": "12345",
  "text": "Open Demo MiniApp",
  "reply_markup": {
    "inline_keyboard": [[
      { "text": "Open", "web_app": { "url": "https://mini.example.com/demo" } }
    ]]
  }
}

請求體無需 miniapp_id;伺服端用 web_app.url 比對目前 Bot 的 MiniApp entryUrl(或把最後一段路徑當作 shortName)。

載入 SDK

<script src="https://mp.net/i/mpchat-web-app.js"></script>

const initData = window.MpChat.WebApp.initData;            // 簽名字串 -> 後端
const initDataUnsafe = window.MpChat.WebApp.initDataUnsafe; // 僅 UI,不可信

initData vs initDataUnsafe

資料

能否用於授權?

initData(原始簽名字串)

能——後端驗簽之後。

initDataUnsafe(解析物件)

不能——僅用於 UI 顯示。

欄位支援(目前階段)

  • 支援:initDatainitDataUnsafe 中:query_idauth_datehashchat_typestart_param,以及核心 user/chat 欄位。

  • 部分支援:initDataUnsafe 物件結構與 user/chat 子集。

  • 暫不支援:執行時中繼資料、視圖狀態、原生 UI 控件(BackButton/MainButton)、儲存/裝置 API,以及 sendDataopenLink、彈窗、掃碼等方法——不要依賴用戶端回流。

安全必做

  • 絕不把 bot token 寫進前端程式、WebView 儲存、URL、日誌或分析。

  • 把原始 initData 發到後端,驗簽後再信任任何欄位。

相關文章

僅當你的 MPChat 用戶端版本明確聲明支援時,才透過 window.MpChat.WebApp.call(name, params) 呼叫原生方法。

是否回答了您的問題?