最近在使用spring boot搭建網站的過程之中遇到了這樣一個問題:用戶注冊時需要上傳一個屬于自己的頭像,注冊成功之后跳轉到個人中心,在個人中心中顯示用戶信息.其中在顯示頭像的時候遇到了問題:上傳頭像的時候,我把頭像存放到了項目文件下的static文件夾中,將其地址存放到了數據庫對應的用戶中,并且在idea中添加了熱部署,但是在注冊跳轉到個人中心后還是無法顯示頭像,只有在下一次啟動項目進入到個人中心時才可以。
被這個問題困擾了許久,最后是這樣的解決的:在main目錄下新建了一個webapp文件夾,并且對其路徑進行了配置。下面是一個解決方案的小demo,做的比較簡單,請見諒~~核心代碼如下:
注冊界面:
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
|
<!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如下:
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
|
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 "上傳失敗,因為文件是空的." ; } } } |
個人中心:
1
2
3
4
5
6
7
8
9
10
11
12
13
|
<!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路徑的配置
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
|
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); } } |
對應的用戶實體類:
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
|
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; } } |
用戶實體類的接口:
1
2
3
4
5
6
7
8
|
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>{ } |
最后運行如下:
注冊上傳頭像:
個人中心:
ps:如果在結合spring security的話,只需要從session.SPRING_SECURITY_CONTEXT.authentication.principal.XXX中取得信息即可。
附上傳的這個小demo的地址:
總結
以上所述是小編給大家介紹的spring boot實現上傳圖片并在頁面上顯示及遇到的問題小結,希望對大家有所幫助,如果大家有任何疑問請給我留言,小編會及時回復大家的。在此也非常感謝大家對服務器之家網站的支持!
原文鏈接:http://blog.csdn.net/aslongasyoulike/article/details/77001824