如何五分鐘使用 Cocos Creator 快速部署 TON 遊戲（第一部分）

avatar
鏈捕手
08-30

TON 生態在遊戲賽道的火熱，吸引了大量的開發者湧入其中，但從技術角度看， EVM 兼容性以及開發語言等方面的問題，基於 TON 底層建立遊戲應用對於很多開發者而言仍舊存在較高的門檻。而 Zypher Network 作為目前最先進的區塊鏈遊戲開發引擎，支持將 Web2 遊戲拓展為 dApp ，開發了大量插件，支持開發者基於 CocosCreator 開發的遊戲能夠快速部署在 Telegram 生態中，大幅降低開發者基於 TON 網絡開發遊戲的門檻。

開發者文檔：https://docs.zypher.network/blog/cocos-tg/

鏈上游戲領域的新熱土： TON 生態

TON （ The Open Network ）正在成為近期最熱門的公鏈之一，通過與背靠 9 億用戶的社交平臺 Telegram 深度的綁定在短期內吸引了大量的注意力。基於 TON 底層開發者的應用能夠以“小程序”的方式無縫集成在 Telegram 中，用戶可以直接以 Telegram 為入口訪問、使用各類 TON 生態的 dAPPs ，大幅降低了用戶的觸達門檻。

從現階段看， TON 生態正在成為鏈上小遊戲的新熱土，除了開發成本低廉外、 TON 鏈整體交易成本低廉外，鏈上游戲可以充分利用 Telegram 龐大的流量池來進行用戶轉換和裂變，並且中的 Telegram “小程序應用” 天然的可以和遊戲產品結合，豐富擴展功能，無縫的支持數據存儲、互動遊戲以及交易支付。基於此，鏈上游戲項目可以利用這些功能，提供多樣化的遊戲玩法和經濟模式。

事實上一些小遊戲的火爆也對上述觀點有所印證，比如基於 Telegram 的點擊遊戲的風靡，熱門的代表 Notcoin ，通過獎勵用戶點擊屏幕的方式吸引了超 3500 萬用戶， Hamster Kombat 則公開用戶數據稱其累計用戶已達 2 億。以貓為主題的任務類小遊戲 Catizen ，已有超過 2000 萬的用戶，付費用戶超過 50 萬，甚至 Notcoin 的仿盤 Yescoin 的訂閱關注者都已經早早突破了 600 萬用戶。

而鏈上小遊戲與 TON 生態之間也是相互成就，從用戶數據看，自 2024 年年初以來，在系列熱門小遊戲的帶動下 TON 生態異軍突起，截止 8 月中旬已激活的鏈上錢包超過了 1200 萬個（1 月份數據約 100 萬個），每月活躍錢包數量為 420 萬個（1 月份約 30 萬個）。

目前， TON 生態也吸引了大量的 Web2 、 Web3 遊戲開發者湧入其中，並期望從龐大的注意力體系中捕獲到早期的紅利。

TON 網絡的技術壁壘

事實上， TON 使用的是一種名為 TVM （ TON Virtual Machine ）的虛擬機，它支持的智能合約編程語言主要是 Fun C 和 TVM 指令集（儘管 Fun C 看起來很像 C 語言，但一般不為人所知或推崇），這些語言和虛擬機架構與以太坊的 EVM 以及 Solidity 編程語言有較大不同。與此同時， TON 的設計包括了多線程區塊鏈架構，允許不同的分片鏈並行運行。這種架構的設計可以提升網絡性能，但也增加了開發的複雜性。開發者需要理解如何在多個分片之間有效協調數據和邏輯，這比傳統的單鏈架構更具挑戰性。

所以說無論是對於 Web2 開發者還是 Web3 開發者，面對 TON 底層或多或少的都會面臨一定的開發門檻。

Zypher Network

