nodejs通过buffer传递数据到前端,前端通过arraybuffer接收数据
以后端传送threejs中的点阵数组为例:
后端:
let buffer = Buffer.alloc((points.length + 4) * 4) //points.length + 4:预留前四个数字为其他信息(比如两个数字为一组,或者三个数字为一组) //预留位置
buffer.writeFloatLE(1, 0)
buffer.writeFloatLE(2, 4)
buffer.writeFloatLE(3, 8)
buffer.writeFloatLE(4, 12) //buffer前四个数为信息
//point数据从第16位开始写入
for (let i = 0, len = points.length; i < len; i++) {
buffer.writeFloatLE(points[i], i * 4 + 16)
}
res.send(buffer)
let pointXhr = new XMLHttpRequest()
pointXhr.onreadystatechange = function () {
var DONE = pointXhr.DONE || 4;
if (pointXhr.readyState === DONE) {
let buffer = pointXhr.response
let bufferArray = new Float32Array(buffer);
for (var i = 0; i < buffer.length; ++i) {
bufferArray[i] = buffer[i];
}
let pointsArray = bufferArray.slice(4)
let points = []
//pointsArray 点阵从第5个开始(前四个数为其他信息)
for (let i = 0, l = pointsArray.length / 3; i < l; i++) {
points.push({
x: pointsArray[i * 3],
y: pointsArray[i * 3 + 1],
z: pointsArray[i * 3 + 2]
})
}
callback(points)
}
}
pointXhr.open("POST",url,true);
pointXhr.responseType = 'arraybuffer';
pointXhr.send(null);
let imageXhr = new XMLHttpRequest()
imageXhr.onreadystatechange = function () {
var DONE = imageXhr.DONE || 4;
if (imageXhr.readyState === DONE) {
if (imageXhr.response) {
let bufferArray = imageXhr.response
let uint8Array = new Uint8Array(bufferArray);
for (var i = 0; i < bufferArray.length; ++i) {
uint8Array[i] = bufferArray[i];
}
callback(uint8Array)
}
}
}
imageXhr.open("POST",url,true);
imageXhr.responseType = 'arraybuffer';
imageXhr.send(null);
nodejs通过buffer传递数据到前端,前端通过arraybuffer接收数据的更多相关文章
- vue 高级属性父组件provide向子组件发送数据,子组件通过inject接收数据
以前父组件向子组件中传值是通过props传值,子组件不能更改父组件中的值,但是可以通过从父组件中获取的值定义给自己的data值,这里父组件可以通过provide向子组件传递自己组件中的data值,子组 ...
- C# 解决串口接收数据不完整
方法1: 使 用缓存机制完成.首先通过定义一个成员变量List<byte> buffer = new List<byte> (4096);用来存放所有的数据,在接收函数里,通过 ...
- Linux/windows com串口 java 接收数据 并解析 web程序
1.首先应公司要求再 com 口本来使用 .net 由于 .net 适用 linux 太麻烦 改为java 准备工作 准备 RXTXconmm.jar(版本很重要) 因为版本问题我搞了一天. 主要讲述 ...
- STM32 串口USART DMA方式发送接收数据
硬件:stm32f103cbt6 软件:STM32F10x_StdPeriph_Lib_V3.5.0 文章目录 头文件 USART3_DR的地址 DMA的通道 DMA的中断 USART接收回调函数 头 ...
- 灵动微电子ARM Cortex M0 MM32F0010 UART1和UART2中断接收数据
灵动微电子ARM Cortex M0 MM32F0010 UART1和UART2中断接收数据 目录: 1.MM32F0010UART简介 2.MM32F0010UART特性 3.MM32F0010使用 ...
- MVC中利用ViewBag传递Json数据时的前端处理方法
用viewBag传递Json字符串到前端时,json字符串中的“会被转义为& quot,前端处理方法为@Html.Raw(Json.Encode(ViewBag.Data)),再用eval() ...
- 向.net后端发送请求获取数据,在前端动态填充表格
实现效果 实现步骤 通过Ajax请求的方式 1.在前端定义Table 2.通过Ajax向.net后端发送数据请求 3.在.net后端定义方法供前端调用,并返回所需的数据 4.通过构造字符串的方式,将后 ...
- Python Django CMDB项目实战之-2创建APP、建模(models.py)、数据库同步、高级URL、前端页面展示数据库中数据
基于之前的项目代码来编写 Python Django CMDB项目实战之-1如何开启一个Django-并设置base页index页文章页面 现在我们修改一个文章列表是从数据库中获取数据, 下面我们就需 ...
- 前端 SPA 单页应用数据统计解决方案 (ReactJS / VueJS)
前端 SPA 单页应用数据统计解决方案 (ReactJS / VueJS) 一.百度统计的代码: UV PV 统计方式可能存在问题 在 SPA 的前端项目中 数据统计,往往就是一个比较麻烦的事情,Re ...
随机推荐
- centos 相关
运行locate httpd.conf,提示-bash: locate: command not found错误.则需要安装mlocate软件包: yum install mlocate 搜索,提示l ...
- 移动 H5(PC Web)前端性能优化指南
原文地址https://zhuanlan.zhihu.com/p/25176904?utm_source=wechat_session&utm_medium=social&utm_me ...
- Hadoop HDFS的Shell操作实例
本文发表于本人博客. 我们知道HDFS是Hadoop的分布式文件系统,那既然是文件系统那最起码会有管理文件.文件夹之类的功能吧,这个类似我们的Windows操作系统一样的吧,创建.修改.删除.移动.复 ...
- react 修改循环列表的当前单个子项状态:思路 拿原始state数据更改,再做请求
handleLike(item,index){ var id = item.id; _ENV.post( _ENV.HOST+'/communion/video-up', {'user_id':loc ...
- P1122 最大子树和(树形dp)
P1122 最大子树和 大水题 随便找一个点做根,蓝后累计子树和. 子树和<0的话不取就行了 顺便找个最大值输出 end. #include<iostream> #include&l ...
- 20145315 《Java程序设计》第七周学习总结
20145315 <Java程序设计>第七周学习总结 教材学习内容总结 第十三章 时间与日期 13.1.1时间的度量 1.格林威治时间(GMT):参考太阳到达最高点,有时间误差. 2.世界 ...
- 2017-2018-1 Java小组-1623 第二周作业
2017-2018-1 Java小组-1623 第二周作业 关于游戏软件的问题 讨论结果 20162301张师瑜 20162305李昱兴 20162306陈是奇 20162308马平川 2016231 ...
- InstallShieldpro2015 使用教程
1.下载地址:http://pan.baidu.com/s/1pLDCh3H ,如果网盘链接失效,请联系我. 2.解压后双击 3.安装完毕后,运行InstallShieldpro2015,会出现如下提 ...
- luogu P1017 进制转换
感觉这个题 是真的恶心 本来单纯就递归写,发现好难 后来用数组记录 然后考虑 指数为 奇和偶数 分别 <0 和 > 进制的情况 其实 用进制数为3 大概讨论四种情况就可以了 由于最近就是在 ...
- splay入门教程
笔者一个数据结构的蒟蒻还是奇迹般的搞明白了splay的基本原理以及实现方法,所以写下这篇随笔希望能帮到像我当初一脸懵逼的人. 我们从二叉查找树开始说起: 二叉查找树是一棵二叉树,它满足这样一个性质:所 ...