bootstrap fileinput 上传图片

首先jsp页面引用必要的文件，说明一下本人侧重讲上传图片功能，所以引入文件只列举与上传图片相关的文件，以下分别为css和js文件

<link rel="stylesheet" type="text/css" href="../css/plugins/webuploader/webuploader.css">
<link rel="stylesheet" type="text/css" href="../css/demo/webuploader-demo.min.css">
<link href="../css/fileinput.css" media="all" rel="stylesheet" type="text/css" />

<script src="../js/plugins/webuploader/webuploader.min.js"></script>
<script src="../js/demo/webuploader-demo.min.js"></script>

<div class="row">
<div class="ibox-content form-horizontal" style="padding-bottom: 0px">
<div class="row mt20">
<div class="form-group col-sm-4 col-md-8">
<label class="col-sm-4 col-md-3 control-label" >身份证正面：</label>
<div class="col-sm-8 col-md-8">
<input id="file-1" type="file"  class="file" data-overwrite-initial="false" data-min-file-count="1">
<p class="help-block">支持jpg、jpeg、png格式，大小不超过2.0M</p>
</div>
</div>
</div>

$("#file-1").fileinput({
language: 'zh',
uploadUrl: '${ctxPath}/uploadfile/upload.htm', //上传处理的路径
allowedFileExtensions : ['jpg', 'png','jpeg'],//支持的格式
overwriteInitial: true,
maxFileSize: 2000,//文件最大支持
maxFilesNum: 1,//文件数量
maxFileCount: 1,
showUpload: false, //是否展示上传按钮
dropZoneTitle: '这里上传身份证<br>可直接将图片拖入虚线框中！',
slugCallback: function(filename) {
return filename.replace('(', '_').replace(']', '_');
}
}).on("filebatchselected", function<
c55c
span class="hljs-params">(event, files) {
$(this).fileinput("upload");
})
.on("fileuploaded", function(event, data) {
$("#file-1").attr("filename",data.response);
});

@Controller
@RequestMapping("/uploadfile")
public class UploadCtrl {
@RequestMapping("/upload")
@ResponseBody
public Object upload(HttpServletRequest request){
UpdateUtils UpdateUtils = new AlibabaUpdateUtils();
FileItemFactory factory = new DiskFileItemFactory();
ServletFileUpload upload = new ServletFileUpload(factory);
upload.setHeaderEncoding("UTF-8");
try {
List items = upload.parseRequest(request);
String[] filenames = new String[1];
;
InputStream[] inputStreams = new InputStream[1];
if (null != items) {
Iterator itr = items.iterator();
int i = 0;
while (itr.hasNext()) {
FileItem item = (FileItem) itr.next();

if (item.isFormField()) {
continue;
} else if(StringUtils.isEmpty(item.getName())){
continue;
}else{
// 以当前精确到秒的日期为上传的文件的文件名
filenames[0] ="onccc" + System.currentTimeMillis();
}
inputStreams[0] = item.getInputStream();
}
}
AlibabaUpdateUtils.update(filenames, inputStreams);
URL url = AlibabaUpdateUtils.geturl(filenames[0], "122", "92");
JSONObject obj = new JSONObject();
obj.put("url", url.toString());
return url.toString();
}
} catch (Exception e) {
e.printStackTrace();
}
return null;

}

public class AlibabaUpdateUtils{

static String endpoint = null,accessKeyId = null,accessKeySecret = null,bucketName=null;
String keyPrefix;
public String getKeyPrefix() {
if(keyPrefix==null)
try {
keyPrefix = PropertieUtils.getProperty("aliyun.oss.key");
} catch (IOException e) {e.printStackTrace();}
return keyPrefix;
}

public void setKeyPrefix(String keyPrefix) {
this.keyPrefix = keyPrefix;
}

static{
try {
endpoint = PropertieUtils.getProperty("aliyun.oss.endpoint");
accessKeyId = PropertieUtils.getProperty("aliyun.oss.accessKeyId");
accessKeySecret = PropertieUtils.getProperty("aliyun.oss.accessKeySecret");
bucketName =  PropertieUtils.getProperty("aliyun.oss.bucketName");

} catch (IOException e) {e.printStackTrace();}
}
public List<String> update(String[] filenames, InputStream[] inputStreams) {
OSSClient ossClient = new OSSClient(endpoint, accessKeyId, accessKeySecret);

List<String> fileNameList = new ArrayList<String>();
for(int i =0;i<filenames.length;i++){
String fullfileName  = getKeyPrefix() +filenames[i];
ossClient.putObject(bucketName, fullfileName, inputStreams[i]);
fileNameList.add(fullfileName);
}
ossClient.shutdown();
return fileNameList;
}
public URL geturl(String filename,String w,String h) {

return geturl(filename, w, h, 10);
}
public URL geturl(String filename,String w,String h,long delay) {
OSSClient ossClient = new OSSClient(endpoint, accessKeyId, accessKeySecret);
// 图片处理样式
if(StringUtils.isEmpty(w))
w= "100";
if(StringUtils.isEmpty(h))
h= "100";
String style = "image/resize,m_fixed,w_"+w+",h_"+h;
// 过期时间10分钟

Date expiration = new Date(new Date().getTime() + 1000 * 60 * delay );
GeneratePresignedUrlRequest req = new GeneratePresignedUrlRequest(bucketName, getKeyPrefix()+filename, HttpMethod.GET);
req.setExpiration(expiration);
req.setProcess(style);
URL signedUrl = ossClient.generatePresignedUrl(req);
ossClient.shutdown();
return signedUrl;
}
}