网页上传图片js+java

其他 2021-02-27 19:22:35 阅读次数: 0

用了GitHub上开源的一个项目localresizeimg（h5压缩图片，会失真，且生成的是jpg格式的），以及ajaxfileupload

/**
 * pc后台管理端 上传图片
 * 
 * @param img_id
 *          无回调函数 则将id为img_id的img赋值
 * @param width_
 * @param callBack
 *          回调函数 该函数存在优先函数 例： img_upload('imgid',400);
 *          img_upload(null,400,function(res){alert("图片路径"+src)});
 */
function img_upload(img_id, width_, callBack) {
  create_img_file_();
  $('#img_upload_file').change(function() {
    // this.files[0] 是用户选择的文件
    var index = layer.load();
    var img_upload_callback = function(result) {
      $(".cd-popup").remove();
      $('#img_upload_file').remove();
      layer.close(index);
      var status = result.status;
      var map = result.map;
      if (status == '1') {
        layer.alert(map.message);
        return false;
      } else {
        if (callBack) {
          callBack(map.fileName);
        } else {
          $("#" + img_id).attr("src", map.fileName).attr("url", map.fileName);
        }
      }
    }
    if((!!window.ActiveXObject || "ActiveXObject" in window)) {
      ajaxFileUpload(img_upload_callback);
    } else {
      lrzImgUpload(this, width_, img_upload_callback);
    }
  });
}
function create_img_file_() {
  /*if((!!window.ActiveXObject || "ActiveXObject" in window) && !(navigator.userAgent.search(/Trident/i) > 0)) {
  alert("浏览器版本过低，请升级浏览器或使用其他浏览器进行操作");
  return false;
  }*/
  if ($("#img_upload_file").length > 0) {
    $("#img_upload_file").remove();
  }
  if((!!window.ActiveXObject || "ActiveXObject" in window)) {//ie弹窗提示用户手动选择图片
    var str = '<div class="cd-popup"><div class="cd-popup1"><div class="cd-popup-container1"><p style="margin-top:0;">请选择文件</p><div class="allsq">'+
    '<input type="file" class=" txt_sq" value="" id="img_upload_file" name="img_upload_file" accept="image/*;capture=camera;" style="width:170px;margin-top: 70px"/>'+
    '</div><a href="javascript:void(0)" onclick="$(this).closest(\'.cd-popup\').remove();"><img src="'+getRootPath()+'/images/fore/tcgb.jpg" class="cd-popup-close"/></a></div></div></div>';
    $("body").append(str);
  } else {
    $("body").append('<input type="file" id="img_upload_file" style="display:none;" name="img_upload_file" accept="image/*;capture=camera;"/>')
    $("#img_upload_file").click();
  }
}

function lrzImgUpload(obj,width_, callback) {
  var exts = obj.files[0].name.split(".");
  var ext = exts[exts.length - 1];
  if(ext == 'png' || ext == 'gif') {//这两种图片不能压缩成jpg
    ajaxFileUpload(callback);
    return false;
  }
  lrz(obj.files[0], {
    width : width_
  }).then(function(rst) {
    var submitData = {
        data : rst.base64.split("base64,")[1],
        ext : ext
    };
    $.ajax({
      type : "POST",
      url : getRootPath() + '/ajaxUploadBase64',
      data : submitData,
      async: false,
      dataType : "text",
      success : function(result_) {
        var result = JSON.parse(result_);
        if(result.status != '0') {
          ajaxFileUpload(callback);
        } else {
          callback(result);
        }
      },
      complete : function(XMLHttpRequest, textStatus) {
      },
      error : function(XMLHttpRequest, textStatus, errorThrown) { // 上传失败
        var result = new Object();
        var map = new Object();
        map.message = "图片上传失败";
        result.status = "1";
        result.map = map;
      }
    });
  }).catch(function(res){
    ajaxFileUpload(callback);
  });
}

function ajaxFileUpload(callback) {
  $.ajaxFileUpload({
      url: '/ajaxUpload', //用于文件上传的服务器端请求地址
      secureuri: false, //一般设置为false
      fileElementId: 'img_upload_file', //文件上传空间的id属性  <input type="file" id="file" name="file" />
      dataType: 'json', //返回值类型 一般设置为json
      async: false,
      success: function (result) { //服务器成功响应处理函数
        callback(result);
      },
      error: function (data, status, e) {//服务器响应失败处理函数
        var result = new Object();
        var map = new Object();
        map.message = "图片上传失败";
        result.status = "1";
        result.map = map;
        callback(result);
      }
  })
}


servlet

/**  
 * Copyright(c)2013 Wuxi Lanlin Co.,Ltd. 
 * All right reserved. 
 */
package com.spring.web.servlet;

