mui拍照、相册选择以及上传图片(前后端代码)
小付在此多嘴一句,这是本人的发表的第一份博客,很期待很激动,我本是java出身,但是,由于公司需要,app,公众号都了解一二,不敢奢求过多,只希望我的分享能给大家解决一点思路,这次mui的图片上传、预览等功能希望能给大家带来一定的帮助。
mui.plusReady(function() {
function tellphone(imgobj){
var btnArray = [{title:"照相机"},{title:"相册"}];
plus.nativeUI.actionSheet({
title:"请选择",
cancel:"取消",
buttons:btnArray},
function(e){
var index=e.index;
switch(index){
case 1:
getImage(imgobj);
break;
case 2:
getImagexc(imgobj);
break;
}
});
}
//选择相册
function getImagexc(imgobj){
plus.gallery.pick(function(path){
console.log(path);
document.getElementById("uploadimg").src=path;
upload(path,imgobj);
// img.src = path; //获得图片路径
},function(e){
console.log("取消选择图片");
},{filter:"image"});
}
//调用拍照
function getImage(imgobj){
var cmr = plus.camera.getCamera();
cmr.captureImage(function(p){
plus.io.resolveLocalFileSystemURL(p, function(entry){
var img_path = entry.toLocalURL();
var img_name = entry.name;
upload(img_path,imgobj);
var userPhone = document.getElementById("uploadimg");
userPhone.src = img_path;
// $("#uploadimg").attr("src",img_path);
}, function(e){
alert("失败");
});
}, function(e){
}, {filename:"_doc/camera/",index:1});
}
function upload(p,imgobj){
var n=p.substr(p.lastIndexOf('/')+1);
files.push({name:"uploadkey"/* +index */,path:p});
start_upload(imgobj);
index++;
//开始上传
function start_upload(imgobj){
if(files.length<=0){
plus.nativeUI.alert("没有添加上传文件!");
return;
}
var server="http://本地ip:8080/RKZC.do?actions=savePhoneMail";
var wt=plus.nativeUI.showWaiting();
var task=plus.uploader.createUpload(server,
{method:"POST"},
function(t,status){ //上传完成
if(status==200){
var tmpStr = t.responseText;
var json = eval('('+tmpStr+')');
var files2 = json.data1;
if(files2==1){
var files1 = json.data;
document.getElementById("uploadimg").src=files1;
document.getElementById("uploadimg1").src="/images/addImg.png";
arr.push(files1);
}else{
var files1 = json.data;
document.getElementById("uploadimg").src=arr[0];
document.getElementById("uploadimg1").src=files1;
}
plus.nativeUI.alert("上传成功");
// document.getElementById("upload").src=url;
wt.close();
}else{
alert("失败");
wt.close();
}
});
task.addData("uid",getUid());
for(var i=0;i<files.length;i++){
var f=files[i];
task.addFile(f.path,{key:f.name});
}
task.start();
}
}
function getUid(){
return Math.floor(Math.random()*100000000+10000000).toString();
}
});
后端代码 :使用strtus接收:
/*
*
* savePhone上传图片
* */
public ActionForward savePhoneMail(ActionMapping actionMapping, ActionForm form,
HttpServletRequest request, HttpServletResponse response) throws AppException {
String id = request.getParameter("id")==null?"":request.getParameter("id").toString();
String type = request.getParameter("type")==null?"":request.getParameter("type").toString();
String imgobj = request.getParameter("imgobj")==null?"":request.getParameter("imgobj").toString();
String fix = ".jpg";//默认将突破置为jpg格式
String requestURI = request.getRealPath("/")+"upload"+File.separator;
File file = new File(requestURI +"upload下级目录"+File.separator);
if (!file.exists()) {// 若文件目录不存在,则创建目录
file.mkdirs();
}
try {
/*MultipartRequestWrapper servletRequest = (MultipartRequestWrapper) request;
String aString = servletRequest.getRequest().getMethod();*/
int maxPostSize = 1 * 100 * 1024 * 1024;
MultipartRequest mr=null;
mr = new MultipartRequest(request, requestURI + companycode+File.separator+str1[0]+File.separator, maxPostSize, "GBK");
Enumeration files = mr.getFileNames();
String fileName = "";
String filePath = "";
while (files.hasMoreElements()) {
fileName = (String) files.nextElement();
File uploadFile = mr.getFile(fileName);
File fileNew = new File(requestURI + companycode+File.separator+str1[0]+File.separator+str1[0]+"-3-"+imgobj+fix);
uploadFile.renameTo(fileNew);
System.out.println("FileName============"+fileName);
String fileName1=getCode(6);
//用此方法得到上传文件的真正的文件名,这里的fileName指文件输入类型的名称
filePath = mr.getFilesystemName(fileName);
System.out.println("FilePath============"+filePath);
//此方法得到一个文件对象,代表储存在服务器上的fileName文件
File f = mr.getFile(fileName);
System.out.println("FilePath============"+f);
String path=request.getSession().getServletContext().getRealPath("") ;
String aString = fileNew.getPath().toString().substring(path.length());
System.out.println(aString);
JSONObject jsonObject = new JSONObject();
jsonObject.put("data", aString);
jsonObject.put("data1", imgobj);
PrintWriter out = response.getWriter();
out.print(jsonObject.toString());
out.flush();
if (null == f)
throw new ServletException("file is not exist");
deleteFile(uploadFile);
}
//可以取得请求参数的名称
Enumeration enum1=mr.getParameterNames();
while (enum1.hasMoreElements()) {
String s=(String)enum1.nextElement();
System.out.println(s);
String[] str=mr.getParameterValues(s);
for (int i=0;i<str.length;i++){
System.out.println(str[i]);
}
}
} catch (Exception e) {
e.printStackTrace();
// TODO: handle exception
}
return null;
}
效果图
有不懂的请加qq:214321221