spring boot实现图片上传和下载功能

更新时间：2018年02月28日 12:43:49 作者：修炼中的菜鸟

这篇文章主要为大家详细介绍了spring boot实现图片上传和下载功能，具有一定的参考价值，感兴趣的小伙伴们可以参考一下

这篇博客简单介绍下spring boot下图片上传和下载，已经遇到的问题。首先需要创建一个spring boot项目。

1、核心的controller代码

package com.qwrt.station.websocket.controller; 
 
import com.alibaba.fastjson.JSONObject; 
import com.qwrt.station.common.util.JsonUtil; 
import org.slf4j.Logger; 
import org.slf4j.LoggerFactory; 
import org.springframework.beans.factory.annotation.Value; 
import org.springframework.web.bind.annotation.RequestMapping; 
import org.springframework.web.bind.annotation.RequestMethod; 
import org.springframework.web.bind.annotation.RequestParam; 
import org.springframework.web.bind.annotation.RestController; 
import org.springframework.web.multipart.MultipartFile; 
 
import javax.servlet.http.HttpServletRequest; 
import javax.servlet.http.HttpServletResponse; 
import java.io.*; 
 
/** 
 * Created by jack on 2017/10/30. 
 */ 
@RestController 
@RequestMapping("v1/uploadDownload") 
public class UploadDownloadController { 
 private static final Logger logger = LoggerFactory.getLogger(UploadDownloadController.class); 
 @Value("${uploadDir}") 
 private String uploadDir; 
 
 @RequestMapping(value = "/uploadImage", method = RequestMethod.POST) 
 public JSONObject uploadImage(@RequestParam(value = "file") MultipartFile file) throws RuntimeException { 
 if (file.isEmpty()) { 
  return JsonUtil.getFailJsonObject("文件不能为空"); 
 } 
 // 获取文件名 
 String fileName = file.getOriginalFilename(); 
 logger.info("上传的文件名为：" + fileName); 
 // 获取文件的后缀名 
 String suffixName = fileName.substring(fileName.lastIndexOf(".")); 
 logger.info("上传的后缀名为：" + suffixName); 
 // 文件上传后的路径 
 String filePath = uploadDir; 
 // 解决中文问题，liunx下中文路径，图片显示问题 
 // fileName = UUID.randomUUID() + suffixName; 
 File dest = new File(filePath + fileName); 
 // 检测是否存在目录 
 if (!dest.getParentFile().exists()) { 
  dest.getParentFile().mkdirs(); 
 } 
 try { 
  file.transferTo(dest); 
  logger.info("上传成功后的文件路径未：" + filePath + fileName); 
  return JsonUtil.getSuccessJsonObject(fileName); 
 } catch (IllegalStateException e) { 
  e.printStackTrace(); 
 } catch (IOException e) { 
  e.printStackTrace(); 
 } 
 return JsonUtil.getFailJsonObject("文件上传失败"); 
 } 
 
 //文件下载相关代码 
 @RequestMapping(value = "/downloadImage",method = RequestMethod.GET) 
 public String downloadImage(String imageName,HttpServletRequest request, HttpServletResponse response) { 
 //String fileName = "123.JPG"; 
 logger.debug("the imageName is : "+imageName); 
 String fileUrl = uploadDir+imageName; 
 if (fileUrl != null) { 
  //当前是从该工程的WEB-INF//File//下获取文件(该目录可以在下面一行代码配置)然后下载到C:\\users\\downloads即本机的默认下载的目录 
  /* String realPath = request.getServletContext().getRealPath( 
   "//WEB-INF//");*/ 
  /*File file = new File(realPath, fileName);*/ 
  File file = new File(fileUrl); 
  if (file.exists()) { 
  response.setContentType("application/force-download");// 设置强制下载不打开 
  response.addHeader("Content-Disposition", 
   "attachment;fileName=" + imageName);// 设置文件名 
  byte[] buffer = new byte[1024]; 
  FileInputStream fis = null; 
  BufferedInputStream bis = null; 
  try { 
   fis = new FileInputStream(file); 
   bis = new BufferedInputStream(fis); 
   OutputStream os = response.getOutputStream(); 
   int i = bis.read(buffer); 
   while (i != -1) { 
   os.write(buffer, 0, i); 
   i = bis.read(buffer); 
   } 
   System.out.println("success"); 
  } catch (Exception e) { 
   e.printStackTrace(); 
  } finally { 
   if (bis != null) { 
   try { 
    bis.close(); 
   } catch (IOException e) { 
    e.printStackTrace(); 
   } 
   } 
   if (fis != null) { 
   try { 
    fis.close(); 
   } catch (IOException e) { 
    e.printStackTrace(); 
   } 
   } 
  } 
  } 
 } 
 return null; 
 } 
 
 
}

