网站百度指数,app开发制定公司,如何用网页制作网站,query post wordpress0. 基本步骤框架搭建实现带图片上传的注册功能实现下载功能1. 框架搭建Step1 创建开发项目创建基础MVC包结构#xff1a;controller、service、mapper、pojoStep2 导入jar包导入SpringMVC的jar、Spring的jar、MyBatis的jar、上传文件的jarStep3 配置文件配置applicationcontex…0. 基本步骤框架搭建实现带图片上传的注册功能实现下载功能1. 框架搭建Step1 创建开发项目创建基础MVC包结构controller、service、mapper、pojoStep2 导入jar包导入SpringMVC的jar、Spring的jar、MyBatis的jar、上传文件的jarStep3 配置文件配置applicationcontext.xml文件开启service包注解扫描配置数据库信息properties文件配置数据源bean配置SqlSession工厂bean配置mapper扫描bean记得把工厂依赖设置为属性注入配置事务管理配置springmvc.xml文件配置controller包注解扫描配置springmvc 注解驱动配置静态资源放行配置文件上传资源解析bean配置web.xml文件配置spring配置文件加载路径配置spring容器资源加载监听器配置SpringMVC的DispatcherServlet配置编码过滤器2. 实现带图片上传的注册功能基本思路Step1 先实现图片的异步上传反显图片获取图片上传后的存储路径Step2 将注册的数据、头像图片的存储路径一并提交至后台完成注册。2.1 JS实现图片异步上传实现思路Step1 首先引入jQuery文件Step2 添加注册按钮单击事件Step3 获取上传文件数据、利用FormData对象封装数据Step4 ajax方式提交后台注意processData设置为false、contentType设置为falseStep5 上传成功后回显图片将图片路径填至隐藏域具体JS实现图片上传方法$(function($(#uploadBtn).click(function(){// 获取上传文件var uploadPhoto $(#upload)[0].files[0];// 利用FormDate对象封装文件数据var formdata new FormData();formdata.append(uploadPhoto,uploadPhoto);$.ajax({url:regUpload,type:post,processData:false,contentType:false,//设置false将请求数据类型设置为multipart/form-datadata:formdata,success:function(data){if(data.result){alert(上传成功); $(#imageSpan).html();$(#imgPath).val(data.msg);}else{alert(上传失败原因data.msg);}}});});));2.2 后台处理上传的图片实现思路1、获取文件在服务器存储中的实际路径2、获取文件原始文件名随机生成文件名3、实际路径拼接随机文件名将文件存储至目标路径4、存储文件的原始名、随机名、文件类型至数据库5、返回上传结果、存储路径文件名具体代码如下RequestMapping(regUpload)ResponseBodypublic Result regUpload(MultipartFile uploadPhoto, HttpServletRequest request) throws IOException {// 业务处理// 1、获取文件在服务器存储中的实际路径String realPath request.getServletContext().getRealPath(/uploadImage/);File pathFile new File(realPath);if(!pathFile.exists()){pathFile.mkdirs();}// 2、获取文件原始文件名随机生成文件名String originalFilename uploadPhoto.getOriginalFilename();String suffix originalFilename.substring(originalFilename.lastIndexOf(.));String fileName UUID.randomUUID()suffix;// 3、实际路径拼接随机文件名将文件存储至目标路径uploadPhoto.transferTo(new File(realPathfileName));// 4、存储文件的原始名、随机名、文件类型至数据库String contentType uploadPhoto.getContentType();PhotoImage photoImage new PhotoImage(/uploadImage/fileName, originalFilename, fileName, contentType );System.out.println();int flag 0 ;try{flag photoImageService.insertImage(photoImage);}catch (Exception e){e.printStackTrace();}if(flag1){// 5、返回上传结果、存储路径文件名Result result new Result(true,uploadImage/fileName);return result;}else{return new Result(false,图片存储失败);}}2.3 html页面实现用户名密码上传文件2.4 实现用户信息注册功能实现思路Step1 用标签收集页面所有数据Step2 submit按钮提交至后台Step3 通过service、mapper存储具体实现代码RequestMapping(regUser)public String regUser(User user){// 业务处理int flag userService.insertUser(user);// 请求转发//return forward:register.jsp;return register;}3. 实现图片下载功能实现思路Step1 前台用超链接触发下载功能将要下载的文件名作为请求参数带上Step2 后台接收请求先设置响应头表明为下载请求:response.setHeader(Content-Disposition, attachment;filenamefilenName);Step3 获取文件的在硬盘上的绝对路径Step4 利用FileUtils将文件转成byte数组Step5 从相应对象中获取输出流将byte数组写出Step6 清除输出流的缓存、关闭输出流具体代码RequestMapping(downloadFile)public void downloadFile(String filename,HttpServletRequest req, HttpServletResponse resp) throws IOException {// Step2 后台接收请求先设置响应头表明为下载请求resp.setHeader(Content-Disposition, attachment;filenamefilename);// Step3 获取文件的在硬盘上的绝对路径String realPath req.getServletContext().getRealPath(/uploadImage/);// Step4 利用FileUtils将文件转成byte数组File file new File(realPath,filename);byte[] bytes FileUtils.readFileToByteArray(file);// Step5 从相应对象中获取输出流将byte数组写出ServletOutputStream os resp.getOutputStream();os.write(bytes);// Step6 清除输出流的缓存、关闭输出流os.flush();os.close();}
