html5 如何将摄像头拍下的图片下载到本地
Posted
tags:
篇首语:本文由小常识网(cha138.com)小编为大家整理,主要介绍了html5 如何将摄像头拍下的图片下载到本地相关的知识,希望对你有一定的参考价值。
我用video调用了电脑的摄像头,然后截图显示在网页中的canvas中,请问如何将该图片保存到本地电脑。
首先你canvas已经有图了
然后通过ajax发给后台 然后后台做保存
js:
var data = _canvas.toDataURL();//删除字符串前的提示信息 "data:image/png;base64,"
var b64 = data.substring(22);
$.ajax( url: "RotateCanvas.aspx", data: data: b64, name: i.toString() , success:
function ()
alert('OK');
);
java:
if (Request["name"] != null)string name = Request["name"];
String savePath = Server.MapPath("~/images/output/");
try
FileStream fs = File.Create(savePath + "/" + name + ".png");
byte[] bytes = Convert.FromBase64String(Request["data"]);
fs.Write(bytes, 0, bytes.Length);
fs.Close();
catch (Exception ex)
追问
function cut() var videoElement。。
var canvasObj 。。
。。drawImage(videoElement, 0, 0, 320, 240);
这是我的截图函数,请问你提供的代码放在哪里?
你看你保存是想怎么触发
自动保存就放drawImage(videoElement, 0, 0, 320, 240); 后面
var canvasObj 。。
。。drawImage(videoElement, 0, 0, 320, 240);
var data = canvasObj.toDataURL();
//删除字符串前的提示信息 "data:image/png;base64,"
var b64 = data.substring(22);
$.ajax( url: "RotateCanvas.aspx", data: data: b64, name: i.toString() , success:
function ()
alert('OK');
);
参考技术A 首先你canvas已经有图了
然后通过ajax发给后台
然后后台做保存
js:
12345678910 var data = _canvas.toDataURL(); //删除字符串前的提示信息 "data:image/png;base64," var b64 = data.substring(22); $.ajax( url: "RotateCanvas.aspx", data: data: b64, name: i.toString() , success: function () alert('OK'); );
java:
1234567891011121314151617if (Request["name"] != null) string name = Request["name"]; String savePath = Server.MapPath("~/images/output/"); try FileStream fs = File.Create(savePath + "/" + name + ".png"); byte[] bytes = Convert.FromBase64String(Request["data"]); fs.Write(bytes, 0, bytes.Length); fs.Close(); catch (Exception ex) 参考技术B 看得见吗??看得见直接用QQ截图不就行了? 看不见用浏览器缓存的办法 ! 你说的是图片吧 应该不是动态的..
以上是关于html5 如何将摄像头拍下的图片下载到本地的主要内容,如果未能解决你的问题,请参考以下文章