Zypher Network  是以零知識證明技術為核心的新一代遊戲引擎方案，其能夠幫助開發者更易進入到區塊鏈領域，並以模塊化、可插拔化的方式，對鏈上功能進行深入的拓展，以大幅降低開發者構建區塊鏈遊戲時的門檻。同時 Zypher Network 在現有鏈上設施的基礎上，進一步構建一套能夠服務於鏈遊的底層遊戲設施，併為遊戲的去中心化運行提供完美的支持。

現階段， Zypher Network 推出了一個服務於開發者的 Services SDK 工具包，開發者可以以插拔化的方式直接利用“固有”的零知識功能進行開發，如 Shuffle 、 Rollup 等，而無需瞭解零知識電路的複雜性。這種用戶友好的方法可以立即實施，極大地簡化了開發過程。同時，該工具包提供了各種小工具和電路，開發者可以以最小的編碼工作量“組裝”，類似於用樂高積木搭建。模塊化方法使得可以創建定製的電路邏輯以滿足特定要求。開發者可以從基本操作開始，逐漸構建更復雜的邏輯以滿足其需求。

此外，為了對絕大多數鏈標準進行適配，對於遊戲邏輯編寫，該框架還進一步支持了第三方領域特定語言（ DSL ）和零知識虛擬機（ ZKVM ），並提供針對這些系統定製的鏈上驗證 SDK ，以提供更多的靈活性和定製選項。

基於上述開發工具包，開發者能夠基於其熟悉的語言在不同的鏈上低門檻的部署應用，並基於 Zypher Network 的 zk 技術方案保證遊戲高效、低成本運行，一些 Web2 遊戲甚至能夠基於引擎直接拓展為 dApps 並部署至鏈上。

與此同時為了提供用戶產品級別的  zk 體驗 ， Zypher 推出了一個以代幣“質押”為核心的經濟模型，即玩家以及鏈上驗證（網絡礦工）可以通過質押 Zypher 代幣來從網絡中捕獲資源。

  • 從礦工的角度看， Zypher Network 網絡會為其委派 zkp 任務（幫助網絡中的遊戲進行零知識驗證並上傳至對應的鏈上），完成零知識驗證工作將會獲得獎勵。礦工質押 Zypher 代幣越多，並行處理零知識任務的能力越強，且單次任務所獲得的獎勵越高。
  • 從玩家愛的角度看，通過質押 Zypher 代幣，可以免費參與到優質的鏈上游戲中，質押代幣越多，遊戲的證明生成度越快、遊戲體驗越好，且可能領取到的獎勵更多。

基於賦有激勵的質押經濟模型，調動了更多的驗證者參與到網絡的運行中，進一步提升了網絡運行的效率，而玩家也能因質押所提供的激勵加成，積極的參與到不同的遊戲中，為優質的遊戲規模性的捕獲活躍用戶。

目前， Zypher Network 已經能夠支持開發者使用 Cocos Creator 開發遊戲，並快速部署到 TON 鏈上，以下為部署教程的第一個部分，即如何將基於 Cocos Creator 開發的遊戲迅速部署到 Telegram 上。

新手指南：五分鐘迅速用 Cocos Creator 部署 TON 遊戲（第一部分）

一、瞭解 Cocoscreator

官方網站

文檔地址

  • Cocos Creator 文檔: https://docs.cocos.com/creator/manual/en/
  • Cocos Creator API 參考: https://docs.cocos.com/creator/api/en/

論壇地址

  • Cocos 官方論壇: https://forum.cocos.org/

二、 Cocoscreator 版本簡介（1. x 基本用不了，大部分都是2. x ,3. x 3d 遊戲比較多）

Cocos Creator 是一個完整的遊戲開發解決方案，提供了一個集成的開發環境，支持 2D 和 3D 遊戲開發。 Cocos Creator 採用組件化和數據驅動的工作流，簡化了遊戲開發的複雜性。它基於 Cocos 2 d - x 引擎，並且具備強大的擴展性和靈活性。

