nodeMailer 란?

• Node.js에서 email을 쉽게 보낼 수 있게 해주는 모듈이다.
• 메일을 단순한 text는 물론 HTML 형식으로 전송할 수 있다.
• gmail 뿐만 아니라 naver 등의 계정으로도 메일을 전송할 수 있다.
  
  

이메일 인증번호 구현

0. 준비

• 이메일을 보낼 본인의 Gmail 계정
• 이메일을 보낼 본인 Gmail 계정의 2단계 비밀번호 생성
  [Google 계정] - [보안] - [2단계 인증] - [앱 비밀번호 추가 : 앱선택/메일, 기기선택/Windows 컴퓨터 => 생성] -> [16자리의 코드 생성됨]
  

1. Node.js에 nodeMailer 라이브러리 설치

npm i nodemailer

2. 사용하고 싶은 파일에서 모듈 import

const nodemailer = require('nodemailer');

3. .env 파일 생성 및 내용 추가

• .env 파일은 깃허브에 커밋되지 않도록 .gitignore에 추가하는 등 필히 주의해야 한다.

NODEMAILER_USER= "본인의 gmail 주소"
NODEMAILER_PASS= "본인의 gmail 2단계 비밀번호"

4. server에서 n의 자리 랜덤 숫자 생성 함수 작성

function generateRandomCode(n) {
    let str = '';
    for (let i = 0; i < n; i++) {
        str += Math.floor(Math.random() * 10);
    }
    return str;
}

5. _userEmail 매개변수로 메일 보내는 함수 작성

const nodemailer = require('nodemailer'); // 라이브러리 불러옴
let code = '';  // 랜덤 코드가 담길 변수 선언

// 메일 보내는 함수
const sendGmail = (_userEmail) => {
    code = generateRandomCode(6); // 6자리 랜덤 코드 생성
    console.log(_userEmail, code);
	
    // 보내는 메일 설정
    let transporter = nodemailer.createTransport({
        service: 'gmail',   // gmail로 메일을 보낼 것이기 때문에 gmail로 설정
        prot: 587,
        host: 'smtp.gmlail.com',
        secure: false,
        requireTLS: true,
        auth: {
            user: process.env.NODEMAILER_USER,  // 보내는 메일의 주소
            pass: process.env.NODEMAILER_PASS   // 보내는 메일의 2차 비밀번호
        }
    });
    
    // 메일 옵션 설정
    let mailOptions = {
    	// from : 보여질 메일 앞 이름과 보내는 메일의 주소
        from: `"HYERIM" <${process.env.NODEMAILER_USER}>`, 
        to: _userEmail, // 수신할 이메일
        subject: "[HYERIM TEST] 인증번호를 입력해주세요.", // 메일 제목
        // text: `인증번호 [${code}]를 인증 창에 입력하세요.`, // 메일 내용
        html: `<h1>이메일 인증</h1>
          <div>
            인증번호 [${code}]를 인증 창에 입력하세요.
            <a href='www.efforthye.com'>금쪽이스토리로가기</a>
          </div>`,
    };

    // 메일 발송    
    transporter.sendMail(mailOptions, function (error, info) {
        if (error) {
            console.log(error);
        } else {
            console.log('Email sent: ' + info.response);
        }
    });
}

5. 유저가 메일을 입력하고 요청 보내면 서버에서 함수 호출

• web 요청

<div onClick={async () => {
  const mail = prompt("인증번호를 보낼 메일을 작성해주세요.");
  // sendMail();

  const mailSend = await axios.post("http://localhost:8080/board/mail/mailSend", {
    mail : mail
  });

  // 인증번호
  console.log(mailSend.data);

}}>
  클릭시 이메일 보내기
</div>

• server router 처리

router.post("/mailSend", (req, res) => {
    sendGmail(req.body.mail);
    res.send(code);
});

확인

1. 메일을 보낼 주소 입력

2. 서버에서 인증코드를 생성해 메일을 발송함

3. 메일 도착

4. front쪽 console.log에서 유저에게 전송된 인증번호와 같은 코드가 뜨는 것을 확인할 수 있다.