MySQL+SSM+Ajax上传图片问题的分析(图)
本文主要介绍了MySQL+SSM+Ajax上传图片问题。具有很好的参考价值。下面跟着小编一起来看下吧
第一次写上传图片的代码,碰到很多问题。昨天做了整整一天,终于在晚上的时候成功了。大声欢呼。
但是,做完之后,还是有很多问题想不通。所以在这里也算是写个笔记,日后忘记了可以回顾,也算请教各路朋友。(^_^)
Q.1. 网上说Ajax不能上传文件,但是这个说法并不是很多,也还是有蛮多通过Ajax上传文件的分享。
我也没有通过Ajax做出来,最后是通过AjaxSubmit这个方法写的。
Q.2. AjaxSubmit这个方法对文件上传的大小有默认限制吧。我选择大于100KB的文件上传就不能成功,小于100KB的就可以成功。
上传大于100KB的时候,浏览器console返回下面的提示。说明他还是执行了ajaxSubmit的success方法,并返回textStatus的值为success,但是XMLHttpRequest, 和 errorThrown的responseText返回的HTML代码内容是我在spring-web.xml配置的异常处理视图网页。
function postImg(){ if ($.trim($("#imgFile").val()) == "") { alert("请选择图片!"); return; } console.log($("#imgFile")[0].files[0].size);//小于100*1024,下面的请求就可以成功 var option = { url : '/cloudnote/user/insertUserPhoto.do', type : 'POST', // dataType : 'json', headers : {"ClientCallMode" : "ajax"}, //添加请求头部 success : function(XMLHttpRequest, textStatus, errorThrown){ console.log(XMLHttpRequest); console.log(textStatus); console.log(errorThrown); console.log("前端输出上传成功"); $("#imgClose").click(); }, error: function(XMLHttpRequest, textStatus, errorThrown) { console.log(XMLHttpRequest); console.log(textStatus); console.log(errorThrown); console.log("前端输出上传失败"); } }; $("#imgForm").ajaxSubmit(option); return false; }
前端HTML表单:
<form id="imgForm" > <p class="modal-content"> <p class="modal-header"> <button type="button" class="close" data-dismiss="modal" aria-hidden="true">×</button> <h4 class="modal-title" id="myModalLabel">修改头像</h4> </p> <p class="modal-body"> <input type="file" id="imgFile" name="imgFile"/> <input id="imgId" name="userId" value="${user.id }" style="display:none" /> </p> <p class="modal-footer"> <button type="button" class="btn btn-default" data-dismiss="modal" id="imgClose">关闭</button> <button type="button" class="btn btn-primary" onclick="postImg();" id="imgSubmit">上传</button> </p> </p> </form>
下面是后台的java代码(Controller)
//更新用户头像 @RequestMapping(value="/insertUserPhoto.do",method = RequestMethod.POST) public void insertUserPhoto( HttpServletRequest req, HttpServletResponse res){ System.out.println("----- 插入图片 -------"); try{ String id = req.getParameter("userId"); System.out.println(id); MultipartHttpServletRequest multipartRequest = (MultipartHttpServletRequest) req; MultipartFile file = multipartRequest.getFile("imgFile"); byte[] photo = file.getBytes(); boolean result = serv.insertUserPhoto(id, photo); res.setContentType("text/html;charset=utf8"); res.getWriter().write("result:" + result); }catch(Exception e){ e.printStackTrace(); } System.out.println("----- 插入图片end -------"); } /** * 读取用户头像 * @param req * @param res */ @RequestMapping(value="/readPhoto.do", method=RequestMethod.GET) public void readPhoto(HttpServletRequest req, HttpServletResponse res){ System.out.println("------readPohto-----"); String id = Utils.getSessionUserId(req); try { User user = serv.selectUserPhoto(id); res.setContentType("image/jpeg"); res.setCharacterEncoding("utf-8"); OutputStream outputStream = res.getOutputStream(); InputStream in = new ByteArrayInputStream(user.getPhoto()); int len = 0; byte[] buf = new byte[1024]; while((len = in.read(buf,0,1024)) != -1){ outputStream.write(buf, 0, len); } outputStream.close(); } catch (IOException e) { e.printStackTrace(); } System.out.println("-----readPohto end-----"); return; }
Service实现类
//查找用户图片(头像) public User selectUserPhoto(String id) throws ImageException { User user = userDao.findUserById(id); if(user == null){ throw new UserNameException("用户名不存在!"); } Map<String, Object> data = userDao.selectUserPhoto(id); System.out.println(data); user.setPhoto((byte[]) data.get("photo")); return user; } //更新用户图片(头像) public boolean insertUserPhoto(String userId, byte[] photo) throws ImageException, UserNameException { if(userId == null || userId.trim().isEmpty()){ throw new UserNameException("用户id不存在"); } User user = userDao.findUserById(userId); if(user == null){ throw new UserNameException("用户不存在"); } user.setPhoto(photo); int n = userDao.updateUserPhoto(user); System.out.println("插入图片:" + n); return n==1?true:false; }
实体类User的photo 是 byte[] 类型的;
数据库的photo是 longblob:
mapper映射器:
<!-- 更新图片 --> <update id="updateUserPhoto" parameterType="cn.tedu.note.entity.User"> UPDATE user set id = #{id}, photo = #{photo,jdbcType=BLOB} <!-- 这里试了,如果不加jdbcType=BLOB 会出错,虽然不是很理解,但也照做了 --> WHERE id = #{id} </update> <!-- 获取图片 --> <select id="selectUserPhoto" parameterType="String" resultType="Map"> SELECT id as id, photo as photo from user WHERE id=#{id} </select>
Spring-web.xml配置
<!-- 文件上传表单的视图解析器 --> <bean id="multipartResolver" class="org.springframework.web.multipart.commons.CommonsMultipartResolver"> <property name="maxUploadSize"><value>100000</value></property> <property name="defaultEncoding"><value>UTF-8</value></property> </bean>
以上是MySQL+SSM+Ajax上传图片问题的分析(图)的详细内容。更多信息请关注PHP中文网其他相关文章!

热AI工具

Undresser.AI Undress
人工智能驱动的应用程序,用于创建逼真的裸体照片

AI Clothes Remover
用于从照片中去除衣服的在线人工智能工具。

Undress AI Tool
免费脱衣服图片

Clothoff.io
AI脱衣机

Video Face Swap
使用我们完全免费的人工智能换脸工具轻松在任何视频中换脸!

热门文章

热工具

记事本++7.3.1
好用且免费的代码编辑器

SublimeText3汉化版
中文版,非常好用

禅工作室 13.0.1
功能强大的PHP集成开发环境

Dreamweaver CS6
视觉化网页开发工具

SublimeText3 Mac版
神级代码编辑软件(SublimeText3)

热门话题

可以通过以下步骤打开 phpMyAdmin:1. 登录网站控制面板;2. 找到并点击 phpMyAdmin 图标;3. 输入 MySQL 凭据;4. 点击 "登录"。

MySQL是一种开源的关系型数据库管理系统,主要用于快速、可靠地存储和检索数据。其工作原理包括客户端请求、查询解析、执行查询和返回结果。使用示例包括创建表、插入和查询数据,以及高级功能如JOIN操作。常见错误涉及SQL语法、数据类型和权限问题,优化建议包括使用索引、优化查询和分表分区。

Redis 使用单线程架构,以提供高性能、简单性和一致性。它利用 I/O 多路复用、事件循环、非阻塞 I/O 和共享内存来提高并发性,但同时存在并发性受限、单点故障和不适合写密集型工作负载的局限性。

选择MySQL的原因是其性能、可靠性、易用性和社区支持。1.MySQL提供高效的数据存储和检索功能,支持多种数据类型和高级查询操作。2.采用客户端-服务器架构和多种存储引擎,支持事务和查询优化。3.易于使用,支持多种操作系统和编程语言。4.拥有强大的社区支持,提供丰富的资源和解决方案。

MySQL在数据库和编程中的地位非常重要,它是一个开源的关系型数据库管理系统,广泛应用于各种应用场景。1)MySQL提供高效的数据存储、组织和检索功能,支持Web、移动和企业级系统。2)它使用客户端-服务器架构,支持多种存储引擎和索引优化。3)基本用法包括创建表和插入数据,高级用法涉及多表JOIN和复杂查询。4)常见问题如SQL语法错误和性能问题可以通过EXPLAIN命令和慢查询日志调试。5)性能优化方法包括合理使用索引、优化查询和使用缓存,最佳实践包括使用事务和PreparedStatemen

有效监控 Redis 数据库对于保持最佳性能、识别潜在瓶颈和确保整体系统可靠性至关重要。 Redis Exporter Service 是一个强大的实用程序,旨在使用 Prometheus 监控 Redis 数据库。 本教程将指导您完成 Redis Exporter Service 的完整设置和配置,确保您无缝建立监控解决方案。通过学习本教程,您将实现完全可操作的监控设置

SQL数据库错误查看方法有:1. 直接查看错误消息;2. 使用SHOW ERRORS和SHOW WARNINGS命令;3. 访问错误日志;4. 使用错误代码查找错误原因;5. 检查数据库连接和查询语法;6. 使用调试工具。

Apache 连接数据库需要以下步骤:安装数据库驱动程序。配置 web.xml 文件以创建连接池。创建 JDBC 数据源,指定连接设置。从 Java 代码中使用 JDBC API 访问数据库,包括获取连接、创建语句、绑定参数、执行查询或更新以及处理结果。