主要特點包括：

  • 組件化設計：開發者可以通過拖拽組件來快速構建遊戲邏輯。
  • 跨平臺支持：支持導出到多個平臺，包括 Web 、 iOS 、 Android 、 Windows 、 Mac 等。
  • 豐富的編輯工具：提供了場景編輯器、動畫編輯器、粒子編輯器、代碼編輯器等。
  • 腳本支持：主要使用 JavaScript 和 TypeScript 編寫遊戲邏輯。

Cocos Creator 主要版本及其區別

Cocos Creator 1.x 系列

Cocos Creator 1. x 是 Cocos Creator 的最早版本，主要特點包括：

  • 基本功能：基礎的場景編輯、組件系統、動畫編輯器。
  • JavaScript 支持：主要使用 JavaScript 作為腳本語言。
  • 基礎插件系統：允許開發者擴展編輯器功能。
  • Web 和原生平臺支持：可以導出到 Web 和原生平臺（ iOS 和 Android ）。

Cocos Creator 2.x 系列

Cocos Creator 2. x 系列引入了許多改進和新特性：

  • 性能優化：提升了引擎性能，特別是在移動設備上的表現。
  • TypeScript 支持：引入了 TypeScript 支持，增強了代碼的可維護性和類型安全。
  • 物理引擎集成：內置了 Box2 D 和 Chipmunk 物理引擎，支持 2 D 物理效果。
  • 資源管理優化：改進了資源管理系統，使資源加載和管理更高效。
  • UI 系統增強：增強了 UI 組件和佈局系統，提供了更強大的 UI 編輯能力。

Cocos Creator 3.x 系列

Cocos Creator 3. x 系列是一個重大的版本更新，主要特性包括：

  • 3D 支持：全面支持 3D 遊戲開發，提供了豐富的 3D 功能和編輯器工具。
  • 統一的引擎架構：整合了 2D 和 3D 引擎，提供了一致的 API 和工作流。
  • 渲染引擎更新：引入了全新的渲染引擎，支持 PBR （基於物理的渲染）、全局光照、陰影等高級效果。
  • 增強的動畫系統：提供了更強大的動畫編輯和播放功能，支持複雜的動畫效果。
  • 優化的跨平臺支持：進一步優化了導出和發佈流程，支持更多的平臺和設備。
  • 編輯器增強：提供了更豐富的編輯器插件和擴展機制，增強了開發者的生產力。

三、啟動源碼項目（如果你買了一份源碼）具體細節看文檔

1. 安裝 Cocos Creator

如果你還沒有安裝 Cocos Creator，請前往 Cocos 官方網站下載並安裝最新版本。

2. 打開 Cocos Creator

安裝完成後，啟動 Cocos Creator 編輯器。

3. 打開項目

  1. 導入項目：
    • 在 Cocos Creator 啟動界面中，點擊 Open Project （打開項目）按鈕。
    • 瀏覽到你獲得的 Cocos Creator 項目的源碼文件夾，選擇該文件夾，然後點擊 Select Folder （選擇文件夾）。
  2. 檢查項目配置：
    • 項目成功打開後，檢查項目中的 assets 文件夾，確保所有資源文件都在正確的位置。
    • 檢查 Project -> Project Settings （項目設置），確保項目的分辨率和其他設置符合你的需求。

4. 運行項目

  1. 選擇場景：
    • 在 assets 文件夾中，找到你的主場景文件（通常是以 . fire  或 . scene  結尾的文件）。
    • 雙擊主場景文件，將其在編輯器中打開。
  2. 運行項目：
    • 點擊編輯器頂部的 Play 按鈕（綠色的三角形按鈕），在編輯器中預覽和運行項目。
    • 如果項目運行正常，你會在編輯器的遊戲窗口中看到遊戲畫面。

