http://blog.csdn.net/backzero333/article/details/58744798
(1)首先贴上的是JS代码
*拍照上传*/
function getImage() {var camera = plus.camera.getCamera();
//生成时间戳
var timestamp = Date.parse(new Date());
camera.captureImage(function(e) {
plus.io.resolveLocalFileSystemURL(e,function(entry){
console.log('获取图片地址');
var imgUrl = entry.toLocalURL();
console.log("imgURL "+imgUrl);
/*调用上传图片方法*/
uploadHead(imgUrl);
},function(e){
console.log("读取拍照文件错误:" + e.message);
mui.alert("读取拍照文件错误");
},function(e){
console.log("调用摄像头异常:" + e.message);
mui.alert("调用摄像头异常");
},{
filename: timestamp+"-img.png"
});
});
}
/*本地相册上传*/
function galleryImg() {
console.log("打开相册");
//生成时间戳
var timestamp = Date.parse(new Date());
plus.gallery.pick(function(img) {
console.log("选取图片相册");
plus.io.resolveLocalFileSystemURL(img,function(entry){
console.log("获取图片地址");
var imgUrl = entry.toLocalURL();
/*调用上传图片方法*/
uploadHead(imgUrl);
},function(e){
console.log("读取图片错误:" + e.message);
mui.alert("读取图片错误");
},function(e){
console.log("选取图片异常:" + e.message);
mui.alert("选取图片异常");
},{
filename: timestamp+"-img.png"
});
});
};
//上传图片
function uploadHead(imgPath) {
console.log("imgPath = " + imgPath);
// mainImage.src = imgPath;
// mainImage.style.width = "60px";
// mainImage.style.height = "60px";
var image = new Image();
image.src = imgPath;
image.onload = function() {
var imgData = getBase64Image(image);
console.log("imgData"+imgData);
/*在这里调用上传接口*/
$.ajax({
url:baseURL+“/imgeupload”,
data:{
"imgBase64Data":imgData
},
dataType: 'json',
type: 'post',
timeout: 10000,
success: function(data) {
console.log('上传成功');
},
error: function(xhr,type,errorThrown) {
console.log(errorThrown);
mui.toast('网络异常,请稍后再试!');
}
});
}
}
//将图片压缩转成base64
function getBase64Image(img) {
//绘制图形
var canvas = document.createElement("canvas");
var width = img.width;
console.log(width);
var height = img.height;
console.log(height);
// 这里对图片大于300*400的进行压缩
if(width > height) {
if(width > 300) {
height = Math.round(height *= 300 / width);
width = 300;
}
} else {
if(height > 400) {
width = Math.round(width *= 400 / height);
height = 400;
}
}
canvas.width = width; /*设置新的图片的宽度*/
canvas.height = height; /*设置新的图片的长度*/
var ctx = canvas.getContext("2d");
ctx.drawImage(img,width,height); /*绘图*/
var dataURL = canvas.toDataURL("image/png",0.5);
console.log(dataURL);
return dataURL.replace("data:image/png;base64,","");
}
@ResponseBody @RequestMapping( value = "/img_upload") public WrapperResponseEntity imgUpload(@RequestParam String imgBase64Data,HttpServletRequest request){ WrapperResponseEntity entity = new WrapperResponseEntity(); try { if(imgBase64Data == null || "".equalsimgBase64Data)){ entitysetData("上传失败,上传图片数据为空!") } String projectPath = requestgetSessiongetServletContextgetRealPath"/" String context getContextPathString imgFilePath ="/userfiles/images/"File uploadPathFile File(projectPath+imgFilePath //创建父类文件 (!uploadPathFileexists() && !uploadPathFileisDirectory()){ uploadPathFilemkdirs File imgeFile +imgFilePathDategetTime+".jpg" if!imgeFile imgeFilecreateNewFile//对base64进行解码 byte[] result = Encodes.decodeBase64//使用Apache提供的工具类将图片写到指定路径下 FileUtils.writeByteArrayToFile(imgeFile entity(imgFilePath+imgeFilegetName())System.outprintln }catch (Exception e eprintStackTrace"上传失败,系统异常" return entity; }
/** * Base64解码. */ public static byte[] decodeBase64input) { return Base64inputgetBytes}说明:这里只能实现单张图片的上传。 @H_301_607@ 原文链接:https://www.f2er.com/ajax/160527.html