import java.awt.Image;
import java.awt.image.BufferedImage;
import java.io.File;
import java.io.FileOutputStream;
import java.io.IOException;
import java.text.SimpleDateFormat;
import java.util.Date;
import java.util.List;
import java.util.Random;
import javax.imageio.ImageIO;
import javax.servlet.ServletException;
import javax.servlet.annotation.WebServlet;
import javax.servlet.http.HttpServlet;
import javax.servlet.http.HttpServletRequest;
import javax.servlet.http.HttpServletResponse;
import org.apache.commons.fileupload.FileItem;
import org.apache.commons.fileupload.FileItemFactory;
import org.apache.commons.fileupload.FileUploadException;
import org.apache.commons.fileupload.disk.DiskFileItemFactory;
import org.apache.commons.fileupload.servlet.ServletFileUpload;
import com.spring.web.result.Result;
import com.spring.web.result.ResultImpl;
import com.spring.web.util.OutPrintUtil;
import com.sun.image.codec.jpeg.JPEGCodec;
import com.sun.image.codec.jpeg.JPEGEncodeParam;
import com.sun.image.codec.jpeg.JPEGImageEncoder;

/**
 * Servlet implementation class FileUploadServlet
 */
@WebServlet("/ajaxUpload")
public class AjaxUpload extends HttpServlet {
    private static final long serialVersionUID = 1L;
    private static long maxSize = 104857600;
    private static String img = "gif,jpg,jpeg,png,bmp";

    protected void doGet(HttpServletRequest request, HttpServletResponse response) throws ServletException, IOException {
    }

    protected void doPost(HttpServletRequest request, HttpServletResponse response) throws ServletException,
            IOException {
        // 需要返回的fileName
        String fileName = null;
        Result result = new ResultImpl();
        if (!ServletFileUpload.isMultipartContent(request)) {
            try {
                result.setStatus("1");
                result.setMap("message", "请选择图片。");
                OutPrintUtil.OutPrint(response, result);
            } catch (Exception e) {
                e.printStackTrace();
            }
            return;
        }
        FileItemFactory factory = new DiskFileItemFactory();
        ServletFileUpload upload = new ServletFileUpload(factory);
        upload.setHeaderEncoding("UTF-8");
        try {
            List<FileItem> items = upload.parseRequest(request);
            SimpleDateFormat df = new SimpleDateFormat("yyyyMMddHHmmss");
            for (FileItem item : items) {
                // 其他参数
                String type = item.getContentType();
                if (type == null) {
                    continue;
                }
                // 文件参数
                fileName = item.getName();
                String fileExt = fileName.substring(fileName.lastIndexOf(".") + 1).toLowerCase();
                if (img.indexOf(fileExt) < 0) {
                    result.setStatus("1");
                    result.setMap("message", "请上传gif,jpg,jpeg,png,bmp格式图片。");
                    OutPrintUtil.OutPrint(response, result);
                    return;
                }
                if (item.getSize() > maxSize) {
                    result.setStatus("1");
                    result.setMap("message", "图片不能超出10M大小。");
                    OutPrintUtil.OutPrint(response, result);
                    return;
                }
                String newFileName = df.format(new Date()) + "_" + new Random().nextInt(1000) + "." + fileExt;
                // 设置保存文件路径
                String realPath = request.getServletContext().getRealPath("/upload");
                String saveUrl = request.getContextPath() + "/upload/";
                File dir = new File(realPath);
                File f = new File(dir, newFileName);
                item.write(f);
                String pp = realPath + "/" + newFileName;
                if (item.getSize() > 500 * 1024) {
                    // ImageTools.cutImage(300, 300, pp, pp);
                    compressPic(f, pp, item.getSize() > 1024l * 1024l ? "1" : "2", 0.9f);
                    // 压缩文件 大于1m 速度优先 0.9压缩质量 大小为300k左右
                }
                result.setMap("fileName", saveUrl + newFileName);
            }
        } catch (FileUploadException e) {
            e.printStackTrace();
        } catch (Exception e) {
            e.printStackTrace();
        }
        // 返回结果
        OutPrintUtil.OutPrint(response, result);
    }

    public static void compressPic(File file, String fileName, String flag, Float rat) {
        try {
            Image img = ImageIO.read(file);
            // 判断图片格式是否正确
            if (img.getWidth(null) == -1) {
                System.out.println(" can't read,retry!" + "<BR>");
            } else {
                int width = img.getWidth(null);
                int height = img.getHeight(null);
                int s = 1;
                if (width > 900 || height > 768) {
                    // 为等比缩放计算输出的图片宽度及高度
                    int rate1 = width / 900;
                    int rate2 = height / 768;
                    // 根据缩放比率大的进行缩放控制
                    s = rate1 > rate2 ? rate1 : rate2;
                }
                width = width / s;
                height = height / s;
                BufferedImage tag = new BufferedImage(width, height, BufferedImage.TYPE_INT_RGB);
                /*
                 * Image.SCALE_SMOOTH 的缩略算法 生成缩略图片的平滑度的 优先级比速度高 生成的图片质量比较好 但速度慢
                 */
                if (flag.equals("2")) {
                    tag.getGraphics().drawImage(img.getScaledInstance(width, height, Image.SCALE_SMOOTH), 0, 0, null);
                } else {
                    tag.getGraphics().drawImage(img, 0, 0, width, height, null);
                }
                FileOutputStream out = new FileOutputStream(fileName);
                // JPEGImageEncoder可适用于其他图片类型的转换
                JPEGImageEncoder encoder = JPEGCodec.createJPEGEncoder(out);
                // 压缩质量
                JPEGEncodeParam jep = JPEGCodec.getDefaultJPEGEncodeParam(tag);
                // 压缩质量
                jep.setQuality(rat, true);
                encoder.encode(tag, jep);
                out.close();
            }
            // System.out.println("压缩成功！");
        } catch (IOException ex) {
            ex.printStackTrace();
        }
    }
}
package com.spring.web.servlet;

