본문 바로가기
  • Welcome J-Kyu Tstory
SpringBoot

[Thymeleaf]view에서 controller 데이터 전송 방식

by regularity 2022. 4. 3.
728x90

 thymeleaf 문법을 통해 작성된 데이터를 controller로 전송 하는 방식 

 

controller

package com.test.controller;

import java.io.Writer;
import java.lang.ProcessBuilder.Redirect;
import java.util.Arrays;

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.ModelAttribute;
import org.springframework.web.bind.annotation.PostMapping;
import org.springframework.web.bind.annotation.RequestMapping;
import org.springframework.web.bind.annotation.RequestMethod;
import org.springframework.web.bind.annotation.RequestParam;

import com.test.entity.Board;
import com.test.mapper.BoardMapper;

@Controller //어너테이션이 붙은 메서드가 컨트롤러임을 지시
//@RestController //json 데이터 전송하는 컨트롤러
public class BoardController {
	
	//Logger logger = (Logger) LoggerFactory.getLogger(BoardController.class);
	
	
	
	//logger ->
	@Autowired	//의존성 주입을 윈한 Annotation
	BoardMapper mapper;
	

	
	//=====================================home============================
	@RequestMapping(value="/", method=RequestMethod.GET)	//웹브라우저의 실제 경로를 적어줘야함
	public String home(Model model) {//Model 도 의존성 주입 //
		System.out.println("==================home_1========================");
		return "home";
	}

	//=====================================게시글 리스트============================
	@GetMapping("/board/boardList")	//웹브라우저의 실제 경로를 적어줘야함
	void getMemberList(Model model) {//Model 도 의존성 주입 //
		
		model.addAttribute("list", mapper.selectList());	// 변수 초기화 //HTML쪽으로 보내줌 // Model addAttribute(String name, Object value) -->value 객체를 name이름으로 추가,뷰 코드에서는 name 으로 지정한 이름을 통해서 value를 사용
		System.out.println("=====================list_1==================");
		
	}
	
	
	/*
	 @ResponseBody --> json 데이터로 전송
	 @RequestBody--> json 데이터를 받을때
	 @ResponseBody --> view 호출 안함
	 @RestController -> 모두 @ResponseBody 붙여준효과 
	*/
	
	
	//============================================해당 게시글 이동=====================================
	//@RequestMapping(value = "/board/boardView", method = RequestMethod.GET)
	@GetMapping("/board/boardView")
	void getView(Model model, @RequestParam("seqno") int seqno) {	//@RequestParam("가져올 데이터 이름")[데이터타입][가져온데이터를 담을 변수]
		System.out.println("=====================content_1==================");
		
		System.out.println( mapper.viewList(seqno));
		System.out.println("=====================content_2==================");
		
		model.addAttribute("viewList", mapper.viewList(seqno));	//viewList의 쿼리문을 통해 seqno 번호에 해당되는 데이터들을 ${viewList} 가 받음
		System.out.println("=====================content_3==================");
	}
	 
	
	//==========================================게시글 등록 페이지=======================================
//	@GetMapping("/board/boardRegister")	// getMapping ->1. URL에 변수(데이터)를 포함시켜 요청 2. 데이터를 Header(헤더)에 포함시켜 전송 3. URL에 노출되어 취약
//	String getRegister() {
//		System.out.println("=====================1-1==================");
//		return "sssssss";
//		
//	}
	//-----get방식-----
	@GetMapping("/board/boardRegister")	// getMapping ->1. URL에 변수(데이터)를 포함시켜 요청 2. 데이터를 Header(헤더)에 포함시켜 전송 3. URL에 노출되어 취약
	void getRegister() {
		System.out.println("=====================registrarion_1==================");
		
	}
	//-----post방식-----
	@PostMapping("/board/boardRegister") //PostMapping -> 1. URL에 변수(데이터)를 노출하지 않고 요청 2. 데이터를(body)에 포함 3. 보안 강함 
	String postRegister(Board board) {	
		System.out.println("=====================registrarion_2==================");
		
		mapper.insertList(board.getWriter(), board.getTitle(), board.getContent());
		System.out.println("=====================registrarion_3==================");
		return "redirect:/board/boardList";
		//redirect 사용이유 예시 등록 -> 새로고침 할때마다 ->db 무한 증가
		
	}
	//================================================게시글 삭제=====================================
	@GetMapping("/board/delete")	//RequestMapping ->url로 들어온요청을 특정 메서드와 매핑
	public String getDeleteList(Model model, @RequestParam("seqno") int seqno ) {	//@RequestParam --> 게시물 삭제에 필요한 게시글 파라미터(seqno)파라미터로 전달받음
//@RequestParam("seqno") int seqno
		System.out.println("=====================delete_1=================="); 
		
			//model.getAttribute(null)
			mapper.deleteList(seqno);
			System.out.println("=====================delete_2==================");
			
			return "redirect:/board/boardList";
	}
	