5. 構建和發佈項目到 Web Mobile

  1. 打開構建面板：
    • 在編輯器頂部菜單欄中，選擇 Project -> Build （構建）。
  2. 選擇平臺：
    • 在構建面板中，選擇 Web Mobile 作為目標平臺。
  3. 設置構建選項：
    • Build Path （構建路徑）：設置構建輸出的文件夾路徑。
    • Start Scene （啟動場景）：選擇遊戲啟動時加載的場景。
    • Main Bundle Compression Type （主包壓縮類型）：選擇壓縮類型（如 None, Zip, JPG等）。
    • Zip Compression Level （ Zip 壓縮級別）：如果選擇了 Zip壓縮類型，可以設置壓縮級別。
    • MD5 Cache ：啟用 MD5 緩存，給所有資源文件添加 MD5 哈希值，用於版本控制和緩存管理。
    • Source Maps ：生成 Source Maps 文件，便於調試。
    • Debug Mode （調試模式）：啟用調試模式，可以在發佈後的代碼中保留調試信息和日誌輸出。
    • Inline all Sprite Frames （內聯所有精靈幀）：將所有精靈幀內聯到一個文件中。
    • Merge all JSON Files （合併所有 JSON 文件）：將所有 JSON 文件合併到一個文件中。
  4. 構建項目：
    • 點擊 Build 按鈕開始構建項目。
    • 構建完成後，會在設置的構建路徑中生成構建輸出文件。
  5. 發佈項目：
    • 將生成的構建輸出文件上傳到一個支持 HTTPS 的服務器上，可以使用 GitHub Pages 、 Netlify 、 Vercel 或其他靜態網站託管服務。

6. 調試和優化

  1. 啟用 Source Maps ：
    • 在構建面板中啟用 Source Maps 選項，可以生成 Source Maps 文件，便於調試發佈後的代碼。
    • 發佈後，可以在瀏覽器的開發者工具中使用 Source Maps 調試代碼。
  2. 啟用 MD5 緩存：
    • 在構建面板中啟用 MD5 Cache 選項，給所有資源文件添加 MD5 哈希值。
    • 這樣可以確保用戶在更新遊戲時不會因為緩存問題而加載舊資源。
  3. 調試模式：
    • 在構建面板中啟用 Debug Mode 選項，保留調試信息和日誌輸出。
    • 在發佈過程中，如果需要調試，可以在構建面板中啟用此選項。

7. 測試項目

  1. 本地測試：
    • 在本地服務器上測試構建輸出文件，確保遊戲在不同瀏覽器上的表現和兼容性。
    • 可以使用 VS Code 的 Live Server 插件或其他本地服務器工具進行測試。
  2. 線上測試：
    • 將構建輸出文件上傳到服務器後，測試線上版本，確保所有功能正常運行。

通過這些步驟，你可以成功啟動和發佈一份 Cocos Creator 項目源碼到 Web 平臺，並瞭解調試模式、 MD5 緩存等發佈屬性的配置和使用。

四、以 Protect Trump 為示例，後端 go 部分代碼部署說明

Protect Trump 是 Zypher Network 與第三方合作開發團隊合作的小遊戲，該遊戲通過 Zypher Network 底層引擎部署在 TON 上。

1.新建一個新的場景，場景新建一個node，掛載腳本GameLanch.ts.
（我這裡還放了主界面的背景圖，讓提前點加載，可以不用放。）


2.GameLanch.ts.

 

在 UIConfig . ts 文件中配置頁面信息
使用 ui Manager 的接口控制 ui

uiManager . open ( UIID . UILoading );

3.tg數據獲取

在模版文件夾 build - teleplates / web - mobile / index . html 裡面添加引入

script  async src="https://telegram.org/js/telegram-web-app.js"> script >

在遊戲腳本里面也了相關的引入。方便調試模式使用

