欢迎您访问程序员文章站本站旨在为大家提供分享程序员计算机编程知识!
您现在的位置是: 首页  >  IT编程

spring boot实现上传图片并在页面上显示及遇到的问题小结

程序员文章站 2023-12-04 11:45:58
最近在使用spring boot搭建网站的过程之中遇到了这样一个问题:用户注册时需要上传一个属于自己的头像,注册成功之后跳转到个人中心,在个人中心中显示用户信息.其中在显示...

最近在使用spring boot搭建网站的过程之中遇到了这样一个问题:用户注册时需要上传一个属于自己的头像,注册成功之后跳转到个人中心,在个人中心中显示用户信息.其中在显示头像的时候遇到了问题:上传头像的时候,我把头像存放到了项目文件下的static文件夹中,将其地址存放到了数据库对应的用户中,并且在idea中添加了热部署,但是在注册跳转到个人中心后还是无法显示头像,只有在下一次启动项目进入到个人中心时才可以。

被这个问题困扰了许久,最后是这样的解决的:在main目录下新建了一个webapp文件夹,并且对其路径进行了配置。下面是一个解决方案的小demo,做的比较简单,请见谅~~核心代码如下:

注册界面:

<!doctype html>
<html lang="en" xmlns:th="http://www.thymeleaf.org">
<head>
 <meta charset="utf-8"/>
 <title>title</title>
</head>
<body>
<form action="/zhuce" th:action="@{/zhuce}" method="post" enctype="multipart/form-data" >
 <label>姓名</label><input type="text" name="name"/>
 <label>密码</label><input type="password" name="password"/>
 <label>上传图片</label>
 <input type="file" name="file"/>
 <input type="submit" value="上传"/>
</form>
</body>
</html>

control如下:

package com.example.demo.control;
import com.example.demo.dao.userrepository;
import com.example.demo.domain.user;
import org.springframework.beans.factory.annotation.autowired;
import org.springframework.stereotype.controller;
import org.springframework.ui.model;
import org.springframework.web.bind.annotation.getmapping;
import org.springframework.web.bind.annotation.postmapping;
import org.springframework.web.bind.annotation.requestparam;
import org.springframework.web.multipart.multipartfile;
import java.io.*;
/**
 * created by 18274 on 2017/8/9.
 */
@controller
public class control {
 @autowired
 userrepository userrepository;
 @getmapping(value="/zhuce")
 public string zhuce(){
 return "zhuce";
 }
 @postmapping(value="/zhuce")
 public string tijiao(@requestparam(value="name") string name,
    @requestparam(value="password") string password,
    @requestparam(value="file")multipartfile file,
    model model) {
 user user = new user();
 user.setusername(name);
 user.setpassword(password);
 if (!file.isempty()) {
  try {
  bufferedoutputstream out = new bufferedoutputstream(
   new fileoutputstream(new file("f:\\旗杯\\demo5\\src\\main\\webapp\\"+name+".jpg")));//保存图片到目录下
  out.write(file.getbytes());
  out.flush();
  out.close();
  string filename="f:\\旗杯\\demo5\\src\\main\\webapp\\"+name+".jpg";
  user.settupian(filename);
  userrepository.save(user);//增加用户
  } catch (filenotfoundexception e) {
  e.printstacktrace();
  return "上传失败," + e.getmessage();
  } catch (ioexception e) {
  e.printstacktrace();
  return "上传失败," + e.getmessage();
  }
  model.addattribute(user);
  return "permanager";
 } else {
  return "上传失败,因为文件是空的.";
 }
 }
}

个人中心:

<!doctype html>
<html lang="en" xmlns:th="http://www.thymeleaf.org">
<head>
 <meta charset="utf-8"/>
 <title>title</title>
</head>
<body>
<p>用户名:</p>
<p th:text="${user.username}"></p>
<p>图片:</p>
<img th:src="@{${user.username}+'.jpg'}"/>
</body>
</html>

对webapp路径的配置

package com.example.demo.config;
import org.springframework.context.annotation.configuration;
import org.springframework.web.servlet.config.annotation.resourcehandlerregistry;
import org.springframework.web.servlet.config.annotation.webmvcconfigureradapter;
/**
 * created by 18274 on 2017/8/9.
 */
@configuration
public class mywebappconfigurer extends webmvcconfigureradapter{
 @override
 public void addresourcehandlers(resourcehandlerregistry registry) {
 registry.addresourcehandler("/src/main/webapp/**").addresourcelocations("classpath:/webapp/");
 super.addresourcehandlers(registry);
 }
}

对应的用户实体类:

package com.example.demo.domain;
import javax.persistence.entity;
import javax.persistence.generatedvalue;
import javax.persistence.id;
/**
 * created by 18274 on 2017/8/9.
 */
@entity
public class user {
 @id
 @generatedvalue
 private long id;
 private string username;
 private string password;
 private string tupian;//图片地址
 public user(){}
 public long getid() {
 return id;
 }
 public string getusername() {
 return username;
 }
 public string getpassword() {
 return password;
 }
 public string gettupian() {
 return tupian;
 }
 public void setid(long id) {
 this.id = id;
 }
 public void setusername(string username) {
 this.username = username;
 }
 public void setpassword(string password) {
 this.password = password;
 }
 public void settupian(string tupian) {
 this.tupian = tupian;
 }
}

用户实体类的接口:

package com.example.demo.dao;
import com.example.demo.domain.user;
import org.springframework.data.jpa.repository.jparepository;
/**
 * created by 18274 on 2017/8/9.
 */
public interface userrepository extends jparepository<user,long>{
}

最后运行如下:

注册上传头像:

spring boot实现上传图片并在页面上显示及遇到的问题小结 

个人中心:

spring boot实现上传图片并在页面上显示及遇到的问题小结

ps:如果在结合spring security的话,只需要从session.spring_security_context.authentication.principal.xxx中取得信息即可。

附上传的这个小demo的地址:

总结

以上所述是小编给大家介绍的spring boot实现上传图片并在页面上显示及遇到的问题小结,希望对大家有所帮助