SpringBoot 로그인 View

---

목표

로그인이 잘되었으니까 이제 / 페이지로 잘이동할수 있도록 만들어보자 (컨트롤러) 

새로운 ImageController라는 것을 만든다!

package com.cos.photogramstart.web;

import org.springframework.stereotype.Controller;
import org.springframework.web.bind.annotation.GetMapping;

@Controller
public class ImageController {

	@GetMapping({"/","/image/stroy"})
	public String story() {
		return "image/story";
	}
}

이제 로그인하면 /image/story로 넘어온다!

유저 프로필로 넘어가기 위해서는 /user로 시작하게 되니까 새로운 컨트롤러를 만들어야한다!

package com.cos.photogramstart.web;

import org.springframework.stereotype.Controller;
import org.springframework.web.bind.annotation.GetMapping;

@Controller
public class UserController {
	
	@GetMapping("/user/profile")
	public String profile() {
		return "user/profile";
	}

}

이제 유저 프로필로 넘어갈수 있는데 지금은 내페이지가 나오는데 다른사람의 페이지가 연결이 될수도 있기떄문에 

1번 유저는 /user/1 , 2번 유저는 /user/2 하기위해서는 주소 설정의 수정이 필요하다

 

package com.cos.photogramstart.web;

import org.springframework.stereotype.Controller;
import org.springframework.web.bind.annotation.GetMapping;
import org.springframework.web.bind.annotation.PathVariable;

@Controller
public class UserController {
	
	@GetMapping("/user/{id}")
	public String profile(@PathVariable int id) {
		return "user/profile";
	}

}

 

또한 사진 등록 image/upload를 하기위해 이미지컨트롤러에 추가해야하는데..!

	@GetMapping("/image/upload")
	public String upload() {
		return "image/upload";
	}

이것만 살짝쿵 이미지 컨트롤러에 추가하면

이런 귀여운 고양이와 함께 사진 등록 가능!

하지만 여기서 프로필을 누르면 갑자기 오류창이뜨는데..? 

	<header class="header">
		<div class="container">
			<a href="/" class="logo">
				<img src="/images/logo.jpg" alt="">
			</a>
			<nav class="navi">
				<ul class="navi-list">
					<li class="navi-item"><a href="/">
							<i class="fas fa-home"></i>
						</a></li>
					<li class="navi-item"><a href="/image/popular">
							<i class="far fa-compass"></i>
						</a></li>
					<li class="navi-item"><a href="/user/1">
							<i class="far fa-user"></i>
						</a></li>
				</ul>
			</nav>
		</div>
	</header>

그러면 layout폴더 에 Header를 담당하는 jsp에 들어가 위치들을 약간 수정!

그러면 문제가 해결되는것 같았지만 또다른곳에서 숨겨진 문제들이 등장하는데..?!

 

회원정보 변경을 하려고하는데 또 안된다..! /user/update 

그럼 이것도 유저 컨트롤러에 추가해야한다! 

package com.cos.photogramstart.web;

import org.springframework.stereotype.Controller;
import org.springframework.web.bind.annotation.GetMapping;
import org.springframework.web.bind.annotation.PathVariable;

@Controller
public class UserController {
	
	@GetMapping("/user/{id}")
	public String profile(@PathVariable int id) {
		return "user/profile";
	}
	
	@GetMapping("/user/{id}/update")	//user에 업데이트가 아니라 어떤 번호를 업데이트 할건지 해야하기때문 {id}를 건다!
	public String update(@PathVariable int id ) {
		return "user/update";
	}
}

<div class="modal-info" onclick="modalInfo()">
	<div class="modal">
		<button onclick="location.href='/user/1/update'">회원정보 변경</button>
		<button onclick="location.href='/logout'">로그아웃</button>
		<button onclick="closePopup('.modal-info')">취소</button>
	</div>
</div>

회원 정보 변경에도 주소를 바꿔줘야한다! 

user/1/upadte화면에서 정보 변경이 나오게 되었다!