码迷,mamicode.com
首页 > Web开发 > 详细

WebX.5 拍照上传功能

时间:2015-08-19 16:42:38      阅读:138      评论:0      收藏:0      [点我收藏+]

标签:

//拍照
navigator.camera.getPicture(onSuccess, onFail, { quality: 50 ,destinationType:0,sourceType:1});//拍照获取base64的图片
function onSuccess(imageData) {
data.newData({//拍照完成新增到存储图片的data中
"defaultValues" : [ {
fZID : fZID,//主表ID
imgurl : "data:image/jpeg;base64," + imageData,//图片的base64码
imgtpye : StateName,//表状态类型
phototime : datetime//拍照时间
} ]
});
}

//保存到本地数据库

请查看上一篇文章 WebX5 sqllite 增删改查

http://www.cnblogs.com/pengyawn/p/4725166.html

//将图片上传到服务器

function imgupload(names){//上传服务器的js代码
// imgurl //64码图片
// phototime ///拍照时间
// CustID //用户ID
// address //图片保存位置
for(var a=0; a<names.length;a++){
var image = names[a].imgurl;
var subPath="***";
var name=names[a].CustID+"_"+names[a].phototime+".jpg";
var params={
image:image,/图片base64码
subPath:subPath,//服务器存储位置
PicName:name//文件名称
};
$.ajax({//请注意使用ajax的post方法
type: ‘POST‘,
url: names[a].address+"***",
data: params,
success: success,
dataType: ‘json‘
});
}
var success = function(resultData) { // 上传之后的处理
alert("上传文件成功!");
};
}

//后台获取参数

import sun.misc.BASE64Decoder;//需要配置jre 系统库的访问规则

public void doGet(HttpServletRequest request, HttpServletResponse response) throws ServletException, IOException {
String image = request.getParameter("image").substring(23);// 获取参数图片的base64码

//图片存储的位置是该项目在服务器的具体位置,然后经过拼接获取图片的存储位置
String subPath = this.getClass().getResource("/").getPath().substring(1, 39) + request.getParameter("subPath");// 获取图片存储位置
String PicName = request.getParameter("PicName").replaceAll("-", "").replaceAll(":", "").replaceAll(" ", "");// 获取图片存储名
BASE64Decoder decoder = new BASE64Decoder();// 图片base64解密和保存本地
try {
FileOutputStream write = new FileOutputStream(new File(subPath + PicName));// 查询图片地址,新建一个图片,如果地址不存在则新建
byte[] decoderBytes = decoder.decodeBuffer(image);
write.write(decoderBytes);
write.close();
} catch (IOException e) {
e.printStackTrace();
}
}

小编:重庆王  2015-08-19 15:58

WebX.5 拍照上传功能

标签:

原文地址:http://www.cnblogs.com/pengyawn/p/4742516.html

(0)
(0)
   
举报
评论 一句话评论(0
登录后才能评论!
© 2014 mamicode.com 版权所有  联系我们:gaon5@hotmail.com
迷上了代码!