Ajax图片上传后的回显问题

问题描述

在很多时候我们都需要完成上传并保存到服务器的操作，同时我们也希望上传图片后能马上显示出自己刚上传的文件，如下图

出错原因

一开始的思路是利用ajax把图片存到项目里的某个目录下，然后返回路径，利用js进行显示，但是由于springboot部署的web项目是把项目打成war包部署到tomcat，而我们后台接收图片保存的路径还是在本地（没有到tomcat里），所以我一开始想利用ajax获取的返回值做路径去访问刚上传的图片的思路是错误的，写过bug的人都知道，一个bug解决不了困惑人好几天是很烦心的。后来我又不断尝试（尝试iframe、ajax等方法），终于意识到了本质的错误，想到了其实本地上传本地应该就有回显的方法，不需要利用ajax去获得存储图片的路径进行回显，终于，问题得到了解决。

解决方法

html

<form  th:id="'imageForm'+${book.book_id}" action="/postCommentImage" method="POST" enctype="multipart/form-data">
	 <!--进行显示图片的img-->
     <img src="" th:id="'showImage'+${book.book_id}" name="showImage" style="margin