Review Mapping Basics
DispatcherServlet Context & Controller
- Beans에 등록된 매핑 경로는 DispatcherServlet Context의 탐색 범위 내의 Controller에 규정되어 있어야 매핑 가능
<beans:beans>
<!-- DispatcherServlet Context: defines this servlet's request-processing infrastructure -->
<!-- Enables the Spring MVC @Controller programming model -->
<annotation-driven />
<!-- Handles HTTP GET requests for /resources/** by efficiently serving up static resources in the ${webappRoot}/resources directory -->
<!-- <resources mapping="/resources/**" location="/resources/" /> -->
<resources mapping="/image/**" location="/WEB-INF/image/" />
<resources mapping="/js/**" location="/WEB-INF/js/" />
<resources mapping="/css/**" location="/WEB-INF/css/" />
<!-- Resolves views selected for rendering by @Controllers to .jsp resources in the /WEB-INF/views directory -->
<beans:bean class="org.springframework.web.servlet.view.InternalResourceViewResolver">
<beans:property name="prefix" value="/WEB-INF/" /> <!-- 폴더를 국한하지 않고 어느 jsp파일이나 호출가능 -->
<beans:property name="suffix" value=".jsp" />
</beans:bean>
<context:component-scan base-package="spring.mvc.test" />
</beans:beans>- WEB-INF>spring>appServlet>servlet-context.xml
- DispatcherServlet Context는 <resources>와 <beans:property>태그의 데이터에 따라 절대 경로와 가상 경로를 매핑
- 또한 DispatcherServlet Context는 오로지 <context:component-scan>의 데이터에 속하는 클래스 내의 Controller만 탐색하여 매핑하므로, 이 탐색 범위를 넓히려면 ,(comma) 등을 이용하여 다수의 base-package를 입력하거나 와일드카드(*)를 이용해야 함
Root Mapping
@Controller
public class HomeController {
@RequestMapping(value = "/", method = RequestMethod.GET)
public String home(Locale locale, Model model) {
return "home";
}
}- root 페이지 지정은 기본적으로 @RequestMapping 어노테이션으로 value를 ‘/’라고 설정함으로 이루어짐
- 하지만 index 파일이 존재한다면, ‘/’로 설정된 root 페이지보다 index 파일을 우선적으로 root로 인식
Redirect Page
<!--index.jsp-->
<body>
<c:redirect url="board/form1"/> <!-- 바로 redirect되어서 이동 -->
</body>- <c:redirect>를 통해 페이지를 redirect 가능
- Server Runtime이 redirect 메시지를 인식 시 곧바로 페이지는 대상 페이지로 이동하여, 이를 이용하여 root 페이지를 변경한 것과 같은 효과 부여 가능
- 위의 사례에서는 index 파일로서 ‘test/’가 root가 되어야 하지만, 실제로는 ‘test/board/’의 form1이 root처럼 활용됨
Mapping_Addtional
Mapping Addr Duplicated
- 하나의 Controller에서 모든 매핑 주소가 같은 경로를 거친다면, 해당 주소를 모든 매핑 경로로 지정 및 입력해야 함
- 이를 간략화하기 위해 Controller 자체에 중복 경로를 내장 가능
@Controller
@RequestMapping("/board")
public class BoardController {
@GetMapping("/form1")
//매핑 메서드
@PostMapping("/form2")
//매핑 메서드
//기타 매핑 메서드
}- 각 메서드마다 지정된 매핑 주소는 ‘form1, form2’ 등이지만, @RequestMapping 주소에 의해 모두 ‘/board’ 경로를 거치게 됨
- 따라서 ‘/form1, /form2’가 아닌 ‘/board/form1, /board/form2’의 주소를 가짐
Add Unrequired Values
<body>
<form action="process" method="post">
작성자: <input type="text" name="name"><br>
날짜: <input type="date" name="date"><br>
성별: <input type="radio" name="gender" value="남">남
<input type="radio" name="gender" value="여">여<br>
<input type="submit" value="전송">
</form>
</body>- <form>을 통해 name, date, gender 3개의 값을 가상 경로 ‘process’에 전달
- 이 경우 ‘process’ 경로의 파일에서는 3개의 값만을 활용 가능
@Controller
public class BoardController {
@PostMapping("/process")
public ModelAndView process1(@RequestParam String name,@RequestParam String date,
@RequestParam String gender,/*@RequestParam(defaultValue = "행복한 하루 되세요") String msg*/
@RequestParam(required = false) String msg,
@RequestParam(defaultValue = "1") int currentPage) {
//required=true 가 기본값,항목이 없어도 에러가 안나게 하려면 false
ModelAndView model=new ModelAndView();
model.addObject("name", name);
model.addObject("date", date);
model.addObject("gender", gender);
model.addObject("msg", msg);
model.addObject("currentPage", currentPage);
model.setViewName("board/result");
return model;
}- @RequestParam( defaultValue )를 이용하면 <form>을 통해 받지 않은 값도 매핑 주소에 전달 가능 (대신 여타 조건이 없다면 항상 defaultValue에 해당하는 값만 전달)
- 또한 @RequestParam( required = false )를 통해 전달 받지 못한 값을 변수로써 활용할 수 있게 됨 (모든 @RequestParam은 디폴트로 required 값이 true이며, 이는 전달 받은 값임을 증명) (이 경우도 여타 조건이 없으면 null 값 전달)
Applying CSS & JS on Files
@charset "EUC-KR";
table{
border: 2px solid gray;
}
tr,th,td{
border: 1px dotted green;
}- WEB-INF>css>style.css
- css 파일에 css 설정
$(function(){
$("#myimg").attr("src","../image/02.png");
$("#myimg").hover(function(){
$(this).attr("src","../image/11.png");
},function(){
$(this).attr("src","../image/02.png");
});
});- WEB-INF>js>script.js
- 자바 스크립트 설정
<head>
<link rel="stylesheet" href="../css/style.css"> <!--css링크-->
<script type="text/javascript" src="../js/script.js"></script> <!--js링크-->
</head>- 설정한 css, js 기능을 사용하고자 할 경우, 반드시 적절한 경로를 통해 해당 파일의 링크를 지정해야 함
Pass Values through DTO & Map
DTO Method
@Controller
public class ShopController {
@PostMapping("/shop/process2")
public String process2(@ModelAttribute ShopDto dto) {
if(dto.getSang()==null){
dto.setSang("재고없음"); //dto의 getter,setter 활용가능
}
return "shop/shopResult";
}
}- @ModelAttribute : 폼의 데이터를 읽어서 dto에 넣고 model에 저장
- @ModelAttribute 자체가 앞 글자 소문자로 변환해서 넘겨줌 (shopDto 객체로 전달 가능)
- 만약 다른 이름 원하면 @ModelAttribute("이름") (@ModelAttribute(”thisIsDto”)라고 설정하면 thisIsDto로 process2 파일에서 전달 받음)
Map Method
@Controller
public class ShopController {
@PostMapping("/shop/process3")
public ModelAndView process3(@RequestParam Map<String, String> map) {
ModelAndView model=new ModelAndView();
model.setViewName("shop/mapResult");
model.addObject("java", map.get("java"));
model.addObject("spring", map.get("spring"));
return model;
}
}- <form>의 name 값이 key값으로, 입력 값은 value값으로 저장
- Map을 통해 자동으로 값을 저장 시에는 @RequestParam 생략 불가
Review JSTL Format
<div style="color: ${shopDto.color}">
상품명: ${shopDto.sang }<br>
수량: <fmt:formatNumber value="${shopDto.su }" pattern="#,##0"/><br>
단가: <fmt:formatNumber value="${shopDto.price }" type="currency"/><br>
총금액: <fmt:formatNumber value="${shopDto.su*shopDto.price }" type="currency"/>
</div>- dto 방식으로 값을 전달 받음
- Number 포맷에서 pattern 속성은 숫자 형식 지정 시 사용 (#: 없을 시 표기 x / 0: 항상 표기)
- Number 포맷에서 type 속성은 화폐 등 형식 지정 시 사용
Passing Multiple Values
<body>
<form action="result" method="post">
<table>
<th>취미</th>
<td>
<input type="checkbox" name="hobby" value="축구">축구
<input type="checkbox" name="hobby" value="야구">야구
<input type="checkbox" name="hobby" value="농구">농구
<input type="checkbox" name="hobby" value="배구">배구
<input type="checkbox" name="hobby" value="당구">당구
</td>
</tr>
<tr><td colspan="2" align="center"><button type="submit">전송</button></td></tr>
</table>
</form>
</body>- 위처럼 checkbox를 통해 값을 전달 시 다중 값이 전달될 수 있음
@Controller
public class InfoController {
@PostMapping("/info/result")
public String process(@ModelAttribute("dto") InfoDto dto) {
if(dto.getHobby()==null)
dto.setHobby("없음");
System.out.println(dto.getHobby()); //출력 확인... 축구,야구,농구,배구,당구
return "info/infoWrite";
}
}- 이를 DTO를 통한 매핑 메서드를 이용하여 전달 시 ,(comma)로 연결된 문자열 형태로 나타남
- 하지만 이는 Object 형태로, 사실상 배열의 형태로 저장됨
<c:forEach var="hobbies" items="${dto.hobby }">
<c:out value="[${hobbies }] "/>
</c:forEach>- 또는
<c:if test="${empty dto.hobby }">없음</c:if>
<c:if test="${!empty dto.hobby}">
<c:forEach var="h" items="${dto.hobby }">
[${h }]
</c:forEach>
</c:if>- 이러한 다중 값은 JSTL 반복문인 <c:forEach>를 통해 출력
초보개발자