Question

在我的.Net MVC应用程序中，我有一个DataTable，它有一个image列。图像作为varbinary存储在SQL中。控制器传递＆＃34;图像＆＃34;以剃刀作为字节数组，然后Razor将其呈现为img标记，如下所示：

string imageBase64 = Convert.ToBase64String(item.Image);
string imageSrc = string.Format("data:image/gif;base64,{0}", imageBase64);
<img src="@imageSrc" height="50" />

这完美无缺。但是，由于几个原因（这些都非常无聊），我们需要重做表，以便在JQuery中构造它。这意味着，在构建图像列时，需要将图像数据转换为Base64字符串。我已经在jQuery中使用了btoa函数，但它没有将它转换为与上面的Razor方法相同的Base64字符串，这会导致网格中的图像损坏。我的jQuery如下：

var imgData = btoa(data);
return "<img src=\"data:image/gif;base64," + imgData + "\" />";

注意：第一个块中的item.Image和第二个块中的data正在传递相同的东西......一个90,514个部分的数组（看似）具有相同的元素序列。

我也尝试过投射数据＆＃34;像btoa(data.toString())这样的字符串，但是没有用。看起来ToBase64String接受字节数组而btoa接受字符串。说实话，我甚至不想使用btoa，因为我知道它甚至不能在IE的最近的版本中工作。所以，如果有人有更好的建议，我会全力以赴。我发现的所有插件或其他方法都不起作用。

Essentailly，我只想弄清楚为什么这两个代码块产生不同的输出，更重要的是，我如何更改第二个块以产生与第一个相同的输出。

对于Record：我很想发布这些代码块返回的实际Base64字符串，但每当我尝试在浏览器中粘贴其中一个时，它就会崩溃。

Answer 1

哦，我只是爱当我在问题上花了半天时间，在StackOverflow上发布一个试图找到答案的问题，然后在5分钟后对我的解决方案感到非常困惑自己！

基本上，我认为你可以做到这一点：

var imgString = btoa(String.fromCharCode.apply(null, data));

但是，使用这种方法我收到了一个错误（可在Developer Tools中查看）：

最大调用堆栈大小超出错误

经过进一步研究，我发现这个错误是由一个永无止境的递归函数引起的，导致堆栈填满。我发现了对上述解决方案的这种修改，最终解决了这个问题：

var imgString = btoa([].reduce.call(data, function (p, c) { return p + String.fromCharCode(c) }, ''));

为什么btoa没有按预期转换我的字节数组？

1 个答案: