Unity render streaming communicates with unity through JS

Js The example of communication sending is in WebApp\client\public\videoplayer;
Corresponding C# Receiver case Unity Render Streaming The plug-in WebBrowserInput

JS Send part

videoplayer/js/main.js Example of button communication

    const elementBlueButton = document.createElement('button');
    elementBlueButton.id = "blueButton";
    elementBlueButton.innerHTML = "Light on";
    playerDiv.appendChild(elementBlueButton);
    elementBlueButton.addEventListener("click", function () {
    
      sendClickEvent(videoPlayer, 1);
    });

A case can only send one button Number ID
Go back to the source , stay js/register-events.js In the document sendClickEvent function

export function sendClickEvent(videoPlayer, elementId) {
    
  let data = new DataView(new ArrayBuffer(3));
  data.setUint8(0, InputEvent.ButtonClick);
  data.setInt16(1, elementId, true);
  videoPlayer && videoPlayer.sendMsg(data.buffer);
}

Core code

videoPlayer.sendMsg(data.buffer); //  This is a binary array sending function , Theoretically, any data can be sent .

data.setUint8(0, InputEvent.ButtonClick); //  The first field of the binary array is 1 Type mark of bytes 
data.setInt16(1, elementId, true); //  The data after the first byte is interpreted differently according to the label type definitions , Turn here to 2 Bytes of short type , For buttons id

View all communication types defined in the case

const InputEvent = {
    
  Keyboard: 0,
  Mouse: 1,
  MouseWheel: 2,
  Touch: 3,
  ButtonClick: 4,
  Gamepad: 5,//  The case defines 0-5 Mark , Corresponding to mouse, keyboard, game console , Communicate with buttons 
};

We add a new communication type for sending strings , Define the label as 6

  function sendMessage(videoPlayer, message) {
    
    function utf8FromStr(str) {
    
      var strUtf8 = unescape(encodeURIComponent(str)); // UTF8 Encode text to binary 
      var arr = new Uint8Array(strUtf8.length);
      for (var i = 0; i < strUtf8.length; ++i) {
    
        arr[i] = strUtf8.charCodeAt(i);
      }
      return arr;
    }
    message = " " + message; //  Leave a space as the first byte , Storage type label 6
    var buf = utf8FromStr(message);
    let data = new DataView(buf.buffer);
    data.setUint8(0, 6); //  Custom tag 6 Replace the first reserved space character 

    videoPlayer && videoPlayer.sendMsg(data.buffer); //  Send binary data string 
  }
  function sendJson(videoPlayer, json) {
     //  You can also send customized Json Format text data 
    sendMessage(videoPlayer, JSON.stringify(json));
  }

C# Receiving part

Unity Streaming Render Example WebBrowserInputChannelReceiver It's reception webRtc Data communication channel （channel）, Inherited from InputChannelReceiverBase class .WebBrowserInputChannelReceiver The tag type obtained through message registration is 4 Of ButtonClick event
Our goal is to customize the string （JSON） Communications , The default base class does not handle custom types .
Derive a new class from , Direct inheritance OnMessage Receive binary data stream function ,OnMessage The byte stream received is JS in sendMsg Binary raw data sent
The code is as follows ：

  public class DBBrowserInputChannelReceiver : WebBrowserInputChannelReceiver
  {
    
    public GameObject[] targets;
    protected override void OnMessage(byte[] bytes)
    {
    
      if (bytes.Length > 0)
      {
    
        int code = bytes[0]; //  The first byte is the communication type mark 
        if (code == 6) //  Our custom string communication type tag 
        {
    
          string message = System.Text.UTF8Encoding.UTF8.GetString(bytes, 1, bytes.Length - 1); //  Remove the first marked byte of the data stream , The remaining bytes pass UTF8 Encoding is converted back to string , Corresponding JS Of UTF8 Coding function unescape(encodeURIComponent(str))
          foreach (GameObject go in targets)
          {
    
            go.SendMessage("OnNetMessage", message); //  Pass the data through Unity Of SendMessage Send to processing node 
          }
          if (code <= 5)
          {
    
            base.OnMessage(bytes); //  Process default type messages through base classes 
          }
        }
      }
    }
  }