大家来一起开发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);

        QRCodeDecoder decoder = new QRCodeDecoder();
        System.Drawing.Bitmap bitMap=new System.Drawing.Bitmap(path);
        String decodedString = decoder.decode(new QRCodeBitmapImage(bitMap));

进行递归调用，直到解析完毕为止。

目前遇到的问题：

如果从网上下载的清晰的二维码图片放到系统中尝试可以读取成功，如果用摄像头拍摄的二维码则无法读取成功，

这点我也很纳闷，刚开始怀疑是电脑摄像头像素太低，结果用手机扫也还是解析不了，后面网上查了资料说要先把图片弄成黑白的，结果还是不行，

现在已处于瓶颈期，如果有做过这个的大神给点指导，让大家也学习学习，等这个瓶颈期过了能用我就把全部源代码贴出来。

大家给个意见或者想法咯！！！！

大家来一起开发HTML5项目如何【系列二】

标签：

原文地址：http://blog.csdn.net/laijieyao/article/details/42459419