我正在努力使用客户端脚本将图像转换为字节数组。我必须将图像转换为字节数组,并将此数组传递给 web 服务,以便 web 服务可以将图像保存在 sql server 中。任何人请帮助我。
如何仅使用javascript将图像转换为字节数组以将图像存储在sql server上?
IT技术
javascript
sql-server
image
bytearray
2021-03-18 09:56:49
3个回答
我找到了一种解决方案。:)
在 html javascript 文件中,首先使用以下代码将上传的图像转换为 base64 图像格式。
var p;
var canvas = document.createElement("canvas");
var img1=document.createElement("img");
function getBase64Image(){
p=document.getElementById("fileUpload").value;
img1.setAttribute('src', p);
canvas.width = img1.width;
canvas.height = img1.height;
var ctx = canvas.getContext("2d");
ctx.drawImage(img1, 0, 0);
var dataURL = canvas.toDataURL("image/png");
alert("from getbase64 function"+dataURL );
return dataURL;
}
所以我们得到了上传图像的base64代码dataURL
。
现在dataURL
将此BASE64 代码 ( ) 发送到 Web 服务并使用以下代码将 base64 字符串转换为字节数组并保存到 sql server
c# 代码--用于将 base64 转换为字节 arry 并存储在 sql 中
private void Form1_Load(object sender, EventArgs e) {
int userid = 5;
string base64="";// load base 64 code to this variable from js
Byte[] bitmapData = new Byte[base64.Length];
bitmapData = Convert.FromBase64String(FixBase64ForImage(base64));
string connstr = @"user id=sa; password=*****";
database=ImageTest;
server="192.168.1.104";
SqlConnection conn = new SqlConnection(connstr);
conn.Open();
string query;
query = "insert into imagetable(userid,image) values(" + userid + "," + " @pic)";
SqlParameter picparameter = new SqlParameter();
picparameter.SqlDbType = SqlDbType.Image;
picparameter.ParameterName = "pic";
picparameter.Value = bitmapData;
SqlCommand cmd = new SqlCommand(query, conn);
cmd.Parameters.Add(picparameter);
cmd.ExecuteNonQuery();
cmd.Dispose();
conn.Close();
conn.Dispose();
}
public static string FixBase64ForImage(string image) {
StringBuilder sbText = new StringBuilder(image, image.Length);
sbText.Replace("\r\n", String.Empty);
sbText.Replace(" ", String.Empty);
return sbText.ToString();
}
希望你明白:) ......
File.prototype.convertToBase64 = function(callback){
var FR= new FileReader();
FR.onload = function(e) {
callback(e.target.result)
};
FR.readAsDataURL(this);
}
然后使用这个调用这个函数
var selectedFile = this.files[0];
selectedFile.convertToBase64(function(base64)
你得到你的base64代码。
此问题的可能解决方案:
- 执行一个虚假的 AJAX 调用来上传图像文件(到目前为止,这个jQuery 插件对我来说是个奇迹)。
- 通过 Request.Files 从您将其发布到的页面中检索文件。
- 通过使用生成的 HttpPostedFile 的 InputStream 属性来提供 Web 方法调用的 byte[] 参数来执行 Web 方法调用。
显然,您可以对特定 URL 进行整页发布以执行相同的功能,但我非常喜欢 ASP.NET 中的 AJAX/Web 方法组合。哦,这还假设您使用 ASP.NET 发布到 Web 方法。:P
如果您不想使用 jQuery,您可以使用 JavaScript 中的 XMLHttpRequest 对象实现您自己的 AJAX 函数。本文有一个很好的示例,说明如何实现它以对 url 执行 GET / POST 调用。
其它你可能感兴趣的问题