// 創建並插入 Telegram Web 應用 SDK 的腳本

    loadTelegramSDK () {

       // this . url . string = ' loadTelegramSDK '

        return   new   Promise (( resolve , reject ) => {

            if  ( window [' Telegram '] &&  window [' Telegram ']. WebApp ) {

               // Telegram SDK 已經加載

                console . log (' Telegram SDK 已經加載:', window [' Telegram ']);

                window [' Telegram ']. WebApp . ready ();

                resolve ();

                return ;

           }

            const   script  =  document . createElement (' script ');

            script . src  = ' https :// telegram . org / js / telegram - web - app . js ';

            script . onload  = () => {

                console . log (' SDK 加載成功:', window [' Telegram ']);

                window [' Telegram ']. WebApp . ready ();

               // SDK 加載成功

                resolve ();

           };

            script . on error  =  error  => {

                console . log (' SDK 加載失敗:', error );

               // SDK 加載失敗

                reject ( error );

           };

            document . head . appendChild ( script );

       });

   }

    processInitData () {

        const   initData  =  window [' Telegram ']?. WebApp ?. initData ;

        if  ( initData ) {

            const   searchParams  =  new   URLSearchParams ( initData );

            const   WebAppData  = {};

            for  ( const  [ key , value ] of   searchParams . entries ()) {

                WebAppData [ key ] =  value ;

           }

            console . log (' WebAppData :', WebAppData );

           // 獲取用戶信息

            const   user  =  window [' Telegram ']. WebApp . initDataUnsafe ;

            console . log (' User :', user );

           // this . WebAppData = WebAppData ;

           // 處理窗口大小變化

            window [' Telegram ']. WebApp . onEvent (' resize ', function  () {

               // 更新 UI

                console . log ('更新 UI :');

           });

            this . tgInitData  =  initData ;

       } else  {

            console . warn (' Telegram WebApp initData is not available .');

       }

   }

    async   initTelegram () {

        try  {

            await   this . loadTelegramSDK ();

            this . processInitData ();

       } catch  ( error ) {

            console . error (' Failed to load Telegram SDK :', error );

       }

   }

把獲取的 window [' Telegram ']?. WebApp ?. initData ;發給服務器進行校驗

4.簡單說下rank

給 rank 頁面添加 UIRank . ts 腳本
UIRank 繼承 UIView 類後就可以通過 uiManager 管理頁面

export default   class   UIRank   extends   UIView
//獲取排行榜數據
let ranksRes = await Http . getAllCoinsRank ( PlayerModel . inst . tgInitData );

        this . list . refreshData ( ranks );//顯示到組建

5.簡單說下reward

界面主要掛了 3 個腳本

UIReward . ts //頁面腳本主要控制獎勵和邀請列表兩個頁面
RewardTabCtrl . ts //控制獎勵和邀請顯示內容
InviteTabCtrl . ts //控制邀請列表的顯示

具體內容看腳本

分享代碼：

onCopy () {
        le t   l in k Url = PlayerModel . in s t . l in k ?. in vi t e _ l in k ;
        t his . t g _ l in k . s t r in g = l in k Url ;
       // 複製邀請鏈接到剪切板
        t his . copy T oClipboard ( l in k Url + "   Hey t he re ! I jus t found t his aweso me T elegram ga me called Pro t ec t T - RUMP ! Jo in me in defend in g T rump from various t hrea t s dur in g t he campaign . We can hire and t ra in bodyguards , comp le t e exci t in g missions , and t eam up wi t h friends t o keep T rump safe . Click now t o earn even more rewards ! �✨");
        uiManager . open (U I I D. CopySuccess );
   }

   on I nvi t e() {
        le t   l in k Url = PlayerModel . in s t . l in k ?. in vi t e _ l in k ;
       // 複製邀請鏈接到剪切板
        t his . copy T oClipboard ( l in k Url );
        t his .onShareBu t t o n Click ( l in k Url ,' Hey t he re ! I jus t found t his aweso me T elegram ga me called Pro t ec t T - RUMP ! Jo in me in defend in g T rump from various t hrea t s dur in g t he campaign . We can hire and t ra in bodyguards , comp le t e exci t in g missions , and t eam up wi t h friends t o keep T rump safe . Click now t o earn even more rewards ! �✨')
   }

   onShareBu t t o n Click ( url , t ex t = '') {
        cons t   share Url = ' h t t ps :// t . me / share / url ? url =' + encodeUR I Componen t ( url ) + '& t ex t =' + encodeUR I Componen t ( t ex t );
       w in dow. open ( share Url , '_ blank ');
   }

