Polling
클라이언트가 내부적으로 새로 고침을 계속 요청하는 것, 과부하 문제가 있음
Server Send Event
한번 서버와 연결하면 변경이 있을 때 마다 데이터를 전달 받는다. 단방향 통신
클라이언트는 데이터를 받을 수만 있음
User Controller
package com.example.demo.controller;
import org.springframework.stereotype.Controller;
import org.springframework.web.bind.annotation.GetMapping;
import org.springframework.web.bind.annotation.PostMapping;
// @RestController// 리턴시 그 문자 그대로 응답
@Controller // 리턴시 파일을 응답
public class UserController {
@GetMapping("/joinForm")
public String joinForm() {
return "joinForm";
}
@PostMapping("/join")
public String join(String username, String password, String email) {
// String username = request.getParameter("username");
// String password = request.getParameter("password");
// String email = request.getParameter("email");
System.out.println("username : " + username);
System.out.println("password : " + password);
System.out.println("email : " + email);
if (username.length() > 10) {
return "error-404";
}
return "main";
}
}- Controller 어노테이션 : 스프링 컨트롤러로 만들어준다. http 요청을 처리
- joinForm 메서드 : URL에 맨 끝에 /joinForm을 붙여 회원가입 화면으로 이동가능, joinForm.mustache템플릿을 불러옴
- join 메서드 : username, password, email의 입력값을 콘솔에 소환함, if 조건문을 username이 10자 이상이면 404 error를 띄우고 그렇지 않으면 main을 불러온다.
Board Controller
package com.example.demo.controller;
import org.springframework.stereotype.Controller;
import org.springframework.web.bind.annotation.GetMapping;
@Controller
public class BoardController {
@GetMapping("/main")
public String main() {
return "redirect:/main";
}
}joinForm.mustache
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>Title</title>
</head>
<body>
<h1>회원가입 페이지</h1>
<hr>
<form action="/join" method="post">
<input type="text" name="username" placeholder="username" required maxlength="10">
<input type="password" name="password" placeholder="password" required>
<input type="email" name="email" placeholder="email" required>
<button>회원가입</button>
<!-- 액션요청 submit이 디폴트-->
</form>
</body>
</html>required를 줘서 조건을 걸어줌(최대 길이 10자이상, 각 항목 필수 작성)
main.mustache
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>Title</title>
</head>
<body>
<h1>main page</h1>
<hr>
</body>
</html>error-404.mustache
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>Title</title>
</head>
<body>
<h1>에러 : 잘못된 요청을 하셨어요</h1>
</body>
</html>
유효성 검사는 프론트, 백엔드 양쪽에서 해야함
Share article