import java.io.FileOutputStream;
import java.io.IOException;
import java.io.OutputStream;
import java.text.SimpleDateFormat;
import java.util.Date;
import java.util.Random;
import javax.servlet.ServletException;
import javax.servlet.annotation.WebServlet;
import javax.servlet.http.HttpServlet;
import javax.servlet.http.HttpServletRequest;
import javax.servlet.http.HttpServletResponse;
import sun.misc.BASE64Decoder;
import com.spring.web.result.Result;
import com.spring.web.result.ResultImpl;
import com.spring.web.util.OutPrintUtil;

@WebServlet("/ajaxUploadBase64")
public class AjaxUploadBase64 extends HttpServlet {
    private static final long serialVersionUID = 1L;

    protected void doGet(HttpServletRequest request, HttpServletResponse response) throws ServletException, IOException {
    }

    protected void doPost(HttpServletRequest request, HttpServletResponse response) throws ServletException,
            IOException {
        Result result = new ResultImpl();
        SimpleDateFormat df = new SimpleDateFormat("yyyyMMddHHmmss");
        String data = request.getParameter("data");
        String ext = request.getParameter("ext");
        String newFileName = df.format(new Date()) + "_" + new Random().nextInt(1000) + "." + ext;
        // 设置保存文件路径
        String realPath = request.getServletContext().getRealPath("/upload");
        String saveUrl = request.getContextPath() + "/upload/";
        if (!GenerateImage(data, realPath + "/" + newFileName)) {
            result.setStatus("1");
            result.setMap("message", "请上传gif,jpg,jpeg,png,bmp格式图片。");
            OutPrintUtil.OutPrint(response, result);
        } else {
            result.setMap("fileName", saveUrl + newFileName);
            OutPrintUtil.OutPrint(response, result);
        }
    }

    public static boolean GenerateImage(String imgStr, String imgFilePath) { // 对字节数组字符串进行Base64解码并生成图片
        if (imgStr == null || null == imgFilePath) // 图像数据为空
            return false;
        BASE64Decoder decoder = new BASE64Decoder();
        try {
            // Base64解码
            byte[] b = decoder.decodeBuffer(imgStr);
            for (int i = 0; i < b.length; ++i) {
                if (b[i] < 0) {// 调整异常数据
                    b[i] += 256;
                }
            }
            // 生成jpeg图片
            OutputStream out = new FileOutputStream(imgFilePath);
            out.write(b, 0, b.length);
            out.flush();
            out.close();
            return true;
        } catch (Exception e) {
            return false;
        }
    }

}

public class OutPrintUtil {     public static void OutPrint(HttpServletResponse response, Object obj) {         response.setHeader("Content-type", "text/html;charset=UTF-8");         response.setContentType("text/html;charset=utf-8");         Gson gson = new GsonBuilder().setDateFormat("yyyy-MM-dd").create();         String json = gson.toJson(obj);         try {             PrintWriter out = response.getWriter();             out.println(json);             out.flush();             out.close();         } catch (Exception e) {             e.printStackTrace();         }     } }

猜你喜欢

转载自blog.csdn.net/cgf_01/article/details/74547834
今日推荐
Apache Doris 2.0.10 版本正式发布！
开源日报 | 大模型开战；大模型独角兽被曝卖身；周鸿祎建议谷歌开源所有产品；最大开源AI社区提供1000万美元共享GPU
开源日报 | Chrome内置Gemini的意义不在于Gemini；中国AI追随之路的五大误区；ECharts创始人“下海”养鱼；谷歌I/O开发者大会什么都有，只是没有惊喜
微软回应中国区AI团队“打包赴美”传闻
基于大语言模型的开源知识库问答系统 MaxKB GitHub Star 数量突破 5,000 个！
美国拟限制 AI 大模型出口中国和俄罗斯
苹果将与 OpenAI 达成协议，将 ChatGPT 应用于 iPhone
周排行
阿里云短信服务平台注册
Windows下的字符串处理(1)
sqoop: mysql导入数据到hdfs, hive, hbase
commons.lang中常用的工具类
离线安装PostgreSQL11.6
使用PyTorch简单实现卷积神经网络模型
一文彻底搞定谱聚类
一道面试题引发的血案
One Chat for Mac(聊天工具)
TCP/IP的底层队列是如何实现的？
每日归档
更多
2024-05-17(34)
2024-05-16(6)
2024-05-15(24)
2024-05-14(0)
2024-05-13(18)
2024-05-12(0)
2024-05-11(38)
2024-05-10(38)
2024-05-09(35)
2024-05-08(42)

代码天地 © 2018 codetd.com

境外服务器   最新电视剧2022