php显示本地上传图片,js如何获取本地图片显示到浏览器并上传至服务器

这篇文章介绍的内容是关于浏览器显示本地图片的预览图，调用后端接口将图片上传至服务器，有着一定的参考价值，现在分享给大家，有需要的朋友可以参考一下

一、jsp页面

pageEncoding="UTF-8"%>

姓名

性别

男

女

上传图片

保存

二、controller接口/**

* 添加用户

* @param session

* @param request

* @param response

* @throws IOException

*/

@RequestMapping(value = "/addUser", method = RequestMethod.POST)

public void addUser(MultipartFile entImg,HttpSession session, HttpServletRequest request, HttpServletResponse response)

throws IOException {

String realName = request.getParameter("realName");//姓名

String gender = request.getParameter("gender");// 性别

//调用工具类上传图片

String userPic = FileUtils.uploadUser(entImg, request);

TestUser testUser = new TestUser();

testUser.setRealName(realName);

testUser.setGender(Integer.parseInt(gender));

testUser.setUserPic(userPic); // 添加人员信息及图片url到数据库

int res= userService.insertUser(testUser); if (res > 0) {

writeJSON(response, res);

} else {

writeJSON(response,null);

}

}

三、工具类public class FileUtils {

FILES_PATH("files_path"); // 此路径存放于jdbc.properties配置文件中，例如：files_path=D:/uploadImgs

private static final String path = PropertiesUtil.get(FILES_PATH)+"/user"; /**

* 上传图片URL

* @param fileName

* @param request

* @return

*/

public static String getPath(String fileName,HttpServletRequest request) {

String ip=IpUtil.getIP(); int port=request.getLocalPort();

StringBuilder sb=new StringBuilder();

sb.append("http://");

sb.append(ip);

sb.append(":");

sb.append(port);

sb.append("/uploadImgs/user/");

sb.append(fileName); return sb.toString();

} /**

* 以时间戳对上传文件进行重新命名

* @param file

* @return

*/

public static String renameFile(MultipartFile file) { if(file!=null) {

Long date=new Date().getTime();

String fileRealName=file.getOriginalFilename();

String prefix=fileRealName.substring(fileRealName.lastIndexOf(".")+1);

String fileName = date.toString()+"."+prefix;

return fileName;

} return null;

} /**

* 图片上传

* @param file

* @param fileName

*/

public static String uploadUser(MultipartFile file, HttpServletRequest request) { // 重命名

String renameFile = FileUtils.renameFile(file); // 图片名

String picPath = FileUtils.getPath(renameFile, request); // 上传

File targetFile = new File(borpath, renameFile); if (!targetFile.exists() && !targetFile.isDirectory()) {

targetFile.mkdirs();

} try {

file.transferTo(targetFile);

} catch (Exception e) {

e.printStackTrace();

} return picPath;

}

}

四、效果

3.图片上传成功后保存至指定文件夹下

4.数据库数据

相关推荐：