思路:手机拍照后,将图片用js转为base64字符串,传递给asp.net服务端
服务端解析base64,还原为图片,并保存
前端代码
var f1=null; //用来base64的字符串的变量 function login() { var cmr = plus.camera.getCamera(); //启动照相机拍照 var res = cmr.supportedImageResolutions[0]; var fmt = cmr.supportedImageFormats[0]; cmr.captureImage( function( path ){ //拍照成功后,会获取照片的相对路径 plus.io.resolveLocalFileSystemURL( path, function ( entry ) { var localurl = entry.toLocalURL();// //将相对路径转为绝对路径,相对路径的图片是无法转换为base64的 document.getElementById("insert").innerHTML='<img src="'+localurl+'"userImage_id" />' appendFile(localurl); //将图片路径传入函数,用来转化base64 setTimeout("upload(1)", 1000); }); }, function( error ) { //拍照未成功时提示 alert( "Capture image failed: " + error.message ); }, {resolution:res,format:fmt} );
function appendFile(path)
{
var image = new Image();
image.src = path;
image.onload = function()
{
var base64 = getBase64Image(image); //获取base64字符串,传入的是图片对象
f1=base64; //将局部变量转为全局变量
f1=f1.slice(22); //这一句很重要,我在这一句上折腾了半天,意思是:js转化成的base64字符串与c#的不一致,切掉22个字符,c#就能还原成图片了
document.getElementById('inp1').innerText=base64; //这一句我用来调试的,看看转成的字符串是什么样子的
}
}
function getBase64Image(img) //这是讲图片转为base64的主要语句,别问我为什么,我也不知道,网上抄来的,只要传入image对象,就能获取base64字符串,你照抄就行了
{
var canvas = document.createElement("canvas");
canvas.width = img.width;
canvas.height = img.height;
var ctx = canvas.getContext("2d");
ctx.drawImage(img, 0, 0, img.width, img.height);
var ext = img.src.substring(img.src.lastIndexOf(".")+1).toLowerCase();
var dataURL = canvas.toDataURL("image/"+ext); //这里我测试过了,搞出的图片都是png的,你就是jpg的也一样
return dataURL;
}
function lianjie()
{
mui.post('http://192.168.30.2:33200/',{
name:f1 //将base64传给30.2服务器上
},function(data){
alert(data); //成功后会获取服务器返回的提示
},'string'
);
}
前端结束,接下来是后端了
后端是用post取值的,一张图片转为base64,长度有30万个字符串,get接收参数长度有限,只能依靠post
using System; using System.Collections.Generic; using System.Drawing; using System.IO; using System.Text; using System.Web; using System.Web.UI; using System.Web.UI.WebControls; public partial class _Default : System.Web.UI.Page { protected void Page_Load(object sender, EventArgs e) { string base64 = Request.Form["name"]; //post获取base64字符串 if (base64 == null) { Response.Write("空值"); } else { if (base64.Length < 10) { mmf(base64); //这一段我用来测试的,看看web是否正常运行 } else { Image(base64); //关键是这个函数 } } //Image(); } public void mmf(string bbs) { Response.Write("Hdahuang/"+bbs); } public void Image(string base64) { try { byte[] bytes = Convert.FromBase64String(base64); //传入base64,保存位置改一改,返回字符看一看,其他地方都可以照抄 MemoryStream memStream = new MemoryStream(bytes); Bitmap Bmap = new Bitmap(memStream); Bmap.Save(@"E:118123.png"); //这个也说明下,弄这个时候,抛出个GDI+异常,又搞了我半天,是因为文件夹权限不足,c#不能将图片保存到本地引起的,解决方案,自己百度 } catch (Exception ex) { Response.Write(ex + "@@" + base64); return; } Response.Write("成功"); } }