最近碰到一个上传文件的需求,其实之前也做过但是都是search->copy 没有细究过,这次纯手工。
先看一下需要依赖的包:
<dependency>
<groupId>commons-fileupload</groupId>
<artifactId>commons-fileupload</artifactId>
<version>1.2.2</version>
</dependency>
<dependency>
<groupId>commons-io</groupId>
<artifactId>commons-io</artifactId>
<version>2.0.1</version>
</dependency>
然后看一下bean的配置
<bean id="multipartResolver" class="org.springframework.web.multipart.commons.CommonsMultipartResolver">
<property name="defaultEncoding" value="utf-8"/>
<!--代表上传文件大小的最大值 -1代表无限大-->
<property name="maxUploadSize" value="-1"/>
<!--如果文件大小小于maxInMemorySize 的时候 系统不会产生临时文件 直接将文件写在内存中 需要注意-->
<property name="maxInMemorySize" value="1"/>
</bean>
接下来看一下 controller层 自己随意写的 轻喷
package com.springapp.mvc; import org.apache.commons.fileupload.disk.DiskFileItem;
import org.apache.commons.io.FileUtils;
import org.springframework.stereotype.Controller;
import org.springframework.ui.Model;
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.ResponseBody;
import org.springframework.web.multipart.MultipartFile;
import org.springframework.web.multipart.commons.CommonsMultipartFile; import java.io.File;
import java.io.IOException; /**
* Simple to Introduction
*/
@Controller
public class FileController { @RequestMapping(value = "/upload", method = RequestMethod.POST)
public @ResponseBody void uploadFile(@RequestParam(value = "file") MultipartFile multipartFile, Model model) throws IOException {
CommonsMultipartFile cf = (CommonsMultipartFile) multipartFile;
DiskFileItem fi = (DiskFileItem) cf.getFileItem();
File file = fi.getStoreLocation();
String content = FileUtils.readFileToString(file);
model.addAttribute("content", content);
}
}
上面我进行了一下文件转换,读了一下文件内容
接下来看一下前端 原生form的
<form id="fileuploadForm" action="/upload" method="POST" enctype="multipart/form-data" class="cleanform">
<input id="file" type="file" name="file" />
<p><button type="submit">Upload</button></p>
</form>
再来一发angular 原生的
<a href="javascript:;" class="btn-small btn-blue in_block" ngf-select ng-model="upLoadFiles"
ng-click="changeStatus">上传</a>
js app这些就不写了从 controller开始吧 需要注入 Upload
function ConfigAuthController($scope, $rootScope, $http, Upload) { /**
* 开始上传
*/
function importFile() { $scope.showPop = false;
var files = $scope.upLoadFiles;
console.log(files); if (!files || files.length == 0) {
$scope.message = "请选择文件";
return false;
} for (var i = 0; i < files.length; i++) {
$scope.loadStatus = true;
var file = files[i];
if (file.type != "text/plain") {
$scope.message1="";
$scope.message = "请上传文件TXT格式";
showPopupDiv($('#layer_warning'));
return;
}
if (file.size > 5 * 1024 * 1024) {
$scope.message1="";
$scope.message = "上传的文件大小超过5M";
showPopupDiv($('#layer_warning'));
return;
}
//if($scope.workspaceEmpFilePath.checkStatus == false){
// $scope.message = "文件ID格式错误";
// showPopupDiv($('#layer_warning'));
// return;
//} Upload.upload({
url: '/workspaceAuth/upload',
file: file,
fileFormDataName: 'uploadFile'
}).progress(function (evt) {
var progressPercentage = parseInt(100.0 * evt.loaded / evt.total);
console.log('进度:' + progressPercentage + '% 文件名:' + evt.config.file.name);
}).success(function (data, status, headers, config) { if (data.checkStatus == false) {
//
return;
}
$scope.getFile = data;
alert("上传成功!")
}).error(function (data, status, headers, config) {
$scope.message = data.message;
$scope.loadStatus = false;
});
}
} }
暂时写到这 后续补充