說在前面

• 操作系統(tǒng)：Windows11
• node版本：v18.19.0
• typescript flatbuffer版本：24.3.25

場景

• 服務(wù)器(本文為golang+gin)與前端通信時使用flatbuffer進(jìn)行序列化與反序列化
• 通信協(xié)議為websocket

fbs

• 測試使用的flatbuffer schema如下：

  namespace fbs;enum Command:int32 {None        = 0,Mesh        = 1,PhysXml     = 2,
  }table MsgWebsocket {cmd:    Command;data:   [ubyte];
  }
  

  相對比較簡單，唯一復(fù)雜的地方在于使用了一個byte數(shù)組

• 獲取flatc
  在github release頁面下載對應(yīng)版本的二進(jìn)制程序，這里下載了windows版本的
  
  解壓后得到flatc.exe

• 生成golang代碼

  bin\flatc.exe -g ws.fbs 
  # bin\flatc.exe -g -o ..\ ws.fbs
  # -o 制定生成目錄 
  

• 生成typescript代碼

  bin\flatc.exe --ts ws.fbs 
  

服務(wù)器代碼

• 反序列化前端發(fā)來的數(shù)據(jù)：

  func handleFbMsg(p []byte, ws *websocket.Conn) {// GetRootAsMsgWebsocket為生成的函數(shù)，用于解析二進(jìn)制數(shù)據(jù)msg := fbs.GetRootAsMsgWebsocket(p, 0)switch msg.Cmd() {case fbs.CommandMesh:mesh, err := os.ReadFile("./a.bin")if err == nil {ws.WriteMessage(websocket.BinaryMessage, buildByteFbMsg(msg.Cmd(), mesh))} else {fmt.Println(err)}case fbs.CommandPhysXml:}
  }
  

• 序列化要發(fā)給前端的數(shù)據(jù)：

  func buildByteFbMsg(cmd fbs.Command, b []byte) []byte {builder := flatbuffers.NewBuilder(len(b) + 4)off := builder.CreateByteVector(b)// startfbs.MsgWebsocketStart(builder)fbs.MsgWebsocketAddCmd(builder, cmd)fbs.MsgWebsocketAddData(builder, off)// endend := fbs.MsgWebsocketEnd(builder)builder.Finish(end)nb := builder.FinishedBytes()return nb
  }
  

  flatbuffer的序列化過程比較復(fù)雜，具體的例子可以參考官方文檔

前端typescript代碼

• 反序列化，代碼和后端類似：

  private handleSceneMsg(data: any) {var buffer = new ByteBuffer(new Uint8Array(data.data))var msg = MsgWebsocket.getRootAsMsgWebsocket(buffer)switch (msg.cmd()) {case Command.Mesh:breakcase Command.PhysXml:break}
  }
  

• 序列化：

  public ok(cmd: Command) {const builder = new flatbuffers.Builder(0)MsgWebsocket.startMsgWebsocket(builder)MsgWebsocket.addCmd(builder, cmd)const end = MsgWebsocket.endMsgWebsocket(builder)builder.finish(end)const data = builder.asUint8Array()this._socket.send(data)
  }
  

問題

• 如何序列化？
  參考官方文檔，說實在的，fb的序列化是目前見過最麻煩的了，其他大部分都是一個函數(shù)搞定
• 前端反序列化出錯

  var buffer = new ByteBuffer(data.data)
  

  最開始是這行代碼，data是websocket的事件，data.data實際上是arraybuffer，需要轉(zhuǎn)換一下，

  var buffer = new ByteBuffer(new Uint8Array(data.data))