用kissyui編輯器自帶的上傳圖片功能,其官方的demo如下:
從serverUrl中的upload.php中可以得到其接受返回值的形式爲:"\"imgUrl\":\"http://i.mmcdn.cn/simba/img/T1.DfbXXNiXXb1upjX.jpg?noq=y\""。
此時我們用springMvc做服務器端接受處理時也要在server端返回如上格式的數據:
/**
* 文本編輯器中的上傳圖片功能
*/
@RequestMapping("/shop_upload_file")
@ResponseBody
public SimpleJSONView shopUploadFile(HttpServletRequest request,Model model) throws Exception{
MultipartHttpServletRequest multipartRequest = (MultipartHttpServletRequest) request;
MultipartFile imgFile = multipartRequest.getFile("fileData");
if(imgFile == null || imgFile.isEmpty()){
return null;
}
String fileName = imgFile.getOriginalFilename();
String result = fileService.uploadFile(imgFile.getBytes(),fileName);
result = WebUtility.getFullFileServerURL()+"/"+result;
result = "{'imgUrl':'"+result+"'}";
logger.info("上傳文件返回的結果是:"+result);
model.addAttribute(FILE_RESULT,JSON.parse(result));
SimpleJSONView view = new SimpleJSONView();
view.setRenderedAttribute(FILE_RESULT);
return view;
}
在此例中重點需要關注上面紅色加粗的地方,如果直接返回result,前端是無法解析到的。