<script type="text/javascript" src="${STATIC_FILE_PATH}/js/jPlug/uploadify/jquery.uploadify.min.js${STATIC_FILE_VERSION}"></script>: javascript
2:腳本內容: css
以下參數你還沒搞懂的話 ,請查閱官方文檔,地址:http://www.uploadify.com/documentation/ html
<script type="text/javascript">
$(document).ready(function(){
$(function() {
$('#file_upload').uploadify({
'swf' : '${STATIC_FILE_PATH}/js/jPlug/uploadify/uploadify.swf',
'uploader' : '${CONTEXT_PATH}/shop/upload.html',
'height': 25,
'whith' :120,
'auto' : false,
'fileDataName':'file',
'buttonText' : '選擇圖片...',
'fileTypeExts' : '*.gif; *.jpg; *.png',
'multi' : false,
'method' :'post',
'debug':true,
'onUploadStart' : function(file) {
var param = {};
param.picHref = $('#file_upload_href').val();
$("#file_upload").uploadify("settings", "formData", param);
},
'onUploadSuccess' : function(file, data, response) {
var imgUrl = uploadCommon.getPath(data);
$("#imgUrl").val(imgUrl);// 返回的圖片路徑保存起來
$("#thumbImg").attr("src", IMAGE_FILE_PATH + imgUrl);// 更新logo顯示
/*uploadCommon.uploadImageBtnStyle("imgUrl");
uploadCommon.initPreviewAfterUpload(data); // 新圖片預覽*/
},
'onUploadError' : function(file, errorCode, errorMsg, errorString) {
alert('The file ' + file.name + ' could not be uploaded: ' + errorString);
}
});
});
});
</script>
java
2:<body>內容: jquery
<body >
<input id="file_upload" type="file" name="file"/>
<a href="javascript:$('#file_upload').uploadify('upload', '*')">上傳文件</a> | <a href="javascript:$('#file_upload').uploadify('stop')">中止上傳!</a>
</body> app
3:後臺controller: dom
@RequestMapping(value = "/shop/upload",method=RequestMethod.POST)
@ResponseBody
public Object uploadHandlerForUploadify(String picHref,HttpServletRequest request)
throws Exception {
Integer userID = 0;
MultipartHttpServletRequest multipartRequest = (MultipartHttpServletRequest) request;
MultipartFile multipartFile = multipartRequest.getFile("Filedata");
/** 寫文件前先讀出圖片原始高寬 **/
byte[] bytes = multipartFile.getBytes();
InputStream is = new ByteArrayInputStream(bytes);
int width = 0; // 原始圖片寬
int height = 0; // 原始圖片高
try {
BufferedImage bufimg = ImageIO.read(is);
// 只有圖片才獲取高寬
if (bufimg != null) {
width = bufimg.getWidth();
height = bufimg.getHeight();
}
is.close();
} catch (Exception e) {
e.printStackTrace();
loger.error(e.getMessage());
is.close();
throw new Exception("uploadify上傳圖片讀取圖片高寬時發生異常!");
}
/** 拼成完整的文件保存路徑加文件 **/
String originalFilename = multipartFile.getOriginalFilename(); // 文件全名
String suffix = StringUtil.substringAfter(originalFilename, "."); // 後綴
// 文件名轉碼
// fileName = Base64.StringToBase64(fileName);
// fileName = StringUtil.join(fileName, suffix);
UploadFilePathVO uploadFile = UploadFilePathUtil.initFileUpload(userID, "test", suffix, width, height);
File file = new File(uploadFile.getRealPath());
multipartFile.transferTo(file); 工具
return uploadFile;
} post
4:自定義的上傳路徑工具類: spa
/**
* 獲取圖片上傳路徑(處理高寬)
*
* @return
*/
public static UploadFilePathVO initFileUpload(Integer userID, String imageType, String suffix, int width, int height) {
String randomKey = RandomUtil.getRandomString(6);
Date date = new Date();
String dateStr = new SimpleDateFormat("yyyyMMdd").format(date);
String timeStr = new SimpleDateFormat("HHmmssSSS").format(date);
int hashcode = Math.abs(userID.hashCode() % 256);
String relativePath = StringUtil.join(imageType, "/", hashcode, "/", userID, "/", dateStr, "/");
String realPath = StringUtil.join(Constants.UPLOAD_REALPATH, "/", relativePath);
File logoSaveFile = new File(realPath);
if (!logoSaveFile.exists()) {
logoSaveFile.mkdirs();
}
// 圖片文件名: 時間戳 + 隨機串 + 高寬
String fileName = StringUtil.join(timeStr, randomKey, '_', height, '_', width, '.', suffix);
UploadFilePathVO uploadFile = new UploadFilePathVO();
uploadFile.setRelativePath(StringUtil.join(relativePath, fileName));
uploadFile.setRealPath(StringUtil.join(realPath, fileName));
return uploadFile;
}
5:UploadFilePathVO類:
public String realPath; public String relativePath; private int imgHeight; // 上傳圖片的高 private int imgWidth; // 寬