通过 ajax 加载二进制 WebGL 模型的最佳方法？

Question

我一直在使用 WebGL 开发基于 Web 的 3D 应用程序。 在服务器端生成二进制 3D 模型，客户端使用 AJAX 下载该模型。模型可能非常大（> 200K），因此我想避免以文本格式发送它们。目前我使用以下代码来实现这一点：

stream = http.responseText; // results of ajax request
..... 
var len = stream.length;
var header_size = 4 + 4 + 4*2; 
var buf_sz = len + 16;
var buf = new ArrayBuffer(buf_sz);
var bytes = new Uint8Array(buf, 0, buf_sz);

for(i = 0; i < len; i++) {
    bytes[i] = stream.charCodeAt(i) & 0xff;
}
....    
// use these to initialize WebGL buffers
var verts = new Float32Array(buf, bytes_skip, n_verts*3);
var normals = new Float32Array(buf, bytes_skip + n_verts*12, n_verts*3);
var indices = new Uint16Array(buf, bytes_skip + n_verts*24, n_indices);
... 

而在服务器端，我使用 'charset=x-user-defined' 发送数据

换句话说，我基本上必须逐个字符地从“流”中复制数据来初始化数组缓冲区。我想知道是否有更好（更直接）的方法来做到这一点？也许直接从流中实例化arraybuffer ?..

ps。我知道还有 jDataView 库，但它基本上是一样的

Answer 1

执行类似于下面的代码 sn-p 的操作以将数据作为二进制数组获取（来自https://developer.mozilla.org/en/DOM/XMLHttpRequest/Using_XMLHttpRequest 的代码示例）：

var xhr = new XMLHttpRequest();  
xhr.open("GET", url, true);  
xhr.responseType = "arraybuffer";   
xhr.onload = function(e) {  
  var arraybuffer = xhr.response; // not responseText  
  /* ... */  
}  
xhr.send();