KindEditor脚本上传图片及浏览器强制下载文件

项目中用到了,扒下来学习记录一下

首先将文本域ID设置为KindEditor

	<textarea id="content" name="content"  ></textarea>
 //KindEditor脚本
    var editor;
    KindEditor.ready(function(K) {
        editor = K.create('#content', {
        	uploadJson: '/file/kkupload?cate=kk',
        	allowFileManager: false,
        });
    });
    
    var uploader = WebUploader.create({

		auto: true,
		
	    // swf文件路径
	    swf: '/lib/uploader/Uploader.swf',
	
	    // 文件接收服务端。
	    server: '/file/upload?cate=cms',
	
	    // 选择文件的按钮。可选。
	    // 内部根据当前运行是创建,可能是input元素,也可能是flash.
	    pick: '#picker',
	
	    accept: {
	        title: 'Images',
	        extensions: 'gif,jpg,jpeg,bmp,png',
	        mimeTypes: 'image/*'
	    }
	});
	
	uploader.on('uploadProgress', function (file, percentage) {
	    $( '#progress' ).text( Math.round(percentage * 1000) / 10 + '%' );
	});
	
	// 文件上传成功,
	uploader.on( 'uploadSuccess', function( file, resp ) {
	    $( '#cover' ).attr("src", resp.fileUrl);
	    $( '#coverUrl' ).val(resp.fileUrl);
	    
	});

然后当我选择文件上传的时候,根据url提交,

这个参数cate没有什么用,在代码中为了区分上传来源生成路径,以便管理

接下来就是Controller的代码了

根据自己的知识层面,把注释加上,方便以后查阅

 private Map<String, Object> getError(String message) {
        Map<String, Object> msg = new HashMap<String, Object>();
        msg.put("error", 1);
        msg.put("message", message);
        return msg;
    }
    @RequestMapping(value="kkupload")
    @ResponseBody
    public Map<String, Object> kkUpload(
            @RequestParam("cate")String cate,
            HttpServletRequest request,
            HttpServletResponse response) {

        try {
            //用于判断是普通表单,还是带文件上传的表单。
            if (!ServletFileUpload.isMultipartContent(request)) {
                //上传内容不是有效的multipart/form-data类型
                return getError("请选择文件。");
            }

            FileItemFactory factory = new DiskFileItemFactory();
            ServletFileUpload upload = new ServletFileUpload(factory);
            upload.setHeaderEncoding("UTF-8");

            MultipartHttpServletRequest multipartRequest = (MultipartHttpServletRequest) request;
            Iterator<String> item = multipartRequest.getFileNames();
            while (item.hasNext()) {

                String name = (String)item.next();
                MultipartFile file = multipartRequest.getFile(name);

                String fileName = System.currentTimeMillis()+"_"+file.getOriginalFilename().toLowerCase();

                String objectName = cate + "/" + fileName;

                BufferedImage bimg = ImageIO.read(file.getInputStream());

                ByteArrayOutputStream baos = null;
                //如果图片不合格, 太宽则重设图片
                int imgW = bimg.getWidth();
                if (imgW > 1111) {
                    imgW = 1111;
                    //如果超宽,则按比例缩小高度,
                    // 这个算数自己举个例子就算出来了(我一开始懵的,例子也记下来吧)
                    //例 oldH 4000  oldW 2000
                    //设置newW :1000
                    // newH  =oldH * newW / oldW
                    // newH  =4000 * 1000 / 2000 = 2000
                    //算下来以后新的高 宽就是2000*1000
                    int imgH = Math.round( bimg.getHeight() * 1111.0f / bimg.getWidth() );

                    BufferedImage simg = new BufferedImage(imgW, imgH, BufferedImage.TYPE_INT_RGB);
                    Graphics2D g = simg.createGraphics();
                    // 实现不透明 SRC 规则的 AlphaComposite 对象,具有 1.0f 的 alpha 值。
                    g.setComposite(AlphaComposite.Src);
                    // img是要加载的图像,x,y是指定绘制图像矩形左上角的位置,
                    // width是指定绘制图像矩形的宽,width是指定绘制图像矩形的高,observer是要绘制图像的容器。
                    g.drawImage(bimg, 0, 0, imgW, imgH, null);
                    g.dispose();

                    baos = new ByteArrayOutputStream();
                    //ImageIO.writer方法生成指定的格式的图像
                    ImageIO.write(simg, "jpg", baos);
                }


                //以下为京东云存储上传代码,可以忽略  
                //有兴趣的童鞋可以http://help.jd.com/jos/question-921.html 这里了解一下
                //ossConfig是自己写的配置文件set/get方法类,不是一个公共类,网上找不到的,不要误导了大家
                
                //ClientConfig当前为默认配置,用户可根据需要自行配置,如设置连接超时时间等
                ClientConfig config = new ClientConfig();
                //构造JingdongStorageService实例
                //AccessKey与SecretKey是用户访问京东云存储API的身份标识
                Credential credential = new Credential(ossConfig.getAccessKeyId(), ossConfig.getAccessKeySecret());
                JingdongStorageService jss = new JingdongStorageService(credential,config);
                //配置endPoint
                jss.setEndpoint(ossConfig.getEndPoint());
                //创建objectService实例
                // Bucket是存放“文件”(云存储称之为Object,)的容器,所有的Object都必须存放到某个Bucket中
                ObjectService objectService = jss.bucket(ossConfig.getBucket()).object(objectName);
                //使用低冗余存储,则使用该句代码
                //objectService.getBuilder().getHeaders().put(JssHeaders.X_JSS_STORAGE_CLASS, StorageClass.ReducedRedundancy.toString());
                if (baos == null) {
                    //获取流长度
                    long contentLength = file.getSize();
                    //设置上传文件Content-type为"text/html"。函数返回上传数据的Etag,目前Etag的值为上传数据的MD5
                    String md5 = objectService.entity(contentLength, file.getInputStream()).put();
                } else {
                    long contentLength = baos.size();
                    String md5 = objectService.entity(contentLength, new ByteArrayInputStream(baos.toByteArray())).put();
                }

                //若对上传文件进行加密,则使用该句代码
                //String md5 = objectService.entity(contentLength,inputStream).contentType("text/html").put(true);
                //System.out.println(md5);

                //JingdongStorageService对象内部维护一组HTTP连接池,在不使用该对象之前需要调用其destroy方法关闭连接池,
                //请注意,一旦调用destroy方法,该对象就不能再次被使用,否则将会抛出异常。
                jss.destroy();

                String fileUrl = "http://" + ossConfig.getOuterDomain() + "/" + cate + "/" + fileName;

                Map<String, Object> msg = new HashMap<String, Object>();
                msg.put("error", 0);
                msg.put("url", fileUrl);

                return msg;
            }

            return null;

        } catch (IOException e) {
            System.out.println(e.toString());

            return getError(e.getMessage());
        }
    }

