SSM——(8)添加文件上传下载

目录

一、资料参考:

二、后台代码:

三、前台部分代码

四、效果截图


一、资料参考:

https://blog.youkuaiyun.com/shaohe18362202126/article/details/84206409

二、后台代码:

/**
 * @name: FileUpDownController
 * @description: 文件上传下载控制器
 * @author: StarFall
 * @data: 2019年2月26日下午10:39:52
 */
@RequestMapping("/file")
@Controller
public class FileUpDownController {
	/**
	 * 文件上传
	 * 
	 * @param desc
	 *            文件描述
	 * @param file
	 *            文件
	 * @return
	 * @throws Exception
	 *             异常
	 */
	@RequestMapping("/file_up_load")
	@ResponseBody
	public Map<String, Object> fileUpLoad(@RequestParam(value = "desc", required = false) String desc,
			@RequestParam(value = "file", required = false) MultipartFile file) throws Exception {
		String path = "D:/temp/";
		if (file != null && !file.isEmpty()) {
			String fileName = file.getOriginalFilename();
			File temp = new File(path, fileName);
			file.transferTo(temp);
			return ApiResult.SUCCESS.getMap();
		} else {
			return ApiResult.ERROR.getMap("文件不能为空!");
		}
	}

	/**
	 * 文件下载
	 * 
	 * @param fileName
	 *            文件名称
	 * @return
	 * @throws Exception
	 *             异常
	 */
	@RequestMapping(value = "/file_down_load")
	public ResponseEntity<byte[]> fileDowanLoad(@RequestParam(value = "fileName", required = false) String fileName)
			throws Exception {
		// 下载文件名称
		if (fileName == null) {
			fileName = "新建文本文档.txt";
		}
		// 下载文件路径
		String realPath = "D:/temp";
		File file = new File(realPath + File.separator + fileName);
		InputStream in = new FileInputStream(file);// 将该文件加入到输入流之中
		byte[] body = null;
		// 返回下一次对此输入流调用的方法可以不受阻塞地从此输入流读取(或跳过)的估计剩余字节数
		body = new byte[in.available()];
		// 读入到输入流里面
		in.read(body);
		// 下载显示的文件名,解决中文名称乱码问题
		fileName = new String(fileName.getBytes("UTF-8"), "iso-8859-1");

		// 设置响应头,通知浏览器以attachment(下载方式)打开图片
		HttpHeaders headers = new HttpHeaders();
		headers.add("Content-Disposition", "attachment;filename=" + fileName);
		HttpStatus statusCode = HttpStatus.OK;// 设置响应吗
		ResponseEntity<byte[]> responseEntity = new ResponseEntity<byte[]>(body, headers, statusCode);
		return responseEntity;
	}

}

三、前台部分代码

tips:调用下载功能,传入文件名中文乱码解决方法:https://blog.youkuaiyun.com/u012564085/article/details/80003283

<!-- 文件上传下载模块 -->
<div class="navbar-form navbar-right">
    <div class="form-group">
        <input type="file" id="file" class="form-control" />
        <input type="text" id="desc" class="form-control" placeholder="文件描述">
        <button type="button" id="up_file" class="btn btn-success">上传</button>
    </div>
    <a href="/file/file_down_load?fileName=新建文本文档.txt"><button type="button"  id="down_file"  class="btn btn-danger">下载</button></a>
</div>

/**
 * ajax实现文件上传
 */
$('#up_file').click(function() {
    var formData = new FormData();
    formData.append("file", document.getElementById("file").files[0]);
    formData.append("desc", $('#desc').val());
    $.ajax({
            url: '/file/file_up_load',
            type: 'POST',
            data: formData,
            contentType: false, //必须false才会自动加上正确的Content-Type
            processData: false,
            success: function(response) {
                if (response.code == 200) {
                    alert("上传成功!");
                    //清空input
                    $('#desc').val('');
                    var obj = document.getElementById('file');
                    obj.outerHTML = obj.outerHTML;
                } else if (response.code == 400) {
                    alert(response.errMsg);
                }
            }
        })
        .done(function() {
            console.log("success");
        })
        .fail(function() {
            alert("上传失败!!");
        })
        .always(function() {
            console.log("complete");
        });
});

四、效果截图

评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值