使用DropzoneJS上传图片，一步到位很给力！

使用DropzoneJS

1、效果如下所示：

2、前台HTML页面

3、后台处理请求

@POST@Path(“/myComponent”)@Produces(MediaType.APPLICATION_JSON)public Response uploadMyComponentImage(@Context HttpServletRequest request) {//当前登录的用户String userId = securitySupport.getSimplePrincipalByName(Principals.IDENTITY).getValue();//存放上传的图片Map<String, String> infoMap = new HashMap<String, String>();//使用较为原始的方法获取根路径String url = request.getSession().getServletContext().getRealPath(“/”);DiskFileItemFactory factory = new DiskFileItemFactory();ServletFileUpload upload = new ServletFileUpload(factory);try {Map<String, List<FileItem>> items = upload.parseParameterMap(request);for (Entry<String, List<FileItem>> entry : items.entrySet()) {String key = entry.getKey();Iterator<FileItem> itr = items.get(key).iterator();while (itr.hasNext()) {FileItem item = itr.next();//处理表单内容if (item.isFormField()) {System.out.println(“Form parameter name:” + item.getFieldName() + “,Form parameter value:” + item.getString(“UTF-8″));} else {//处理上传文件if (item.getName() != null && !””.equals(item.getName())) {System.out.println(“Upload file size:” + item.getSize());System.out.println(“Upload file type:” + item.getContentType());System.out.println(“Upload file name:” + item.getName());String newfileUrl = “mocks\\images\\” + userId + “\\description\\”;String newfileName = UUID.randomUUID().toString() + “-” + item.getName();System.out.println(“Upload file url:” + url + newfileUrl + newfileName + “\n”);infoMap.put(“newfile”, newfileUrl.replaceAll(“\\\\”, “/”) + newfileName);File file = new File(url + newfileUrl);if (!file.exists()) {file.mkdirs();}file = new File(url + newfileUrl + newfileName);item.write(file);} else {infoMap.put(“”, “”);}}}}} catch (FileUploadException e) {e.printStackTrace();} catch (Exception e) {e.printStackTrace();}return Response.ok(infoMap).build();}

4、查看上传之后的图片JS

var MyComponents = $resource(‘rest/components/myComponents’);MyComponents.query({}, .myComponents = data; });

5、页面中遍历显示输出

=====>

markdown用起来还不是太习惯啊

，环境不会改变，解决之道在于改变自己。

相关文章：

你感兴趣的文章：

标签云：