springMVC图片上传的处理方式详解

 更新时间:2017年08月25日 14:58:04   作者:dali_lyc  
这篇文章主要为大家详细介绍了springMVC图片上传的处理方式,具有一定的参考价值,感兴趣的小伙伴们可以参考一下

本文实例为大家分享了springMVC图片上传的处理方式,供大家参考,具体内容如下

首先需要依赖的jar包:

<dependency>
  <groupId>commons-io</groupId>
  <artifactId>commons-io</artifactId>
  <version>1.3.2</version>
</dependency>
<dependency>
  <groupId>commons-fileupload</groupId>
  <artifactId>commons-fileupload</artifactId>
  <version>1.2.1</version>
</dependency>

页面:

<a href="javascript:;" rel="external nofollow" class="a-upload">
  <input class="" type="file" name="file" id="file" required="required">上传
</a>

大家如果觉得默认的上传文件的按钮不好看,可以引入下面的css样式:

.a-upload {
 padding: 4px 10px;
 height: 27px;
 line-height: 27px;
 position: relative;
 cursor: pointer;
 color: #888;
 background: #fafafa;
 border: 1px solid #ddd;
 border-radius: 4px;
 overflow: hidden;
}
.a-upload input {
 position: absolute;
 width: 100%;
 right: 0;
 top: 0;
 opacity: 0;
 filter: alpha(opacity=0);
 cursor: pointer
}
.a-upload:hover {
 color: #444;
 background: #eee;
 border-color: #ccc;
 text-decoration: none
}

前端脚本:

$('#file').on('change', function () {
 var $this = $(this);
 var formData = new FormData();
 formData.append('file', $('#file')[0].files[0]);
 var fileName = $('#file')[0].files[0].name;
 var fileType = fileName.substring(fileName.lastIndexOf('.') + 1);
 var fileSize = $('#file')[0].files[0].size;
 if (fileType != 'jpg' && fileType != 'png' && fileType != 'gif') {
  alert("请上传.jpg、.png、.gif格式的图片!");
  return;
 }
 if (fileSize > 300 * 1024) {
  alert("请上传大小小于300KB的图片!");
  return;
 }
 $.ajax({
  url: '/admin/upload',
  type: 'POST',
  data: formData,
  cache: false,
  processData: false,
  contentType: false
 }).done(function (result) {
  if (result != '') {
   $this.closest('div').append('<div class="img-preview"><img src="' + result + '"/></div>');
  } else {
   alert("请上传.jpg、.png、.gif格式的图片!");
  }
 }).fail(function () {
  alert("图片上传失败!");
 });
});

后端接收:

 @RequestMapping(value = "admin/upload", method = RequestMethod.POST)
 @ResponseBody
 public String uploadFile(@RequestParam("file") MultipartFile file) {
  try {
   String filename = file.getOriginalFilename();
   if (filename.endsWith("jpg") || filename.endsWith("png") || filename.endsWith("gif")) {
    String prefix = filename.substring(filename.lastIndexOf("."));
    String imgName = UUID.randomUUID().toString() + prefix;
    String imgUri = writeToFileSystem(imgName, file.getBytes());
    return imgUri;
   }
  } catch (Exception e) {
   LOG.error("uploadFile failed:", e);
  }
  return null;
 }

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

相关文章

  • 浅谈MySQL中是如何实现事务提交和回滚的

    浅谈MySQL中是如何实现事务提交和回滚的

    本文主要介绍了MySQL中是如何实现事务提交和回滚的,文中通过示例代码介绍的非常详细,具有一定的参考价值,感兴趣的小伙伴们可以参考一下
    2022-02-02
  • 使用Java制作一个简单的记事本

    使用Java制作一个简单的记事本

    本文给大家带来的是使用Java制作一个简单的记事本的代码,有相同需要的朋友可以参考下
    2015-02-02
  • Java SpringSecurity+JWT实现登录认证

    Java SpringSecurity+JWT实现登录认证

    这篇文章主要介绍了Java SpringSecurity+JWT实现登录认证,首先通过给需要登录认证的模块添加mall-security依赖展开介绍,感兴趣的朋友可以参考一下
    2022-06-06
  • Java中对List去重 Stream去重的解决方法

    Java中对List去重 Stream去重的解决方法

    这篇文章主要介绍了Java中对List去重, Stream去重的问题解答,文中给大家介绍了Java中List集合去除重复数据的方法,需要的朋友可以参考下
    2018-04-04
  • 如何使用Resttemplate和Ribbon调用Eureka实现负载均衡

    如何使用Resttemplate和Ribbon调用Eureka实现负载均衡

    这篇文章主要介绍了如何使用Resttemplate和Ribbon调用Eureka实现负载均衡,具有很好的参考价值,希望对大家有所帮助。如有错误或未考虑完全的地方,望不吝赐教
    2022-03-03
  • java自定义JDBC实现连接池

    java自定义JDBC实现连接池

    本文主要介绍了java自定义JDBC实现连接池,包含实现JDBC连接池以及SQLException 异常的处理,文中通过示例代码介绍的非常详细,对大家的学习或者工作具有一定的参考学习价值,需要的朋友们下面随着小编来一起学习学习吧
    2024-02-02
  • 关于JFormDesigner的安装及破姐超详细教程

    关于JFormDesigner的安装及破姐超详细教程

    JFormDesigner是一种先进的图形用户界面Swing 的设计工具(非开源),具有一个独立的开发工具产品和基于不同开发工具如Eclipse、NetBeans等的开发插件,本文给大家介绍JFormDesigner安装破解教程,感兴趣的朋友一起看看吧
    2023-12-12
  • 解决新版idea新建文件没有XML和Resource Bundle文件问题

    解决新版idea新建文件没有XML和Resource Bundle文件问题

    这篇文章主要介绍了解决新版idea新建文件没有XML和Resource Bundle文件问题,具有很好的参考价值,希望对大家有所帮助,如有错误或未考虑完全的地方,望不吝赐教
    2024-07-07
  • Java实现简易界面通讯录

    Java实现简易界面通讯录

    这篇文章主要为大家详细介绍了Java实现简易界面通讯录,文中示例代码介绍的非常详细,具有一定的参考价值,感兴趣的小伙伴们可以参考一下
    2022-04-04
  • springboot中mybatis多数据源动态切换实现

    springboot中mybatis多数据源动态切换实现

    在开发中,动态数据源配置还是用的比较多的,比如在多数据源使用方面,又或者是在多个DB之间切换方面。这里给出一个动态数据源的配置方案,感兴趣的可以了解一下
    2021-07-07

最新评论