上面的代码有两个方法，上面的方法是图片上传的方法，下面的方法是图片下载的方法。下载图片需要传入图片的文件名，在ios，android手机，谷歌浏览器测试，上传下载没有问题。

2、测试的html的核心代码如下，进行图片的上传和下载：

<!DOCTYPE html> 
<html> 
 
 <head> 
 <meta charset="UTF-8" /> 
 <title>websocket chat</title> 
 </head> 
 
 <body> 
 
 <div> 
  <label>输入信息：</label><input id="id" width="100px" /><br /> 
  <button id="btn">发送消息</button> 
  <button id="connection">websocket连接</button> 
  <button id="disconnection">断开websocket连接</button> 
  <br /><br /> 
  <form enctype="multipart/form-data" id="uploadForm"> 
  <input type="file" name="uploadFile" id="upload_file" style="margin-bottom:10px;"> 
  <input type="button" id="uploadPicButton" value="上传" onclick="uploadImage()"> 
  </form> 
  <!--<input type="file" onchange="uploadImgTest();" id="uploadImg" name="uploadImg" /> 
  <button id="uploadImage" onclick="uploadImage();">上传</button>--> 
 </div> 
  
  
 <div id="test"> 
 
 </div> 
  
 <hr color="blanchedalmond"/> 
 <div id="voiceDiv"> 
  
 </div> 
  
 <hr color="chartreuse" /> 
 <div id="imgDiv" style="width: 30%;height: 30%;"> 
  <img src="http://192.168.9.123:8860/v1/uploadDownload/downloadImage?imageName=123.JPG" style="width: 160px;height: 160px;"/> 
 </div> 
  
</body> 
 
 <script src="js/jquery-3.2.1.min.js"></script> 
 <!--<script th:src="@{stomp.min.js}"></script>--> 
 <script src="js/sockjs.min.js"></script> 
 
 <script> 
 var websocketUrl = "ws://192.168.9.123:8860/webSocketServer"; 
 var websocket; 
 if('WebSocket' in window) { 
  //websocket = new WebSocket("ws://" + document.location.host + "/webSocketServer"); 
  //websocket = new WebSocket("ws://192.168.9.123:9092/webSocketServer"); 
  //websocket = new WebSocket("ws://localhost:8860/webSocketServer"); 
  websocket = new WebSocket(websocketUrl); 
 } else if('MozWebSocket' in window) { 
  websocket = new MozWebSocket("ws://" + document.location.host + "/webSocketServer"); 
 } else { 
  websocket = new SockJS("http://" + document.location.host + "/sockjs/webSocketServer"); 
 } 
 websocket.onopen = function(evnt) { 
  console.log("onopen----", evnt.data); 
 }; 
 websocket.onmessage = function(evnt) { 
  //$("#test").html("(<font color='red'>" + evnt.data + "</font>)"); 
  console.log("onmessage----", evnt.data); 
  //$("#test").html(evnt.data); 
  $("#test").append('<div>' + event.data + '</div>'); 
 }; 
 websocket.onerror = function(evnt) { 
  console.log("onerror----", evnt.data); 
 } 
 websocket.onclose = function(evnt) { 
  console.log("onclose----", evnt.data); 
 } 
 $('#btn').on('click', function() { 
  if(websocket.readyState == websocket.OPEN) { 
  var msg = $('#id').val(); 
  //调用后台handleTextMessage方法 
  websocket.send(msg); 
  } else { 
  alert("连接失败!"); 
  } 
 }); 
 $('#disconnection').on('click', function() { 
  if(websocket.readyState == websocket.OPEN) { 
  websocket.close(); 
  //websocket.onclose(); 
  console.log("关闭websocket连接成功"); 
  } 
 }); 
 $('#connection').on('click', function() { 
  if(websocket.readyState == websocket.CLOSED) { 
  websocket.open(); 
  //websocket.onclose(); 
  console.log("打开websocket连接成功"); 
  } 
 }); 
 //监听窗口关闭事件，当窗口关闭时，主动去关闭websocket连接，防止连接还没断开就关闭窗口，server端会抛异常。 
 window.onbeforeunload = function() { 
  websocket.close(); 
 } 
 
 function uploadImgTest() { 
  
 
 } 
  
 function uploadImage(){ 
  //var uploadUrl = "http://localhost:8860/v1/uploadDownload/uploadImage"; 
 var uploadUrl = "http://192.168.9.123:8860/v1/uploadDownload/uploadImage"; 
 var downUrl = "http://192.168.9.123:8860/v1/uploadDownload/downloadImage" 
 var pic = $('#upload_file')[0].files[0]; 
 var fd = new FormData(); 
 //fd.append('uploadFile', pic); 
 fd.append('file', pic); 
 $.ajax({ 
  url:uploadUrl, 
  type:"post", 
  // Form数据 
  data: fd, 
  cache: false, 
  contentType: false, 
  processData: false, 
  success:function(data){ 
  console.log("the data is : {}",data); 
  if(data.code == 0){ 
   console.log("上传成功后的文件路径为："+data.data); 
   var img = $("<img />") 
   img.attr("src",downUrl+"?imageName="+data.data); 
   img.width("160px"); 
   img.height("160px"); 
   $("#imgDiv").append(img); 
  } 
   
  } 
 }); 
  
 } 
  
 </script> 
 