	//================================================게시글 수정 =====================================
	//-----get방식-----
	@GetMapping("/board/boardUpdate")
	void getUpdateList(Model model, @RequestParam("seqno") int seqno ) {
		
		System.out.println("=====================Update_1==================");
		BoSard vo = mapper.viewList(seqno);
		System.out.println(vo.toString());	//데이터가 잘 들어있는지 확인용
		System.out.println("=====================Update_2==================");
		
		model.addAttribute("viewList",vo);
		System.out.println("=====================Update_3==================");
	}
	//-----post방식-----
	@PostMapping("/board/boardUpdate")
	String postUpadetList(Board board, @RequestParam("seqno") int seqno	) {//
		System.out.println("=====================Update_1_1==================");
		
		System.out.println(board);
		System.out.println("=====================Update_1_2==================");
		mapper.updateList(board.getWriter(),board.getTitle() ,board.getContent() , seqno);
		
		System.out.println("=====================Update_1_3==================");
		return "redirect: ../../../board/boardView?seqno="+seqno;
	}
		
	
	
}

 

boardUpdate.HTML

<!DOCTYPE html>
<!-- 타임리프 -->
<html xmlns:th="http://www.thymleaf.org">
<head>
<meta charset="UTF-8">
<title>게시글 수정 페이지</title>
<script>
 
function updatList(){
	
	document.board.action = '/board/boardUpdate';
	document.board.submit();
} 
 /* 
$(document).ready(function(){
	
	$("#btn_modify").click(function(){	//id가 btn_modify 를 클릭 하면  함수가 실행
		
	
		$("#ModifyForm").attr("action", "/board/boarUpdate").submit();	//ModifyForm
	
	}) 
}) */


</script>

</head>
<body>
<!-- 	<form id="ModifyForm" action="/board/boardUpdate" name="board" method="post" > -->	<!-- action으로 전송하는 방법 +
		<button type="submit" value="등록"></button> 
-->
	<form id="ModifyForm" name="board" method="post" onsubmit="updatList()" >
		<input type="hidden" name="seqno" th:value="${viewList.seqno}">
		
		작성자 : <input type="text" name="writer"  th:value="${viewList.writer}"> 
		제목 : <input type="text" name="title" th:value="${viewList.title}"> 
		<br> 
		<br> 
		내용 <br>
		<textarea cols=50 rows=30 name="content" th:text="${viewList.content}"></textarea>
		<br> 
		<input type="button" value="등록" onclick="updatList()"> 
		 <!-- <button type="submit" value="등록"></button>  -->
		<!-- <button class="btn_modify" id="btn_modify">수정</button>  -->

	</form>
	
	
		<a href="/">Home</a> 
		<a href="/board/boardList/">게시글 목록 페이지</a>

</body>
</html>

 

1. get 방식 

▶데이터를 url에 포함하여 전송하는 방식


2.post 방식

 

<HTML>

<Controller>

▶post 방식은 url에 데이터를 넣어 전송하는 방식이 아니기 때문에 (seqno)와 같이 url 값으로 필요하지만 url에 넣을 수 없을 때  input type을 hidden 으로 설정해서 form 태그에 포장해서 데이터를 전송


 

3. 함수 실행 방식


▶다른 동작들을 많이 실행할 때 사용하는 방법

 

 


​4. button(submit타입)을 form 태그 안에 넣어서 form 자체를 submit으로 만들어서
전송 하는 방식

 

728x90

댓글