SW과정 스프링부트 6일차 0902
1. Spring MVC vs SpringBoot 차이점
2. Reflection
●Springboot 생성 순서
1. STS에서 New Spring Starter Project 에서 dependency에 H2, JDBC, Oracle, MySQL, MyBatis, Spring Web, Spring Boot DevTools 총 7가지를 선택함
2. application.properties 파일에 다음 작성
server.port=77773. HomeController.java를 다음과 같이 작성
package com.example.web.controller;
import org.springframework.stereotype.Controller;
import org.springframework.web.bind.annotation.RequestMapping;
import org.springframework.web.bind.annotation.ResponseBody;
@Controller
public class HomeController {
@ResponseBody
@RequestMapping("/")
public String home() {
return "여기는 home()입니다";
}
}
4. 실행파일 한글 적용 방법
5. web browser로 http://localhost:7777/home 요청
6. https://startbootstrap.com/template/shop-homepage 에서 샘플 웹 리소스를 다운 받아 src/main/resources/static에 저장
7. https://startbootstrap.com/template/shop-homepage 에서 샘플 웹 리소스를 다운 받아 src/main/resources/static에 저장
8. src/main/resources/static에 index.html을 다음과 같이 수정
9. img 폴더에 적당한 이미지들을 넣고 화면 꾸밈
10. src/main/resources/static 밑에 html 폴더를 만들고 memberInsert.html을 다음과 같이 작성
package com.example.web.controller;
import javax.servlet.http.HttpServletRequest;
import org.springframework.beans.factory.annotation.Autowired;
import org.springframework.web.bind.annotation.RequestMapping;
import org.springframework.web.bind.annotation.RestController;
import com.example.web.service.MemberService;
import com.example.web.vo.Member;
@RestController
public class MemberController {
@Autowired
MemberService memberService;
@RequestMapping("memberInsert")
public String memberInsert(HttpServletRequest request) {
String id=request.getParameter("id");
String pw=request.getParameter("pw");
String name=request.getParameter("name");
Member m=new Member(id, pw, name);
System.out.println(m);
memberService.memberInsert(m);
return "회원 가입 완료 <button onclick='window.close()' >닫기</button>";
}}```
11. com.example.web.service.MemberService.java를 다음과 같이 작성
package com.example.web.service;
import org.springframework.beans.factory.annotation.Autowired;
import org.springframework.stereotype.Service;
import com.example.web.dao.MemberDAO;
import com.example.web.vo.Member;
@Service
public class MemberService {
@Autowired
MemberDAO memberDAO;
public void memberInsert(Member m) {
memberDAO.memberInsert(m);
}
}
12. com.example.web.dao.MemberDAO.java를 다음과 같이 작성
package com.example.web.dao;
import org.apache.ibatis.annotations.Mapper;
import org.springframework.dao.DataAccessException;
import org.springframework.stereotype.Repository;
import com.example.web.vo.Member;
@Mapper
@Repository
public interface MemberDAO {
public void memberInsert(Member m) throws DataAccessException;
}
13. com.example.web.vo.Member.java를 다음과 같이 작성
package com.example.web.vo;
public class Member {
private String id,pw,name;
public Member() {
super();
// TODO Auto-generated constructor stub
}
public Member(String id, String pw) {
super();
setId(id);
setPw(pw);
}
public Member(String id, String pw, String name) {
this(id,pw);
setName(name);
}
public String getId() {
return id;
}
public void setId(String id) {
this.id = id;
}
public String getPw() {
return pw;
}
public void setPw(String pw) {
this.pw = pw;
}
public String getName() {
return name;
}
public void setName(String name) {
this.name = name;
}
@Override
public String toString() {
return "Member [id=" + id + ", pw=" + pw + ", name=" + name + "]";
}}```
14. application.properties에 컨넥션, 마이바티스 관련 설정을 추가
server.port=9999
spring.datasource.url=jdbc:oracle:thin:@localhost:1521:XE
spring.datasource.username=human
spring.datasource.password=1234
spring.datasource.driver-class-name=oracle.jdbc.driver.OracleDriver
mybatis.config-location=classpath:mybatis-config.xml
mybatis.type-aliases-package=com.example.web.vo```
```15. src/main/resources 밑에 mybatis-config.xml을 생성
<?xml version="1.0" encoding="UTF-8"?> <!DOCTYPE configuration PUBLIC "-//mybatis.org//DTD Config 3.0//EN" "http://mybatis.org/dtd/mybatis-3-config.dtd">
insert into Member(id,pw,name) values( #{id}, #{pw}, #{name} )16. src/main/resources밑에 mybatis/mappers 라는 서브 디렉토리를 차례로 만들고 여기에 member.xml을 작성해 놓는다 (스프링부트에서는 이름 규칙을 철저히 지켜야 한다)
<?xml version="1.0" encoding="UTF-8"?> <!DOCTYPE mapper PUBLIC "-//mybatis.org//DTD Mapper 3.0//EN" "http://mybatis.org/dtd/mybatis-3-mapper.dtd">
```
17. 수행하여 회원 가입이 되는지 본다
18. index.html에서 로그인 영역을 다음과 같이 지정한다
<div id='loginDiv'> ID<input size='5' id="login_id"> PW<input size='5' id="login_pw" type="password"> <button id="loginBtn">로그인</button> </div>
> #### 19. index.html에 jQuery CDN과 my.js link를 다음과 같이 추가한다 <script src="js/my.js"></script>```20. js/my.js 작성
$(document).ready(function(){
$("#loginBtn").click(function(){
const id=$("#login_id").val();
const pw=$("#login_pw").val();
alert(id+":"+pw);
$.post('login', {id,pw},
function(data){
console.log(data);
});
});});```
21. MemberController를 수정
package com.example.web.controller;
import javax.servlet.http.HttpServletRequest;
import org.springframework.beans.factory.annotation.Autowired;
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.RestController;
import com.example.web.service.MemberService;
import com.example.web.vo.Member;
@RestController
public class MemberController {
@Autowired
MemberService memberService;
@PostMapping("login")
public String login(@ModelAttribute Member m) {
System.out.println(m);
String name=memberService.login(m);
return name+ "님 환영합니다";
}
@PostMapping("memberInsert")
public String memberInsert(@ModelAttribute Member m) {
System.out.println(m);
memberService.memberInsert(m);
return "회원 가입 완료 <button onclick='window.close()' >닫기</button>";
}
}
22. MemberService 수정
package com.example.web.service;
import org.springframework.beans.factory.annotation.Autowired;
import org.springframework.stereotype.Service;
import com.example.web.dao.MemberDAO;
import com.example.web.vo.Member;
@Service
public class MemberService {
@Autowired
MemberDAO memberDAO;
public void memberInsert(Member m) {
memberDAO.memberInsert(m);
}
public String login(Member m) {
return memberDAO.login(m);
}
}
23. MemberDAO 수정
package com.example.web.dao;
import org.apache.ibatis.annotations.Mapper;
import org.springframework.dao.DataAccessException;
import org.springframework.stereotype.Repository;
import com.example.web.vo.Member;
@Mapper
@Repository
public interface MemberDAO {
public void memberInsert(Member m) throws DataAccessException;
public String login(Member m) throws DataAccessException;}```
insert into Member(id,pw,name) values( #{id}, #{pw}, #{name} ) select name from Member where id=#{id} and pw=#{pw} ```24. member.xml 수정
<?xml version="1.0" encoding="UTF-8"?> <!DOCTYPE mapper PUBLIC "-//mybatis.org//DTD Mapper 3.0//EN" "http://mybatis.org/dtd/mybatis-3-mapper.dtd">
25. 로그인 확인
26. 오류 처리를 위해서 MemberService 수정
package com.example.web.service;
import org.springframework.beans.factory.annotation.Autowired;
import org.springframework.stereotype.Service;
import com.example.web.dao.MemberDAO;
import com.example.web.vo.Member;
@Service
public class MemberService {
@Autowired
MemberDAO memberDAO;
public void memberInsert(Member m) throws Exception{
memberDAO.memberInsert(m);
}
public String login(Member m) throws Exception {
return memberDAO.login(m);
}}```
27. pom.xml에 json lib 추가
<dependency> <groupId>com.googlecode.json-simple</groupId> <artifactId>json-simple</artifactId> <version>1.1.1</version> </dependency>28. MemberController에서 JSON으로 응답하기 위해 수정
package com.example.web.controller;
import javax.servlet.http.HttpServletRequest;
import javax.servlet.http.HttpSession;
import org.json.simple.JSONObject;
import org.springframework.beans.factory.annotation.Autowired;
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.RestController;
import com.example.web.service.MemberService;
import com.example.web.vo.Member;
@RestController
public class MemberController {
@Autowired
MemberService memberService;
@PostMapping("login")
public String login(@ModelAttribute Member m, HttpSession session) {
JSONObject json=new JSONObject();
try {
System.out.println(m);
String name=memberService.login(m);
if(name!=null) {//login ok
m.setName(name);
session.setAttribute("m", m);
json.put("name", name);
}else {
json.put("errMsg", "로그인 오류");
}
}catch(Exception e) {
json.put("errMsg", "로그인 오류");
}
return json.toJSONString();
}
@PostMapping("memberInsert")
public String memberInsert(@ModelAttribute Member m) {
System.out.println(m);
try {
memberService.memberInsert(m);
return "회원 가입 완료 <button onclick='window.close()' >닫기</button>";
} catch (Exception e) {
e.printStackTrace();
return "회원가입실패: ID를 확인하세요";
}
}}```
29. my.js에서 쿠키 저장
$(document).ready(function(){
$("#loginBtn").click(function(){
const id=$("#login_id").val();
const pw=$("#login_pw").val();
alert(id+":"+pw);
$.post('login', {id,pw},
function(data){
data=JSON.parse(data);
console.log(data);
if(data.errMsg){
alert(data.errMsg);
}else{
$("#loginDiv").html(data.name+"님 환영합니다");
$.cookie("logined_id",id);
}
});
});});```
30. index.html에서 jquery cookie cdn 추가
<script src="https://code.jquery.com/jquery-3.6.0.min.js" integrity="sha256-/xUj+3OJU5yExlq6GSYGSHk7tPXikynS7ogEvDej/m4=" crossorigin="anonymous"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery-cookie/1.4.1/jquery.cookie.min.js" integrity="sha512-3j3VU6WC5rPQB4Ld1jnLV7Kd5xr+cq9avvhwqzbH/taCRNURoeEpoPBK9pDyeukwSxwRPJ8fDgvYXd6SkaZ2TA==" crossorigin="anonymous" referrerpolicy="no-referrer"></script>
<script src="js/my.js"></script>
DataEngineer Lee.