大家来一起开发HTML5项目如何【系列二】
之前出系列一,大家都没能积极响应,心里有点小失落。再加上年底公司事情比较多,就一直搁着,昨天开始继续研究,算是取得了一些进步,
不过又遇到了新的瓶颈。接下来就跟大家分享下这两天的成果吧。
系列一中确定了思想,主要从以下几个方面着手,
1、用HTML5调用摄像头,进行拍照。
2、将拍照获取的图像数据流传到后台进行解析。
3、返回数据,如果解析不成功继续解析,知道解析成功为止。
第一步已经在我的博客中有了。
http://blog.csdn.net/laijieyao/article/details/41241815
第二步具体代码如下,通过post方式传送数据到后台进行解析
function CatchCode() { $("#snap").click(); //实际运用可不写,测试代 , 为单击拍照按钮就获取了当前图像,有其他用途 var canvans = document.getElementById("canvas"); //获取浏览器页面的画布对象 //以下开始编 数据 var imgData = canvans.toDataURL(); //将图像转换为base64数据 var base64Data = imgData.substr(22); //在前端截取22位之后的字符串作为图像数据 //开始异步上 $.post("uploadImgCode.ashx", { "img": base64Data }, function (data, status) { if (status == "success") { if (data == "OK") { alert("OK"); } else { CatchCode(); } } else { CatchCode(); } }, "text"); }
img = context.Request["img"].ToString(); //获取base64字符串 byte[] imgBytes = Convert.FromBase64String(img); //将base64字符串转换为字节数组 System.IO.Stream stream = new System.IO.MemoryStream(imgBytes); //将字节数组转换为字节流 //将流转回Image,用于将PNG 式照片转为jpg,压缩体积以便保存。 System.Drawing.Image image = System.Drawing.Image.FromStream(stream);
解析二维码我用了小日本的ThoughtWorks.QRCode这个插件,这里必须自责一下。
QRCodeDecoder decoder = new QRCodeDecoder(); System.Drawing.Bitmap bitMap=new System.Drawing.Bitmap(path); String decodedString = decoder.decode(new QRCodeBitmapImage(bitMap));
第三步,如果解析失败则报异常,在catch部分我用return,则在前台的status不可能为success,前台接收的status字段如果不为success则继续往后台发送数据,
进行递归调用,直到解析完毕为止。
目前遇到的问题:
如果从网上下载的清晰的二维码图片放到系统中尝试可以读取成功,如果用摄像头拍摄的二维码则无法读取成功,
这点我也很纳闷,刚开始怀疑是电脑摄像头像素太低,结果用手机扫也还是解析不了,后面网上查了资料说要先把图片弄成黑白的,结果还是不行,
现在已处于瓶颈期,如果有做过这个的大神给点指导,让大家也学习学习,等这个瓶颈期过了能用我就把全部源代码贴出来。
大家给个意见或者想法咯!!!!
郑重声明:本站内容如果来自互联网及其他传播媒体,其版权均属原媒体及文章作者所有。转载目的在于传递更多信息及用于网络分享,并不代表本站赞同其观点和对其真实性负责,也不构成任何其他建议。