再往下就是down代码了.网上应该有很多,这里我也make一下,这个代码就简单了

@GetMapping("/down")
	public void Down(HttpServletRequest req, HttpServletResponse resp) throws ServletException, IOException {
		 req.setCharacterEncoding("UTF-8");
		    String name = req.getParameter("name");//获取要下载的文件名
		    //第一步:设置响应类型
		    resp.setContentType("application/force-download");//应用程序强制下载
		    //第二读取文件
		    //String path = getServletContext().getRealPath("/up/"+name);
		    String url = req.getParameter("url");
		    //URL url1 = new URL(url);  
		    //InputStream in = new BufferedInputStream(url1.openStream());  
		    
	  	    //设置响应头,对文件进行url编码
		    name = URLEncoder.encode(name, "UTF-8");
		    resp.setHeader("Content-Disposition", "attachment;filename="+name);   

		    OutputStream out = resp.getOutputStream();
		    
		    CloseableHttpClient httpclient = HttpClients.createDefault();
		    HttpGet httpGet = new HttpGet(url);
		    CloseableHttpResponse httpResp = httpclient.execute(httpGet);
            try {
                HttpEntity httpEntity = httpResp.getEntity();
    		    resp.setContentLength((int)httpEntity.getContentLength());
                IOUtils.copy(httpEntity.getContent(), out);
            } catch (Exception ex) {
            	httpclient.close();
            }
            
		  
		    //第三步:老套路,开始copy
		    //OutputStream out = resp.getOutputStream();
		    //byte[] b = new byte[65536];
		    //int len = 0;
		    //while((len = in.read(b))!=-1){
		    //  out.write(b, 0, len);
		    //}
		    out.flush();
		    out.close();
		    //in.close();
	}
    

猜你喜欢

转载自blog.csdn.net/qq_16513911/article/details/81367196
今日推荐