gpt4 book ai didi

javascript - 将捕获的 png 保存为 arraybuffer

转载 作者:行者123 更新时间:2023-11-30 06:26:37 25 4
gpt4 key购买 nike

我正在尝试将图像保存到保管箱,但无法正确转换。我有一个 img(使用 this 示例捕获),我想将它存储到接受 ArrayBuffer 的保管箱(示例 here)

这是我发现应该进行两次转换的代码,首先转换为 base64,然后转换为 ArrayBuffer

    function getBase64Image(img) {
// Create an empty canvas element
var canvas = document.createElement("canvas");
canvas.width = img.width;
canvas.height = img.height;

// Copy the image contents to the canvas
var ctx = canvas.getContext("2d");
ctx.drawImage(img, 0, 0);

// Get the data-URL formatted image
// Firefox supports PNG and JPEG. You could check img.src to
// guess the original format, but be aware the using "image/jpg"
// will re-encode the image.
var dataURL = canvas.toDataURL("image/png");

return dataURL.replace(/^data:image\/(png|jpg);base64,/, "");
}

function base64ToArrayBuffer(string_base64) {
var binary_string = window.atob(string_base64);
var len = binary_string.length;
var bytes = new Uint8Array(len);
for (var i = 0; i < len; i++) {
var ascii = binary_string.charCodeAt(i);
bytes[i] = ascii;
}
return bytes.buffer;
}

保存是这样开始的

     var img = $('#show-picture')[0];
var data = base64ToArrayBuffer( getBase64Image(img));
dropbox.client.writeFile(moment().format('YYYYMMDD-HH-mm-ss')+'.png', data, function (error, stat) {
if (error) {
return dropbax.handleError(error);
}
// The image has been succesfully written.
});

问题是我保存了一个损坏的文件,并且对出了什么问题有点困惑。

*编辑 *

这是原始文件的链接 https://www.dropbox.com/s/ekyhvu2t6d8ldh3/original.PNG这里是腐败的。 https://www.dropbox.com/s/f0oevj1z33brpur/20131219-22-23-14.png

我正在使用这个版本的 dropbox.js://cdnjs.cloudflare.com/ajax/libs/dropbox.js/0.10.2/dropbox.min.js

如您所见,损坏的略大 23.3KB 对比 32.6KB感谢您的帮助

拉尔西

最佳答案

将我的评论移至答案,因为这似乎适用于最新的 Datastore JS SDK,但可能不适用于 dropbox.js 0.10.2。


什么浏览器和什么版本的 Dropbox 库?保存的图像有什么问题? (我假设“损坏”是指它不会在您使用的任何工具中打开……还有更多提示吗?文件大小是否合理?)我刚刚做了一个非常相似的测试(toDataURL、atob 和 Uint8Array ) 在 OS X 和 dropbox.com/static/api/dropbox-datastores-1.0-latest.js 上使用 Chrome,它似乎可以工作。

关于javascript - 将捕获的 png 保存为 arraybuffer,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/20691320/

25 4 0
Copyright 2021 - 2024 cfsdn All Rights Reserved 蜀ICP备2022000587号
广告合作:1813099741@qq.com 6ren.com