SPRING
스프링으로 쇼핑몰을 만들어보자4 - 인증번호 이메일 전송
기능구현
- 회원가입(주소API연동, 이메일 인증, ajax를 사용하여 아이디 중복검사)
- 관리자 페이지(인터셉터 적용, 상품관리, 회원관리)
- 업로드(이미지 등록, 수정, 삭제)
- 검색
- 페이징
- 구매(장바구니, 포인트사용)
- 댓글(등록,수정,삭제)
- 중간에 막혔거나 에러 해결 못하겠으면 yoonbitnara@gmail.com 으로 문의
목차
- 이메일 전송 환경 세팅
- 인증번호 입력란 색상 변경 및 disabled 속성 추가
- 이메일 전송 메서드 추가
- Controller 메서드 추가
- 테스트
join.jsp
<div class="mail_wrap">
<div class="mail_name">이메일</div>
<div class="mail_input_box">
<input class="mail_input" name="memberMail">
</div>
<div class = 'mail_wrap>'클래스 이름을mail_check_wrap로 바꿔준다.
<div class="mail_check_wrap">
<div class="mail_name">이메일</div>
<div class="mail_input_box">
<input class="mail_input" name="memberMail">
</div>
SMTP Server를 이용한 메일전송(세팅)
- SMTP는 Simple Mail Transfer Protocol의 약자이며 전자 메일 전송을 위한 표준 프로토콜이다.
- 메일 서버는 SMTP Server, POP3 Server가 있고 POP3 Server는 이메일을 수신하는 서버이다.
- 메일 전송 기능을 구현하기 위해선 아래의 4가지가 필요하다.
- pom.xml 설정
- mailSender Bean등록(
root-context.xmlorservlet-context.xml) - Controller 메서드 추가
- 메일 계정 보안 설정
- 메일서버(SMTP Server)를 통해 메일을 전송할 때 두가지 방법이 있다.
- 메일서버가 릴레이를 허용하는 경우
- 계정이 존재하지 않더라도 메일을 발송할 수 있다.
- 릴레이를 허용하는 경우 잘못된 방식으로 악용될 수 있다.
- 특정 IP에서만 릴레이가 되도록 하는게 일반적이다.
- 릴레이란?
- 외부에서 해당 메일서버를 경유해서 외부로 메일을 보내는 것을 의미한다.
- 메일서버에 계정 인증 후 메일을 전송하는 방법
- 메일서버가 릴레이를 허용하는 경우
구글 세팅
네이버 세팅
- 네이버 메일 좌측 하단 환경설정 클릭
다음
- 메일 페이지 좌측 하단 환경설정 클릭
pom.xml 설정
<!-- mail lib -->
<dependency>
<groupId>javax.mail</groupId>
<artifactId>mail</artifactId>
<version>1.4.7</version>
</dependency>
- pom.xml에 mail 라이브러리를 추가해준다.
spring-context-support 라이브러리를 추가한다.
<!-- https://mvnrepository.com/artifact/org.springframework/spring-context-support -->
<dependency>
<groupId>org.springframework</groupId>
<artifactId>spring-context-support</artifactId>
<version>${org.springframework-version}</version>
</dependency>
gmail
- root-context.xml 에 코드 추가
<!-- gmail설정 -->
<bean id="mailSender2" class="org.springframework.mail.javamail.JavaMailSenderImpl">
<property name="host" value="smtp.gmail.com" />
<property name="port" value="587" />
<property name="username" value="your_email"/> <!-- 자신의 이메일 아이디 -->
<property name="password" value="your_password!"/> <!-- 자신의 비밀번호 -->
<!-- 보안연결 TLS과 관련된 설정 -->
<property name="javaMailProperties">
<props>
<prop key="mail.smtp.auth">true</prop>
<prop key="mail.smtp.starttls.enable">true</prop>
</props>
</property>
</bean>
naver
- root-context.xml 에 코드 추가
<!-- navermail설정 -->
<bean id="mailSender" class="org.springframework.mail.javamail.JavaMailSenderImpl">
<property name="host" value="smtp.naver.com"/> <!-- 메이서버 호스트 -->
<property name="port" value="465"/> <!-- 메이서버 포트번호 -->
<property name="username" value="your_email"/> <!-- 자신의 이메일 아이디 -->
<property name="password" value="your_password"/> <!-- 자신의 비밀번호 -->
<!-- 보안연결 SSL과 관련된 설정 -->
<property name="javaMailProperties">
<props>
<prop key="mail.smtp.auth">true</prop>
<prop key="mail.smtp.starttls.enable">true</prop>
<prop key="mail.smtps.checkserveridentity">true</prop>
<prop key="mail.smtps.ssl.trust">*</prop>
<prop key="mail.debug">true</prop>
<prop key="mail.smtp.socketFactory.class">javax.net.ssl.SSLSocketFactory</prop>
</props>
</property>
</bean>
- javaMailProperties인
<property>태그에 삽입된 코드는 SSL 인증 코드다.
daum
- root-context.xml 에 코드 추가
<bean id="mailSender" class="org.springframework.mail.javamail.JavaMailSenderImpl">
<property name="host" value="smtp.daum.com"/> <!-- 메이서버 호스트 -->
<property name="port" value="465"/> <!-- 메이서버 포트번호 -->
<property name="username" value="your_email"/> <!-- 자신의 이메일 아이디 -->
<property name="password" value="your_password"/> <!-- 자신의 비밀번호 -->
<!-- 보안연결 SSL과 관련된 설정 -->
<property name="javaMailProperties">
<props>
<prop key="mail.smtp.auth">true</prop>
<prop key="mail.smtp.starttls.enable">true</prop>
<prop key="mail.smtps.checkserveridentity">true</prop>
<prop key="mail.smtps.ssl.trust">*</prop>
<prop key="mail.debug">true</prop>
<prop key="mail.smtp.socketFactory.class">javax.net.ssl.SSLSocketFactory</prop>
</props>
</property>
</bean>
입력란 색상변경
mail_check_input_box클래스에 id속성mail_check_input_box_false를 추가한다. - join.jsp
변경 전
<div class="mail_check_input_box">
변경 후
<div class="mail_check_input_box" id="mail_check_input_box_false">
- join.css에 방금 추가한 id에 css를 넣어준다.
#mail_check_input_box_false{
background-color:#ebebe4;
}
#mail_check_input_box_true{
background-color:white;
}
mail_check_input클래스에disabled="disabled"속성을 추가한다.
<input class="mail_check_input" disabled="disabled">
이메일 전송 메서드 추가(JS)
- 인증번호 전송 버튼을 클릭하면 작동하는 메서드를 추가한다.
- controller로 작성한 이메일 주소를 보내고, 인증번호를 생성하여 전달받은 이메일로 전송한 뒤 전송된 인증번호를 회원가입페이지로 다시 반환되도록 한다.
- controller에 요청할 때 화면이 전환되면 안되기 때문에 ajax를 사용한다.
- join.jsp에 아래 코드를 추가한다.
/* 인증번호 이메일 전송 */
$(".mail_check_button").click(function(){
});
- 이메일 입력란에 email 변수를 선언한다.
/* 인증번호 이메일 전송 */
$(".mail_check_button").click(function(){
var email = $(".mail_input").val(); // 입력한 이메일
});
- ajax 코드를 추가한다.
/* 인증번호 이메일 전송 */
$(".mail_check_button").click(function(){
var email = $(".mail_input").val(); // 입력한 이메일
$.ajax({
type:"GET",
url:"mailCheck?email=" + email
});
});
- 대충 설명을 하자면 url을 통해 데이터를 보낼 수 있도록 GET방식으로 하였고 url명을 mailCheck로 하였다.
Controller 메서드 추가
- 인증번호를 난수로 생성하여 이메일과 뷰로 보내는 기능을 만들 예정이다.
mailCheckGET 메서드 추가
- 반환타입은 임시로 void로 하였다. 추후 String으로 바꿀예정이다.
- 반환타입을 String으로 변경할 경우 회원가입페이지로 온전히 데이터를 전송하기 위해선
@ResponseBody어노테이션이 필요하다.
package com.store.controller;
import org.slf4j.Logger;
import org.slf4j.LoggerFactory;
import org.springframework.beans.factory.annotation.Autowired;
import org.springframework.stereotype.Controller;
import org.springframework.web.bind.annotation.RequestMapping;
import org.springframework.web.bind.annotation.RequestMethod;
import org.springframework.web.bind.annotation.ResponseBody;
import com.store.model.MemberVO;
import com.store.service.MemberService;
@Controller
@RequestMapping(value = "/member")
public class MemberController {
private static final Logger logger = LoggerFactory.getLogger(MemberController.class);
@Autowired
private MemberService memberService; // 코드 추가
//회원가입 페이지 이동
@RequestMapping(value = "join", method = RequestMethod.GET)
public void joinGET() {
logger.info(">>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>> 회원가입 페이지 진입");
}
// 회원가입
@RequestMapping(value = "/join", method = RequestMethod.POST)
public String joinPost(MemberVO member) throws Exception {
logger.info(">>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>> join 진입");
//회원가입 서비스 실행
memberService.memberJoin(member);
logger.info("join Service 성공");
return "redirect:/main";
}
// 로그인 페이지 이동
@RequestMapping(value = "login", method = RequestMethod.GET)
public void loginGET() {
logger.info(">>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>> 로그인 페이지 진입");
}
// 아이디 중복 검사
@RequestMapping(value = "/memberIdChk", method = RequestMethod.POST)
@ResponseBody
public String memberIdChkPOST(String memberId) throws Exception {
//logger.info(">>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>> memberIdChk 진입");
int result = memberService.idCheck(memberId);
logger.info("결과값 : " + result);
if (result != 0) {
return "fail"; // 중복아이디가 존재하면 fail
} else {
return "success"; // 중복아이디가 존재하지 않는다면 success
}
}
// 이메일 인증
@RequestMapping(value = "mailCheck", method = RequestMethod.GET)
@ResponseBody
public void mailCheckGET(String email) throws Exception {
// 뷰에서 넘어온 데이터 확인
logger.info("========================== 이메일 데이터 전송 확인 ============================");
logger.info("인증번호 : [ " + email + " ]");
}
}
중간확인
- server run을 하여 중간확인을 한다.
- Console에 정상적으로 데이터가 넘어왔는지 확인해본다.