html5如何调用手机摄像头,实现拍照,拍视频实现上传功能？html5提供了navigator.getUserMedia接口使用设备摄像头，chrome28上测试已经可用，手机端浏览器测试发现只有opera浏览器可用
html5如何调用手机摄像头,实现拍照,拍视频实现上传功能？
html5提供了navigator.getUserMedia接口使用设备摄像头，chrome28上测试已经可用，手机端浏览器测试发现只有opera浏览器可用。浏览器未完善之前可以使用PhoneGap完成，它提供了navigator.camera.getPicture接口，使用js可以方便调用设备摄像头。如何使用HTML5实现拍照上传应用·Web前端？
可以。但是傻逼的微信 jssdk 调用微信拍照接口，图片需要先上传到微信服务器，然后你的服务器再去微信服务器上下载，如果你乐意让微信拿到用户的图片，这就无所谓。也可以用 input type=file accept="image/*" ，让用户点一下调起系统自带的选图/拍照功能，这样可以直接获取到文件 blob ，我不知道微信里能不能用，需要试一下。HTML5 Canvas调用手机拍照功能实现图片上传（上）？
HTML5技术支持WebApp在手机上拍照，显示在页面上并上传到服务器。这是手机微博应用中常见的功能，当然你也可以在其它类型应用中适当使用此技术。1、 拍照 拍照是采用HTML5的Canvas功能，实时捕获Video标签的内容，因为Video元素可以作为Canvas图像的输入，所以这一点很好实现。主要代码如下：var canvas=document.createElement(‘canvas’) //动态创建画布对象var ctx=canvas.getContext(’2d’)var cw=vw，ch=vhctx.fillStyle=”#ffffff”ctx.fillRect(0，0，cw，ch)ctx.drawImage(video_element，0，0，cw，ch，0，0，vw，vh) //将video对象内指定的区域捕捉绘制到画布上指定的区域，可进行不等大不等位的绘制。document.body.append(canvas)
2、 图片获取 从Canvas获取图片数据的核心思路是用canvas的toDataURL将Canvas的数据转换为base64位编码的PNG图像，类似于“data:image/pngbase64，xxxxx”的格式。var imgData=canvas.toDataURL(“image/娱乐城png”)这样，imgData变量就存储了一长串的字符数据内容，表示的就是一个PNG图像的base64编码。因为真正的图像数据是base64编【繁：編】码逗号之后的部分，所以要让实际服务器接收的图像数据应该是这部分，方法是在前端截取22位以后的字符串作为图像数据，例如：var data=imgData.substr(22)如果要在上传前获取图片的大小，可以使用：var length=atob(data).length //atob 可解码用base-64解码的字串
3、 图片上传 在前端可以使用Ajax将上面获得的开云体育图片数据上传到后台脚本。例如使用【yòng】jQuery时可以用：$.post(‘upload.php’，{‘data’:data})在后台用PHP脚本接收数据并存储为图片。function convert_data($data){ $image=base64_decode(str_replace(‘data:image/jpegbase64，’，”，$data) save_to_file($image)}function save_to_file($image){ $fp=fopen($filename，’w") fwrite($fp，$image) fclose($fp)
本文链接：http://21taiyang.com/Gyms/20757138.html
html5拍照（读：zhào）上传转载请注明出处来源
