web工程图片下载解决方案

最新推荐文章于 2026-04-19 04:04:46 发布

原创最新推荐文章于 2026-04-19 04:04:46 发布 · 908 阅读

本内容遵循CC 4.0 BY-SA版权协议

本文详细介绍了如何利用EasyUI控件和AJAX技术，通过异步方式实现微信公众号接收到的图片消息下载至本地。包括页面定义、控制器层处理、下载流程和相关代码实现。

微信公众号面对的是海量用户，有一些用户会主动给公众号发图片消息，现在有一个需求是：主动收集客户发送的图片，并能在后台形成查询表格和下载。该需求可以分为两个：1）解析图片消息入库；2）后台查询及下载；现在重点来说说下载的解决方案（图片已经被微信服务器转化成一个图片链接的方式）。

最开始想通过ajax的方式异步下载，网上找了很多代码，均未能调试成功，只好自己亲自操刀，采用简单而又实用的办法，流程如下：

1）页面定义

图片列表的每行后面定义一个下载按钮，页面定义form表单，定义图片隐藏控件，当用户点击下载按钮时，将图片url赋予隐藏控件，然后实现form表单提交，页面表格采用的是EasyUi控件。

<th data-options="field:'_operate',fitColumns:true,formatter:formatOper,resizable:false">操作</th>

<form action="dowload_image.xhtml">
	    <input type="hidden" id="picUrl" name="picUrl" value="" />
</form>

function formatOper(val, row, index) {
		return '<a  id=pic1 onclick="operate(' + index
				+ ');return false;" style="cursor:hand">下载</a>';

	}

	function operate(index) {
		$('#tt').datagrid('selectRow', index);
		var row = $('#tt').datagrid('getSelected');
		if (row) {
			$("#picUrl").val(row.picUrl);
			$("form").submit();
		}
	}

2）controller层处理

由于admin工程是内网环境，而图片需要在外网中调用接口，所以这里调用了web工程的接口，将流输出到admin的方法中，这里先下载到项目工程中，然后从项目工程中下载到本地：

（a）下载到项目中，并返回文件名

public String downloadImage(String picUrl,String filePath) throws IOException
    {
        // 调用wx项目接口，下载二维码图片
        picUrl = URLEncoder.encode(picUrl, "UTF-8");
        String urlStr = this.wxwebUrl+"/downloadPic.xhtml?picUrl=" + picUrl;
        logger.info("urlStr:"+urlStr);
        URLConnection conn = null;
        InputStream in = null;
        FileOutputStream out = null;
        // 下载图片
        URL url = new URL(urlStr);
        conn = url.openConnection();
        conn.setDoOutput(true);
        in = conn.getInputStream();

        String fileName = Util.generatorOrderSerialNumber()+".jpg";
        File uploadFile = new File(filePath);
        if (!uploadFile.exists())
        {
            logger.info("start to mkdir!filePath=["+filePath+"]");
            uploadFile.mkdir();
        }
        File img = new File(filePath,fileName);
        // 生成图片
        out = new FileOutputStream(img);
        byte[] buf = new byte[2048];
        int length = in.read(buf);
        while (length != -1)
        {
            out.write(buf, 0, length);
            length = in.read(buf);
        }
        in.close();
        out.close();
        return fileName;
    }

（b）从项目文件夹中下载到本地

 @RequestMapping(value = "dowload_image.xhtml", method = RequestMethod.GET)
    public void downloadImage(@RequestParam(value = "picUrl")
    String picUrl, HttpServletRequest request, HttpServletResponse response)
    {

        String filePath = request.getSession().getServletContext().getRealPath("upload");
        logger.info("image filePath:"+filePath);
        try
        {
            //调用wxweb接口，下载到wxadmin工程的upload文件夹
            String fileName = this.messageJournalService.downloadImage(picUrl, filePath);
            // 设置文件MIME类型
            response.setCharacterEncoding("UTF-8");
            response.setContentType(request.getSession().getServletContext().getMimeType(fileName));
            response.setHeader("Content-Disposition", "attachment;filename=" + fileName);
            //从本地工程的upload文件夹，下载到浏览器
            String fileUrl = request.getSession().getServletContext().getRealPath("upload") + System.getProperty("file.separator", "\\") + fileName;
            InputStream in = new FileInputStream(fileUrl);
            OutputStream out = response.getOutputStream();
            // 写文件
            int b;
            while ((b = in.read()) != -1)
            {
                out.write(b);
            }
            in.close();
            out.close();

        }
        catch (Exception e)
        {
            e.printStackTrace();
        }

    }