Javascript ByteBuffer到base64字符串不返回图像

时间:2016-06-22 12:59:03

标签: javascript html5 protocol-buffers intel-xdk protobuf.js

在英特尔XDK中制作HTML5应用,因此可以使用Javascript进行计算。

案例:从服务器获取(谷歌)protobuf消息。将其解析为对象。我们有一个图像,jpg。 Gonne把它放到了HTML中。嘿,您可以使用base64 ...在Android中完成此操作;在那里你可以使用BitmapFactory:

Bitmap bitmap = android.graphics.BitmapFactory.decodeStream(document.getDocBlob().newInput());

经过一些google-fu发现这样的事情:

var base64String = btoa(String.fromCharCode.apply(null, new Uint8Array(currentComment.Document.doc_blob.buffer)));

var ByteBuffer = ProtoBuf.ByteBuffer;
var base64String = ByteBuffer.btoa(currentComment.Document.doc_blob.buffer, currentComment.Document.doc_blob.littleEndian, currentComment.Document.doc_blob.noAssert);

以下是障碍:图片未显示:它显示损坏的链接图片。但是,当使用上述第一个函数时,不会抛出任何错误。我认为我出错的地方是抵消。数据结构如下所示:

buffer: ArrayBuffer
  byteLength: 148199
  __proto__: ArrayBuffer
limit: 69895
littleEndian: true
markedOffset: -1
noAssert: false
offset: 44278
view: DataView

HTML的设置是这样完成的,并且它可以使用其他base64字符串进行测试:

commentImage = document.getElementById("img-frame"); 
var source = "data:image/" + image_type + ";base64," + base64String;

commentImage.setAttribute("height", currentComment.Document.doc_height);
commentImage.setAttribute("width", currentComment.Document.doc_width);
commentImage.setAttribute("src", source);

1 个答案:

答案 0 :(得分:0)

这就是我们如何使它发挥作用:blob是整个blob,其中包含图像开始点和结束点。

选项A:正常btoa() - 更快

var base64StringA =  btoa(String.fromCharCode.apply(null, new Uint8Array(currentComment.Document.doc_blob.buffer.slice(currentComment.Document.doc_blob.offset,currentComment.Document.doc_blob.limit))));

选项B:Bytebuffer.btoa() - 稍慢(但我认为这是一个更安全的选择,因为不依赖于如何在窗口中定义btoa(),一个依赖于所使用的浏览器... )

var base64StringB = ByteBuffer.btoa(String.fromCharCode.apply(null, new Uint8Array(currentComment.Document.doc_blob.buffer.slice(currentComment.Document.doc_blob.offset, currentComment.Document.doc_blob.limit))), currentComment.Document.doc_blob.littleEndian, currentComment.Document.doc_blob.noAssert);