cocoscreator使用protobuf(附帶轉換工具)

weixin_36393214發表於2020-10-16

需要的工具

安裝node.js nodejs地址

下載protobufjs protobufjs地址

操作

1.安裝protobufjs到全域性

npm install -g protobufjs

將模組安裝到全域性方便全域性使用protobufjs提供的pbjs命令列工具。

pbjs可以將proto原檔案轉換成json、js

pbts,用來將轉化後的js檔案轉為ts

[外鏈圖片轉存失敗,源站可能有防盜鏈機制,建議將圖片儲存下來直接上傳(img-4zDdprOE-1602825667393)(https://imgkr2.cn-bj.ufileos.com/92797e0f-1607-420a-a321-58044ce53b99.png?UCloudPublicKey=TOKEN_8d8b72be-579a-4e83-bfd0-5f6ce1546f13&Signature=pznnJYGzvssnAbKz70fYgLWfExo%253D&Expires=1602905095)]

2.把下載好的protobuf中這個資料夾下的protobuf.js檔案 把這個檔案拖到Creator工程中並且匯入為外掛

[外鏈圖片轉存失敗,源站可能有防盜鏈機制,建議將圖片儲存下來直接上傳(img-39CtGC8X-1602825602602)(https://imgkr2.cn-bj.ufileos.com/899bbd7b-fcde-4280-854d-54a221cc4f80.png?UCloudPublicKey=TOKEN_8d8b72be-579a-4e83-bfd0-5f6ce1546f13&Signature=xjuyV%252F5R9Ne0cJ%252FznHRVlnMXD%252Bw%253D&Expires=1602905430)]

3.建立.proto訊息檔案

package ntesgame;

message Register {
    required string userId = 1;
    repeated string deviceId = 2;
    option string userToken = 3;
}

ntesgame 是包名,轉換成js 或ts 後就是 名稱空間

Register 是 訊息結構

required 是 必須有的變數

4.在儲存proto檔案的目錄下開啟命令列執行如下命令

將檔案中所有的.proto檔案轉化為一個proto.js檔案)

pbjs -t static-module -w commonjs -o proto.js *.proto

將proto.js檔案 轉為 proto.d.t檔案
pbts -o proto.d.ts proto.js

5.protobuf設定為外掛後 修改proto.js中protobuf的引用

[外鏈圖片轉存失敗,源站可能有防盜鏈機制,建議將圖片儲存下來直接上傳(img-Qyrr0ggU-1602825602603)(https://imgkr2.cn-bj.ufileos.com/2bcf0463-3e69-4a4e-9edb-388b4ac43613.png?UCloudPublicKey=TOKEN_8d8b72be-579a-4e83-bfd0-5f6ce1546f13&Signature=c%252BMFZNK7eAXwtcG4TINgGC11WMg%253D&Expires=1602907008)]

6.然後把proto.js 或 proto.d.ts檔案放入專案程式碼目錄中 即可

7.測試

@ccclass
export default class NewClass extends cc.Component {


    // LIFE-CYCLE CALLBACKS:

    // onLoad () {}

    start () {
        let msg = ntesgame.ClientRegister.create({userId:"123",deviceId:"22",userToken:"ff"})
        let encode = ntesgame.ClientRegister.encode(msg).finish();
        console.log("編碼:",JSON.stringify(encode))
        this.scheduleOnce(()=>{
            let decode = ntesgame.ClientRegister.decode(encode)
            console.log("解碼:",JSON.stringify(decode))

        },3)
    }

    // update (dt) {}
}

測試結果:
[外鏈圖片轉存失敗,源站可能有防盜鏈機制,建議將圖片儲存下來直接上傳(img-oKRQpv4A-1602825602604)(https://imgkr2.cn-bj.ufileos.com/3d4021e0-0352-4ae1-8408-8868219af2fa.png?UCloudPublicKey=TOKEN_8d8b72be-579a-4e83-bfd0-5f6ce1546f13&Signature=GSDw1rl83%252FFYKcbrclZbgVOIjNo%253D&Expires=1602908186)]

福利: protobuf自動轉換工具

長按 下面二維碼 或者 搜尋 公眾號。亮亮同學TT 關注 併傳送 protobuf 獲取 自動轉換工具
在這裡插入圖片描述

往期精彩內容:

TS專案中使用全域性變數/物件

虛擬搖桿功能實現

無限滾動背景

子彈追蹤實現

技能cd效果實現

相關文章