</html>

上面的代码有些和图片的上传和下载没有关系，根据需要自己去掉，看图片上传和下载的核心代码，需要引入jquery。

3、spring boot的属性配置：

1.解决图片上传太大的问题：

spring:
 http:
 multipart:
 max-file-size: 100Mb #文件上传大小
 max-request-size: 200Mb #最打请求大小

这是新版spring boot解决图片或者文件上传太大的问题，老板的不是这样解决的。可以自己查资料

2.配置文件上传保存的位置：

#上传位置
uploadDir: F:\mystudy\pic\

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

元宵节福利：

您可能感兴趣的文章:

MyBatis select标签的使用示例
MyBatis中,select 标签是最常用也是功能最强大的 SQL 语言,用于执行查询操作,本文就来介绍了MyBatis select标签的使用示例,具有一定的参考价值,感兴趣的可以了解一下
2023-10-10
Java的SPI机制实例详解
这篇文章主要介绍了Java的SPI机制实例详解的相关资料,需要的朋友可以参考下
2017-06-06
Java实现FTP上传与下载功能
这篇文章主要为大家详细介绍了Java实现FTP上传与下载功能，文中示例代码介绍的非常详细，具有一定的参考价值，感兴趣的小伙伴们可以参考一下
2022-02-02
java Spring Boot的介绍与初体验
大家好，本篇文章主要讲的是java Spring Boot的介绍与初体验，感兴趣的同学赶快来看一看吧，对你有帮助的话记得收藏一下
2022-01-01
Java匿名类和匿名函数的概念和写法
匿名函数写法和匿名类写法的前提必须基于函数式接口匿名函数写法和匿名类写法其本质是同一个东西，只是简化写法不同使用Lambda表达式简写匿名函数时，可以同时省略实现类名、函数名，这篇文章主要介绍了Java匿名类和匿名函数的概念和写法,需要的朋友可以参考下
2023-06-06
Springboot之idea之pom文件图标不对问题
这篇文章主要介绍了Springboot之idea之pom文件图标不对问题，具有很好的参考价值，希望对大家有所帮助。如有错误或未考虑完全的地方，望不吝赐教
2023-04-04
SpringBoot项目如何将Bean注入到普通类中
这篇文章主要介绍了SpringBoot项目如何将Bean注入到普通类中，具有很好的参考价值，希望对大家有所帮助。如有错误或未考虑完全的地方，望不吝赐教
2021-11-11
SpringCloud客户端报错:- was unable to send&nb
这篇文章主要介绍了SpringCloud客户端报错:- was unable to send heartbeat!的问题及解决方案，具有很好的参考价值，希望对大家有所帮助。如有错误或未考虑完全的地方，望不吝赐教
2022-05-05
Java集合之Set、HashSet、LinkedHashSet和TreeSet深度解析
这篇文章主要介绍了Java集合之Set、HashSet、LinkedHashSet和TreeSet深度解析,List是有序集合的根接口,Set是无序集合的根接口,无序也就意味着元素不重复,更严格地说,Set集合不包含一对元素e1和e2 ,使得e1.equals(e2) ,并且最多一个空元素,需要的朋友可以参考下
2023-09-09
Java基础之Math和Random类知识总结
今天带大家来学习java的Math和Random类,文中有非常详细的代码示例及介绍,对正在学习java基础的小伙伴们很有帮助哟,需要的朋友可以参考下
2021-05-05

spring boot实现图片上传和下载功能

相关文章

最新评论

大家感兴趣的内容

最近更新的内容

常用在线小工具