6.啟動頁修改，在模版裡面修改頁面的啟動頁。

主要修改 index . html 和 application . js

加了一個背景圖和進度條

7.發佈遊戲

https://docs.cocos.com/creator/3.8/manual/zh/editor/publish/publish-web.html

https://docs.cocos.com/creator/3.8/manual/zh/editor/publish/custom-project-build-template.html

參考這兩個文檔，目前手動發佈，後續可以命令行發佈，正式上線 md5 別忘了哦

五、 Protect Trump 後端 go 部分代碼說明

1.概述

Protect Trump 遊戲作為基於 Go 語言和 GORM 框架的後端應用，主要用於處理 Telegram Web 應用用戶的登錄、遊戲交互和獎勵領取等功能。應用通過多個 RESTful API 接口與前端進行通信，並使用 PostgreSQL 數據庫存儲和管理用戶數據、保鏢、增益效果（ Buff ）及獎勵信息。

2.目錄結構

.
├── handlers         # 處理 HTTP 請求的函數
├── middlewares      # 中間件，用於驗證 Telegram 的數據
├── models           # 數據庫模型定義
├── tasks            # 定時任務，如排行榜更新和清理任務
├── utils            # 工具函數，如提取 Telegram 用戶數據
└── main . go          # 應用程序的入口

3.環境配置

DB _ HOST = localhost
DB _ USER = your _ db _ user
DB _ PASSWORD = your _ db _ password
DB _ NAME = your _ db _ name
DB _ PORT =5432
DB _ SSLMODE = disable
DB _ TIMEZONE = Asia / Shanghai
TG _ BOT _ TOKEN = your _ telegram _ bot _ token
PORT =8080

4.數據庫配置與遷移

應用使用 GORM 進行數據庫操作，在啟動時會自動遷移以下數據模型：

  • User ：用戶信息，包括 Telegram ID 、用戶名、金幣等。
  • Bodyguard ：保鏢信息，關聯到用戶。
  • Buff ：增益效果（ Buff ），關聯到保鏢。
  • CoinRecord ：金幣記錄。
  • InvitedUser ：受邀請的用戶信息。

在 main . go  文件中，通過以下代碼連接並遷移數據庫：

dsn := " h os t =" + os . Geten v (" DB _ HOST ") +
    " user =" + os . Geten v (" DB _ USER ") +
    " password =" + os . Geten v (" DB _ PASSWORD ") +
    " db name =" + os . Geten v (" DB _ NAME ") +
    " port =" + os . Geten v (" DB _ PORT ") +
    " sslmode =" + os . Geten v (" DB _ SSLMODE ") +
    " TimeZone =" + os . Geten v (" DB _ TIMEZONE ")

db , err := gorm . Open (p os tgres. Open ( dsn ), & gorm . Config {})
if   err != nil  {
     log . Fatalf (" Failed to connect to the database : % v ", err )
}

db .Au to Migrate(& models . User {}, & models . Bodyguard {}, & models . Buff {}, & models . CoinRecord {}, & models .In v ited User {})

5.定時任務

應用程序包含兩個定時任務：

  1. 清理任務：每5分鐘運行一次，用於清理無效或過期的數據。
  2. 排行榜更新任務：每分鐘運行一次，用於更新用戶的金幣排行榜

tasks . StartCleanupTask ( db , time . Minute *5)
tasks . StartLeaderboardUpdateTask ( db , time . Minute *1)

6.中間件

1. AuthMiddleware

  • 描述：用於驗證請求中的 Telegram 初始化數據是否有效。
  • 參數：
    • next ：下一個處理程序
    • bot Token ： Telegram 機器人的 Token

