如何使用 JavaScript 将 Byte[] 格式的图像转换为 Base64string
声明：本页面是StackOverFlow热门问题的中英对照翻译，遵循CC BY-SA 4.0协议，如果您需要使用它，必须同样遵循CC BY-SA许可，注明原文地址和作者信息，同时你必须将它归于原作者（不是我）：StackOverFlow
原文地址: http://stackoverflow.com/questions/26072366/
Warning: these are provided under cc-by-sa 4.0 license. You are free to use/share it, But you must attribute it to the original authors (not me):
StackOverFlow
How to convert Byte[] formated image to Base64string using JavaScript
提问by
I want to display an image from sql db to my web page, I got the image in the format {byte[6317]}How to convert it into Base64string.
我想将 sql db 中的图像显示到我的网页，我得到的图像格式为 {byte[6317]}如何将其转换为Base64string。
回答by kannan D.S
Try this
试试这个
Byte[] bytes = File.ReadAllBytes("path");
String file = Convert.ToBase64String(bytes);
And correspondingly, read back to file:
Byte[] bytes = Convert.FromBase64String(b64Str);
File.WriteAllBytes(path, bytes);
回答by kannan D.S
Try This Code,
试试这个代码，
byte[] imgBytes = (byte[])yourbytedata;
string base64String = Convert.ToBase64String(imgBytes, 0, imgBytes.Length);
string htmlstr = "data:image/png;base64," + base64String;
回答by Faris Zacina
Javascript Approach with Base64.js library
使用 Base64.js 库的 Javascript 方法
Since u specified that u want to convert it using JavaScript you can do it with the Base64 JavaScript library. It has the following methods:
由于您指定要使用 JavaScript 转换它，因此您可以使用 Base64 JavaScript 库进行转换。它有以下方法：
toByteArray - Takes a base64 string and returns a byte array
toByteArray - 接受一个 base64 字符串并返回一个字节数组
And
和
fromByteArray - Takes a byte array and returns a base64 string
fromByteArray - 接受一个字节数组并返回一个 base64 字符串
Here is an example how you could do it. First, return from ASP.NET MVC a response like this:
这是一个如何做到这一点的示例。首先，从 ASP.NET MVC 返回这样的响应：
return Json(new { Img = imageBytes }, JsonRequestBehavior.AllowGet);
And then on the client you can use jQuery getJson() function to get the JSON response from the MVC ImageController:
然后在客户端上，您可以使用 jQuery getJson() 函数从 MVC ImageController 获取 JSON 响应：
$.getJSON("/Image",function(result){
$.each(result, function(i, field){
var byteArray = result.Img;
var base64 = base64js.fromByteArray(byteArray);
$("#mainimg").attr('src', 'data:image/jpeg;base64,' + base64);
});
});
You can download the base64.js library from here:
你可以从这里下载 base64.js 库：
https://github.com/beatgammit/base64-js
https://github.com/beatgammit/base64-js
C# Convert approach
C# 转换方法
If you don't like the base64 javascript approach you could convert the byte array on the server with C# using:
如果您不喜欢 base64 javascript 方法，您可以使用 C# 转换服务器上的字节数组：
String base64string = Convert.ToBase64String(imageBytes);
return Json(new { Img = base64string }, JsonRequestBehavior.AllowGet);
This would return the Base64 string in the JSON Result. Then you can easily set your img source from jQuery as displayed in the Javascript Approach example.
这将在 JSON 结果中返回 Base64 字符串。然后，您可以轻松地从 jQuery 设置 img 源，如 Javascript 方法示例中所示。
