SSH框架之上传图片到项目文件夹下并在前端显示
1.前端jsp页面上传代码
<form action=\"sendMessage.action\" method=\"post\" enctype=\"multipart/form-data\">
<label>类别</label>
<select name=\"category\">
<option value=\"1\">书籍</option>
<option value=\"2\">服饰</option>
<option value=\"3\">证件</option>
<option value=\"4\">其他</option>
</select><br>
<label>描述</label>
<input type=\"text\" name=\"content\"><br>
<label>图片</label>
<input type=\"file\" name=\"upload\"><br>
<input type=\"submit\" value=\"发布\">
</form>
2.后台action将上传的图片保存,将保存的图片路径存入数据库
public String send() {
//保存图片,返回路径
String path=messageService.savePhoto(upload);
User user=(User) ActionContext.getContext().getSession().get(\"user\");
Message message=new Message();
message.setMessageUserid(user.getUserId()+\"\");
message.setMessagePhoto(\"images/\"+path);
message.setMessageCategotyid(1);
message.setMessageDe ion(content);
message.setMessageDate(new Date());
//存入数据库
messageService.saveMessage(message);
return \"success\";
}
3.保存图片的方法
public String savePhoto(File upload) {
// TODO Auto-generated method stub
//生成随机字符串
String sources=\"2549hgtflkjadsf89nbvcMNBVCxZwe5989iuytFFJHGfDASwERtrty\";
Random random=new Random();
StringBuilder stringBuilder=new StringBuilder();
for(int i=0;i<5;i++) {
stringBuilder.append(sources.charAt(random.nextInt(sources.length()))+\"\");
}
String str=stringBuilder.toString();
String path=\"D:\\\\JavaWeb\\\\eclipse\\\\workspace\\\\lostandfoundSSH3\\\\WebContent\\\\images\\\\\"+str+\".jpg\";
//2.保存照片
File file=new File(path);
if(!file.exists()){
try {
file.createNewFile();
} catch (IOException e) {
e.printStackTrace();
return \"0\";
}
}
if(upload==null) {
System.out.println(\"upload is null\");
}
if(!file.exists()) {
System.out.println(\"file is null\");
}
try{
FileUtils.copyFile(upload,file);
}catch (IOException e){
e.printStackTrace();
return \"0\";
}
return str+\".jpg\";
}
4.通过查询数据库获取图片路径,将路径传给前端,显示图片
<c:forEach var=\"post\" items=\"${postList}\">
<div>
<img class=\"avatar\" alt=\"头像\" src=\"images/myLove.jpg\">
<label><c:out value=\"${post.getUser().getUserName()}\" /></label><br>
</div>
<div class=\"content\">
<a href=\"#\"><c:out value=\"${post.getMessageDe ion()}\" /></a>
</div>
<div>
<img class=\"content-img\" alt=\"img-content\" src=\"${ post.getMessagePhoto()}\">
</div>
<div >
<a href=\"#\"><img class=\"comment-img\" alt=\"comment\" src=\"images/comment.png\"></a>
</div>
<div class=\"date\">
<c:out value=\"${post.getMessageDate()}\" /><br>
</div>
<div class=\"div\"></div>
</c:forEach>
5.因为图片存储在项目文件下,当上传图片成功后,即使刷新页面前端也不能显示图片,需要刷新一下项目文件,再次刷新web页面才能显示图片
继续阅读与本文标签相同的文章
下一篇 :
5G商用在即!移动或将成为最大赢家
-
Hi拼团,第六代云服务器拼团购买更便宜,低至148元/年
2026-05-18栏目: 教程
-
汇编(五)栈、CPU提供的栈机制、push、pop指令
2026-05-18栏目: 教程
-
为什么绝大部分公司用钉钉上班不用微信,其实原因很简单
2026-05-18栏目: 教程
-
谷歌证实Pixel 4不支持Daydream,VR头显盒子也将停售
2026-05-18栏目: 教程
-
图解:抛弃IDE使用编译器亲手编译C
2026-05-18栏目: 教程
