본문 바로가기

국비과정/Spring

20230823 _[58일차]_01. admin 메일보내기 & notice 글내용띄우기

아웃룩 로그인 후 설정 - 전자 메일 동기화에 들어가보면 아래창이 나온다. 

POP 및 IMAP 란?

* SMTP (Simple Mail Transfer Protocol) 

이메일 전송 시 사용되는 표준 프로토콜

 

* IMAP (Internet Access Message Protocol)

메시지를 읽어올 때 사용되는 클라이언트/서버 프로토콜

> 다중로그인 지원, 이메일 전송은 지원x

 

* POP3 (Post Office Protocol Version 3)

단방향 클라이언트 서버 프로토콜

 

* IMAPPOP의 차이점 (불러오는 방식)

IMAP  : 이메일 메시지 및 첨부파일을 열면 메일 서버에 보관되어 다른 기기에서도 동일한 정보를 확인할 수 있다.

POP : 이메일 메시지 및 첨부파일이 하나의 기기에 다운로드 된 후 메일 서버에서는 삭제된다.


admin - mail 메뉴 이어서 해보자

어제 만들어준 mail.jsp에 스타일지정해주면

메일창처럼 꾸며졌다.

 

컨트롤러에서 jsp의 form 내부의 값들(메일제목, 보내는주소, 메일내용)을 잡아올거다.

리턴값은 foward로 보내도 상관없다.

메일보내기 페이지에서 입력값들을 채워주고 버튼을 누르면(폼제출)

컨트롤러에서 map으로 잡아와 콘솔창에 출력된다.

 

새로 만들었던 아웃룩 계정 및 정보들을 가져온다.

메일보내기 위한 정보들을 mail객체에 넣어준다.

밑줄부분 throw로 던지기

 

타입때문에 오류가 난다. (Object => String 으로 캐스트 필요)

아래처럼 스트링으로 처리해준다.

 

메일을 보내보면 안된다.

아웃룩 계정을 만들때 문자로 2단계 인증을 했었는데 그래서 안된다고 한다. 근데 아닌것같다.

 

일단 util에서 값을 잡아 true 값이

반환하도록 설정해주고

setStartTLSEnabled () : 전송 계층 보안 Transport Layer Security (TLS) 암호화 프로토콜

 


[Spring]Spring 네이버 메일 보내기(Apache Commons Email, Javax mail) : 네이버 블로그 (naver.com)

 

[Spring]Spring 네이버 메일 보내기(Apache Commons Email, Javax mail)

Java 네이버 메일 보내기 - 네이버 메일 SMTP 설정 - Apache Commons Email 라이브러리 사용시  ·...

blog.naver.com


파일과 이미지를 보내기 위해 html메일을 사용 & 메소드 타입 void로 변경.

 

public void htmlMailSender(Map<String, Object> map) throws EmailException {
      String emailAddr = mail.emailAddr;// 보내는 사람
      String passwd = mail.passwd;// 메일의 암호를 넣어주세요.
      String name = "스프링에서 보냄";// 보내는 사람 이름
      String hostname = mail.hostname;// smtp 주소
      int port = mail.port;// 포트가 뭔지 모르면 검색하셔야 합니다.
      // 메일보내기 작업하기
      //SimpleEmail mail = new SimpleEmail();
      HtmlEmail mail = new HtmlEmail(); //html메일 보내기로 변경합니다.
      mail.setCharset("UTF-8");
      mail.setDebug(false);
      mail.setHostName(hostname); // 고정
      mail.setAuthentication(emailAddr, passwd); // 고정
      mail.setSmtpPort(port); // 고정
      mail.setStartTLSEnabled(true); // 고정
      mail.setFrom(emailAddr, name); // 고정

      mail.addTo((String) map.get("to")); // 받는 사람 email
      mail.setSubject((String) map.get("title")); // 메일 제목
      //mail.setMsg((String) map.get("content")); // 본문내용
      //이미지 경로 잡아오기
      String path = uploadPath();
      String img = "https://whale.naver.com/img//banner_beta_download_phone_1440.png";
      String file2 = path + "/Thymeleaf.docx";
      
      String html = "<html>";//코드가 길어지니 여기서 작업해서 넣어줄게욤.
      html += "<h1>그림을 첨부합니다</h1>";
      html += "<img alt=\"이미지\" src='"+img+"'>";
      html += "<h2>임시 비밀번호를 보내드립니다.</h2>";
      html += "<div> 임시 암호 : 45679845671564894534768415674654168</div>";
      html += "<h3>아래 링크를 클릭해서 암호를 변경해주세요.</h3>";
      html += "<a href=\"http://nid.naver.com\">눌러주세요</a>";
      html += "</html>";
      mail.setHtmlMsg(html);
      //첨부파일도 보내기
      EmailAttachment file = new EmailAttachment();
      //위 파일은 문서파일입니다.
      file.setPath(file2);
      mail.attach(file);
      
      String result = mail.send(); // 메일 보내기
      System.out.println("메일 보내기 : " + result);
   }

 


Spring Boot - 이메일 전송(1)(JavaMailSender) (tistory.com)

 

Spring Boot - 이메일 전송(1)(JavaMailSender)