func   AuthMiddle w a r e ( next http . Handle r Func , botToken st r ing ) http . Handle r Func  {
     r etu r n   func ( w http . ResponseW r ite r , r * http . Request ) {
         body , e r r := io . ReadAll ( r . Body )
         if  e r r != nil  {
             http .E r r o r ( w , "無效的請求體", http .StatusBad Request )
             r etu r n
        }
        defe r   r . Body . Close ()

        va r   r eq st r uct {
            Teleg r amInitData st r ing  ` json :"teleg r am_ init _ data "`
        }
         if  e r r := json .Unma r shal( body , & r eq); e r r != nil  {
             http .E r r o r ( w , "無效的請求體", http .StatusBad Request )
             r etu r n
        }

         if  !validateTeleg r amData( r eq.Teleg r amInitData, botToken ) {
             http .E r r o r ( w , "無效的 Teleg r am 數據", http .StatusUnautho r ized)
             r etu r n
        }

         r . Body = io .Nop Close r ( bytes .Ne w Buffe r ( body ))
         next .Se r veHTTP( w , r )
    }
}

六、創建 Telegram Bot 和 Web App 的詳細步驟

1.創建 Bot

  1. 搜索 BotFather
    • 打開 Telegram ，搜索 Bot Father ，這是 Telegram 官方的 Bot 管理工具。
  2. 啟動對話
    • 輸入 / start 來啟動與 BotFather 的對話。
  3. 新建 Bot
    • 輸入 / newbot 創建一個新的 Bot 。
  4. 輸入 Bot 名字
    • 選擇一個名字，輸入 protectRump 。
  5. 輸入 Bot 用戶名
    • 用戶名必須以 Bot 或 _ bot  結尾。例如：protectRump Bot 。
  6. 保存 Token
    • 創建成功後， BotFather 會生成一個 API Token 。記下這個 Token ，用於後續步驟。

2.創建 Web App

  1. 啟動 Web App 創建
    • 在 BotFather 中輸入 / newapp  來創建一個新的 Web App 。
  2. 選擇 Bot
    • 選擇你剛剛創建的 Bot ，例如 protectRump Bot 。
  3. 輸入 Web App 名字
    • 輸入你的 Web App 的名字。
    • description 修改 webapp 的描述。即 What can this bot do ?的內容
  4. 上傳圖片
    • 輸入一張 640*360 的圖片，作為 Web App 的圖標。
    • botpic 修改頭像
  5. 上傳 GIF
    • 輸入一個 GIF 文件。如果沒有，可以輸入 / empty 跳過此步驟。
  6. 輸入 Web App URL
    • 輸入你的遊戲地址，例如 https :// protect - rump . zypher . game /。
  7. 輸入短名
    • 取一個短名，用於 Web App 的鏈接，例如 protectRump 。
  8. 完成創建
    • 創建成功後，你會得到你的 Web App 鏈接，例如 me / protectRump Bot / protectRump 。

通過以上步驟，你已經成功創建了一個 Telegram Bot 和 Web App 。接下來，你可以在你的 Web App 中集成遊戲，並使用 Telegram 的 Web App 接口進行交互。

3.測試環境配置

https :// core . telegram . org / bots / webapps # us in g - bots - in - the - test - environment

（未完）

總結

Cocos Creator 作為目前主流的遊戲編輯器，正在被越來越多的開發者所採用。其強大的功能、開發者熟悉的變成呢過、靈活的開發環境以及廣泛的跨平臺支持，使得它在遊戲開發領域備受青睞。 Zypher Network 通過對 Cocos Creator 的兼容以及對 TON 網絡的整合，正在大幅降低遊戲開發者將應用部署、遷移至 TON 網絡中的門檻，將複雜的問題進一步簡化。並在遊戲成功部署後，基於零知識證明方案為遊戲更為流暢、低成本的運行提供支持。

而隨著 Zypher Network 向更多的鏈上生態拓展，其也將將成為 Web3 時代最重要的遊戲基建設施。

來源
免責聲明：以上內容僅為作者觀點，不代表Followin的任何立場，不構成與Followin相關的任何投資建議。
喜歡
收藏
評論
相關推薦