javascript - 通过 websockets 发送和接收颜色数组的最佳方式

Question

我需要控制很多 LED(为了好玩……不是工作)。

UI用 javascript 编写，每秒发送数据(颜色数组)大约 60 次。

led 驱动器是一个微 Controller ( ESP8266 )，使用 websocket library 在 c++ 中编程。使用 arduino IDE

LED 可寻址并通过单个引脚控制。关于数据传输 btw led 和微 Controller 的更多信息可以在 this 中阅读数据表。但我使用的是简化的 library驱动那些使用 i2s 的人所以 DMA 将 CPU 排除在外。

目前我正在向第一个 LED 发送一种颜色。颜色被转换为十六进制字符串以节省空间。

客户端

//javascript
websocket.send('#ff0000');

服务器

//c++
if(payload[0]=='#'){
 uint32_t rgb = (uint32_t) strtol((const char *) &payload[1], NULL, 16);
 pixels[1].R=((rgb >> 16) & 0xFF);
 pixels[1].G=((rgb >> 8) & 0xFF);
 pixels[1].B=((rgb >> 0) & 0xFF);
}

我的第一个猜测是发送一个像字符串一样的“十六进制”然后拆分它

"#ff0000ff0000ff0000"
//or
"#ff0000#ff0000#ff0000"

但我去聊天并收集了有关此问题的更多信息。人们建议我使用二进制或 ascii。这对我来说有点难，所以我需要一些例子。特别是对于 c++ 部分。我什至不确定 websocket 库是否能够正确处理 ascii 或二进制，然后将其重新转换回数字。

问题:

微 Controller 有各种限制。尤其是内存，还有传输速度和转换数据所需的时间。 最终颜色数组的字节数应该很小并且易于重新转换为 rgb 值。

发送和接收颜色数组的正确方法是什么？

---

各种库的选择是长期的研究:

• Arduino IDE:该芯片易于使用。大社区。
• Arduino esp8266 Websocket 库:显然是基于 Arduino IDE 的最快的库。
• ws2812b i2s:它使用 DMA 控制 LED，因此没有 CPU。
• JS 作为 UI:它适用于所有移动设备。免费。
• websockets:双向实时数据传输。它适用于所有移动设备。免费。

Answer 1

所有功劳归功于 enhzflep

我只是把它留在这里以记住它是如何工作的。

不需要 String.fromCharCode()，因为它是一个 Uint8Array，因此只需添加从 0 到 255 的单个颜色范围

要通过 websocket 发送二进制数据，只需传递 Uint8Array。缓冲区

javascript

创建并发送一个包含 16 个红色像素的数组。

var pixels=16,
a=new Uint8Array(pixels*3),
l=pixels*1;
while(l--){
 a[l*3]=255;//red
 a[l*3+1]=0;//green
 a[l*3+2]=0;//blue
}
ws.send(a.buffer);

C++

使用 i2s lib 设置接收到的负载中的所有像素和 ws lib

case WStype_BIN:
 uint8_t l=NUM_LEDS*1;
 while(l--){
  pixels[l].R=payload[l*3];
  pixels[l].G=payload[l*3+1];
  pixels[l].B=payload[l*3+2];
 }
 ledstrip.show(pixels);
break;

代码现在运行了一个多小时，没有任何卡顿，每 15 毫秒无线更新 16 个 LED。

对于所有其他代码/库，我在最多 15 分钟后出现内存和其他问题。使用一个 LED。

所以...谢谢enhzflep。