Spring Boot 이메일 전송 1. pom.xml 의존성 주입 org.springframework.boot spring-boot-starter-mail - JavaMailSender 등 클래스, 인터페이스를 사용하기 위함 2. resources 경로 밑에 mail/email.properties 파일 생성 (gmail SMTP 사

hanke-r.tistory.com

  


    윈도우 새창으로 열기 적용하는 방법 *** 유용할듯

 

[JavaScript] window.open 새창으로 열기 사용법 (tistory.com)

 

[JavaScript] window.open 새창으로 열기 사용법

안녕하세요, 오늘은 Javascript로 웹브라우저에서 새창으로 여는 방법에 대해서 알아보도록 하겠습니다. 웹페이지를 개발하다 보면 새 페이지로 팝업을 띄어야 하는 경우가 있습니다. 이때 사용하

ssd0908.tistory.com

 


[스프링] POST로 팝업 윈도우 창 데이터 값 전달하면서 새로 생성하기 (baekyle.com)

 

 

[스프링] POST로 팝업 윈도우 창 데이터 값 전달하면서 새로 생성하기

코딩을 하다보면 팝업 윈도우 창을 호출해야 하는 경우가 생긴다. 팝업 윈도우 창에 간단한 텍스트를 적는 경우가 대다수이나 때로는 많은 데이터를 담는 기능을 요하는 팝업이 필요할 수 있다.

baekyle.com

 


admin-notice.jsp 정리좀 해주고

<style type="text/css">

.notice-write-form{
   width: 90%;
   height: auto;
   margin: 10px;
   padding: 20px;
   box-sizing: border-box;
}
.notice-write-form input{
   height: 20px;
   width: 100%
}
.notice-write-form textarea{
   width: 100%;
   height:300px;   
   margin: 5px 0px;
}
.notice-write-form button{
   width: 100px;
   height:50px;
}
table{
   width: 800px;
   text-align: center;
   border-collapse: collapse;
   float: left;
}
tr{
   border-bottom: 1px solid silver;
}
tr:hover{
   background-color: silver;
}
.title{
   text-align: left;
   width: 40%;
}
.content-view{
   width: calc(100% - 800px);
   height: 400px;
   background-color: gray;
   float: right;
}

</style>

제이쿼리 사용위해서 상단에 코드 넣어주고

title을 클래스 title로 잡아와서 클릭했을 때 팝업을 띄우는 기능을 넣어보자. 

글제목 클릭하면 팝업이 뜬다.

이번에는 title의 text를 잡아와서 팝업으로 띄워보자.

잘 잡아온다.

 

title의 형제요소인 nno를 .siblings() 으로 불러와서 글번호를 팝업으로 띄워보자 

짠 잘뜬다.

이렇게 잡아온 nno를 다시 nno라는 변수에 넣어주고 ajax 사용할예정, 

success / error 부분 작성


ajax로 nno를 post방식으로 ./noticeDetail 로 보낸다.

이걸 컨트롤러에서 잡아서 콘솔에 띄워본다.


jackson사용해보기

 

* JsonNode : 불변하는 객체, 값을 불러올 수 있고 넣을 수는 없다.

* ObjectNode: 가변하는 객체, 값을 불러올 수 있고 넣을 수도 있다.

name이라는 이름으로 "홍길동"이라는 임의의 값을 넣어주고  

notice.jsp에서 ajax로 받아서 팝업으로 띄워본다. 

값을 잘 잡아온다.

 

이제 nno를 db로 보내고 결과값을 json으로 내보내 jsp에 띄워보자.

 

mapper에서 매개변수로 가지고 간 nno를 비교해서 ncontent를 가져오는 쿼리문 실행

json값을 jsp에서 잡아서 팝업으로 띄워보면

 

공지글을 클릭하면 글내용이 팝업으로 나온다.


map을 사용해보자 

jsonMap 사용 (ObjetMapper)

postman에서 잘 잡히는지 테스트.


공지글(table) 오른쪽에 div생성해주고 여기에 db에서 불러온 content를 넣어준다.

그럼 이제 글제목을 클릭하면 글내용(content)이 옆에 뜬다.

 


이제 삭제여부 눈모양 아이콘을 클릭했을 때의 기능을 넣어준다.

일단 눈모양 아이콘을 클릭했을때 해당글의 번호인 nno를 잡아온다.

 

이걸 컨트롤러에서 잡아서 서비스에 noticeHide() 메소드를 실행시킨다.

DAO에 noticeHide() 메소드를 실행시킨다.

클릭한 글번호와 일치하는 데이터의 ndel값을 0으로 바꾼다. 

(아래 캡쳐는 1이라고 되어있는데 0으로 해줘야한다.)

두종류의 눈모양 아이콘을 클릭했을때 글번호 잘 잡아오는지 확인해본다.

 

메소드 타입 int로 변경하고 return을 붙여준다.

쿼리문 수정** 

if ( ndel = 1, 0, 1 )

ndel=1 참이라면 0을 반환, 거짓이라면 1을 반환

아래의 쿼리문을 써도 된다.

<update id="noticeHide" parameterType="Integer">
UPDATE notice
SET ndel = CASE
    WHEN ndel = 1 THEN 0
    ELSE 1
END
WHERE nno=#{nno}

</update>

 

눈모양을 클릭하면 mapper의 sql문이 실행되어

영향받은 행의 수(update)를 result로 받아서 ajax에서 팝업으로 띄운거다. 

그리고 새로고침을 하면 눈모양이 바뀐다. 

 

이제 모양을 바로 바꿔줄건데

아래처럼 해주면

클릭하면

모양이 바로 바뀐다.

그런데 한번 바뀐건 다시 바뀌지 않는다.

아래처럼 해주면 토글처럼 계속 바뀐다.


[ Jackson ]

Json <==>  Java Object 변환을 위한 Java 라이브러리 

Jackson 라이브러리가 존재해야 사용가능하다.

 

ObjectMapper : JSON을 읽기, 쓰기, 변환 기능을 제공하는 객체

JsonNode (불변) : key-value

ObjectNode (가변) : key-value

ArrayNode (가변) : value1, value2..