通过websocket将字节数组从c#发送到angular

Question

Hi I would like to implement a function that a byte array is sent from C# to my Angular 7 through websocket. Basically, I have a websocket running with C# and my frontend is written in Angular7.

Please note, the following example is a simplified one. In my real application, the object I am going to send includes about 400 fields. After serialise the object to json string, it is about 6kb. In addition, I need to send 30 such objects in about one second. Sending binary data will significantly reduce the package size and speed it up.

In C#, I have such example code to generate the payload of the websocket:

public class Test
{
    public int Id { get; set; }
    public float Value { get; set; }
    public string Description { get; set; }
}

public class Payload
{
    public object Obj { get; set; }
}

Test[] tests = new Test[]
{
    new Test
    {
         Id = 0,
         Value = 1.12f,
         Description = "The First Test"
    }
};


    byte[] testsByteArray;
    using (MemoryStream m = new MemoryStream())
    {
        using (BinaryWriter binaryWriter = new BinaryWriter(m))
        {
            foreach (Test test in tests)
            {
                binaryWriter.Write(test.Id);
                binaryWriter.Write(test.Value);
                binaryWriter.Write(test.Description);
            }
        }
    testsByteArray = m.ToArray();
}

Payload payload = new Payload
{
    Obj = testsByteArray
};

string a = JsonConvert.SerializeObject(payload);

Eventually I got a as {"Obj":"AAAAAClcjz8OVGhlIEZpcnN0IFRlc3Q="} I guess the value of Obj is base64 encoded value of testsByteArray .

Now, in my frontend, I can receive the json string. The question is how to convert AAAAAClcjz8OVGhlIEZpcnN0IFRlc3Q= back to an object with the same format as Test in Angular.

What I tried:

I tried to use the following function atob() to decode the base64, and then use the following function to convert the decoded string to byte array

str2ab(str): ArrayBuffer {
    var buf: ArrayBuffer = new ArrayBuffer(str.length * 2); // 2 bytes for each char
    var bufView = new Uint16Array(buf);
    for (var i = 0, strLen = str.length; i < strLen; i++) {
      bufView[i] = str.charCodeAt(i);
    }
    return buf;
}

Then I try to use the following code to get the values

let dataView = new DataView(arrayBuffer);
console.log(dataView.getInt32(0));  // = 0
console.log(dataView.getInt32(2));  // = 0
console.log(dataView.getInt32(4));  // = 0
console.log(dataView.getInt32(6));  // = 10496

I am not exactly sure how to convert to correct value. Can anyone help out.

Thank you

Answer 1

Sending binary data between different platforms and languages is fragile and difficult to get right. I'd suggest converting to a platform agnostic representation (such as a JSON array) before sending, and convert back on the other side.

For example,

string a = JsonConvert.SerializeObject(tests);