欢迎您访问程序员文章站本站旨在为大家提供分享程序员计算机编程知识!
您现在的位置是: 首页  >  IT编程

HTML5+Canvas调用手机拍照功能实现图片上传(下)

程序员文章站 2022-05-20 11:26:37
上一篇只讲到前台操作,这篇专门涉及到java后台处理,前台通过ajax提交将base64编码过的图片数据信息传到java后台,然后java这边进行接收处理,通过对图片数据信...

上一篇只讲到前台操作,这篇专门涉及到java后台处理,前台通过ajax提交将base64编码过的图片数据信息传到java后台,然后java这边进行接收处理,通过对图片数据信息进行base64解码,之后使用流将图片数据信息上传至服务器进行保存,并且将图片的路径地址存进数据库。

大家可以点此链接查看前台本地压缩上传的处理:

html5+canvas+jquery调用手机拍照功能实现图片上传(上)

ok,废话不多说了,直接贴代码吧。

1、前台js代码:

$.ajax({ 
        async:false,//是否异步 
        cache:false,//是否使用缓存 
        type: "post", 
        data:{filedata:filedata,licencename:licencename,cust_tax_code:cust_tax_code,phonenum:phonenum,state_id:state_id}, 
        datatype: "json", 
        timeout: 1000, 
        contenttype : 'application/x-www-form-urlencoded; charset=utf-8', 
        url: $('#ctx').val()+"customercheckservlet?action=uploadlicence", 
        success: function(result){ 
          console.log(result); 
          if(result == true){ 
            alert('success upload~~~'); 
          }else if(result == false){ 
            alert('error upload~~~'); 
          } 
        }, 
        error: function(){ 
          alert("error linking~"); 
        } 
      }); 

2、后台java代码

/** 
   * 证件上传 
   * @param request 
   * @param response 
   * @throws ioexception 
   */ 
  public void uploadlicence(httpservletrequest request,httpservletresponse response) throws ioexception{ 
    log.info("=====================uploadlicence"); 
    df = new simpledateformat("yyyy-mm-dd"); 
     
    string cust_tax_code = request.getparameter("cust_tax_code"); 
    string phonenum = request.getparameter("phonenum"); 
    string licencename = request.getparameter("licencename"); 
     
    string filedata = request.getparameter("filedata");//base64编码过的图片数据信息,对字节数组字符串进行base64解码 
    string imgpath = uploadfile(filedata,licenename);//进行文件上传操作,上传到服务器中存放(这里是上传到服务器项目文件夹中存到) 
     
    boolean result = false;//最终上传成功与否的标志 
     
    custcheckinfo = new customercheckinfo(); 
    custcheckinfo.setcust_tax_code(cust_tax_code); 
    custcheckinfo.setphonenum(phonenum); 
    custcheckinfo.setupdate_time(df.format(new date())); 
     
    boolean save_flag = customerservice.saveregistcertinfo(custcheckinfo);//保存路径 
     
    //判断数据库中的路径是否存在,并且文件夹中的文件是否存在(判断是否上传成功的标志) 
    boolean is_success = issuccessupload(licencename, cust_tax_code, phonenum); 
    if(save_flag && is_success){ 
      result = true; 
    } 
     
    //如果证件上传成功,则记录到记录表中 
    if(result){ 
      staterecordinfo record = new staterecordinfo(); 
      record.setcust_tax_code(cust_tax_code); 
      record.setphonenum(phonenum); 
      record.setstate_id(state_id); 
       
      savestaterecord(record);//执行状态保存操作 
    } 
     
    system.out.println("===result:"+result); 
    printwriter pw = response.getwriter(); 
    pw.print(result); 
    pw.close(); 
  } 
/** 
   * 文件上传 
   * @param filedata 
   * @param filename 
   * @return 
   */ 
  public string uploadfile(string filedata,string filename){ 
    //在自己的项目中构造出一个用于存放用户照片的文件夹 
    string imgpath = this.getservletcontext().getrealpath("/uploads/"); 
    //如果此文件夹不存在则创建一个 
    file f = new file(imgpath); 
    if(!f.exists()){ 
      f.mkdir(); 
    } 
    //拼接文件名称,不存在就创建 
    imgpath = imgpath + "/" + filename + ".jpg"; 
    f = new file(imgpath); 
    if(!f.exists()){ 
      f.mkdir(); 
    } 
     
    log.info("====文件保存的位置:"+imgpath); 
     
    //使用base64对图片文件数据进行解码操作 
    base64decoder decoder = new base64decoder(); 
    try { 
      //通过base64解密,将图片数据解密成字节数组 
      byte[] bytes = decoder.decodebuffer(filedata); 
      //构造字节数组输入流 
      bytearrayinputstream bais = new bytearrayinputstream(bytes); 
      //读取输入流的数据 
      bufferedimage bi = imageio.read(bais); 
      //将数据信息写进图片文件中 
      imageio.write(bi, "jpg", f);// 不管输出什么格式图片,此处不需改动 
      bais.close(); 
    } catch (ioexception e) { 
      log.error("e:{}",e); 
    } 
    return imgpath; 
  } 
/** 
   * 判断是否成功上传 
   * @return 
   */ 
  public boolean issuccessupload(string licencename,string cust_tax_code,string phonenum){ 
    boolean flag = false; 
    string licencepath = "";//证件图片上传成功之后保存的路径 
     
    custcheckinfo = customerservice.getcustomercheckinfo(cust_tax_code, phonenum); 
    licencepath = custcheckinfo.gettax_regist_cert(); 
   
    //判断证件路径不为空并且在上传存放的文件夹中存在,就表明以上传成功 
    file f = new file(licencepath); 
    if(licencepath.length() >0 && f.exists()){ 
      flag = true; 
    } 
    return flag; 
  } 

好了,到这里就全部结束了,这就是html5+jquery+canvas调用手机拍照功能实现图片上传的全部实现过程,总感觉自己的思路有些混乱,嗯,慢慢进步吧!

以上就是本文的全部内容,希望对大家的学习有所帮助,也希望大家多多支持。