Skip to content

happyeon/Project_FamilyPet_module

Folders and files

NameName
Last commit message
Last commit date

Latest commit

 

History

2 Commits
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 

Repository files navigation

Family | Pet 프로젝트 기능별 모듈화

프로젝트 Family | Pet 에서 사용한 기능들 중 주요 기능들을 모듈화하여 구현하였습니다.

아래에 기능별로 간략하게 어떻게 구현하였는지 작성하였습니다.

보다 자세한 내용은 코드에 주석으로 덧붙여 설명하였습니다.


1. Login

  • Kakao, Naver API를 사용하여 SNS 로그인 구현

  • 이용자가 회원 인증에 성공하면 API로부터 받은 code 값을 이용해서 접근 토큰 발급 요청 API를 호출


2. Paging

  • 1페이지 당 10개의 게시물, 1블록 당 5개의 페이지를 출력하도록 구현
  • 여러 게시판에서 쉽게 재사용할 수 있게 JSTL 태그를 이용하여 페이징 구현

3. Papago

  • papago API를 사용하여 번역 기능을 구현
  • 사이트에서 애플리케이션을 등록 후 clientId값과 clientSecret값을 발급받는다.
  • ajax를 사용하여 입력 언어, 입력 내용, 번역 언어를 서블릿에 전달하고 번역된 데이터를 받는다.

4. Recommend

  • Mahout (머하웃)
    • 데이터셀을 넣어 학습을 시킨 후 input 데이터를 넣었을 때 output을 도출해주는 프로젝트
  • data.csv
    • 회원 ID, 아이템 ID, 유사도
  • Similarity
    • 사용자 유사 : 두 사용자 간의 유사한 정도를 측정하고 이것을 지표로 삼는다.
    • 아이템 유사 : 아이템 간의 유사한 정도를 측정해 지표로 삼는다.
  • Recommender
    • 사용자 기반 추천기 : 데이터가 꼬여있거나, 조그만 볼륨의 데이터 셋에 알맞고 빠른 추천시스템이 필수적이지 않다면 좋은 생산성을 보여준다.
    • 아이템 기반 추천기 : 사용자가 아닌 아이템의 유사한 정도를 지표로 삼는 추천기

5. SMS

  • Naver sens API를 사용
  • 문자서비스 API를 사용하기 위해 필요한 요소
    • Service ID : 클라우드 플랫폼 콘솔에서 사용할 프로젝트를 생성하면 볼 수 있는 키 값
    • timestamp : 현재시간, 1970년 1월 1일부터 경과한 시간을 long 값으로 리턴, 1/1000초(밀리세컨) 값을 리턴
    • access key : 접근키
    • secret key : 비밀키
  • JSON 형식으로 메시지 전송 요청을 한다.

6. Chat

  • WebSocket : 소켓을 통해 클라이언트와 서버 프로그램 사이에 데이터를 송수신할 수 있다.
  • WebSocket 프로토콜을 사용하여 통신하기 위해서 WebSocket 객체를 생성한다.
  • @ServerEndpoint : 클라이언트에서 서버로 접속할 주소로 지정
  • 웹소켓이 생성될 때 @OnOpen 어노테이션이 명시된 메소드를 읽어 session을 연다.
  • @onMessage를 통해 클라이언트가 보낸 메시지를 처리한다.
  • @OnClose는 접속이 끊겼을때 처리한다.

7. E-mail

  • 발신자의 메일 계정과 비밀번호를 설정한다.
  • property에 SMTP 서버 정보를 설정한다.
  • SMTP 서버 정보와 사용자 정보를 기반으로 session 클래스의 인스턴스를 생성한다.
  • Message 클래스의 객체를 사용하여 수신자와 내용, 제목의 메시지를 작성한다.
  • Transport 클래스를 사용하여 작성한 메시지를 전달한다.

8. Encryption

  • AES (Advanced Encryption Standard)
    • 고급 암호화 표준
    • 대칭키를 쓰는 블럭 암호
    • 크기가 128bit 이며 암호화 키의 길이가 128, 192, 256bit인 세 가지 종류가 AES 표준으로 지정되었다.
    • 각각 AES-128, AES-192, AES-256으로 불린다.
  • 패딩
    • 데이터를 특정 크기로 맞추기 위해서, 특정 크기보다 부족한 부분의 공간을 의미없는 문자들로 채워서 비트 수를 맞추는 것이다.
    • 암호화 시에는 반드시 필요한 방법이다.
    • Cipher c = Cipher.getInstance("AES/CBC/PKCS5Padding");

9. Map

  • Kakao API를 사용하여 구현
  • div 태그를 사용하여 지도를 담을 영역을 만든다.
  • 실제 지도를 그리는 Javascript API를 불러온다.
  • 지도의 중심좌표는 지도 생성에 반드시 필요하므로 무조건 작성해주어야 한다.
  • 지도를 띄우는 코드를 작성한다.
  • 사이트에서 제공하는 여러 기능들을 참고하여 코드를 작성한다.

10. Payment

  • 아임포트를 이용한 kg이니시스
  • 설치 환경 선택 (웹사이트/워드프레스/모바일앱/정기결제)
  • 사용할 PG사를 선택하고 저장 (테스트 모드로도 사용 가능)
  • 아임포트 라이브러리 추가 (아임포트는 JQuery 기반으로 동작하기 때문에 JQuery 1.0 이상이 반드시 설치되어 있어야 함)
  • window.IMP 변수를 초기화한다.
    • 회원가입 후 생성된 가맹점 식별 코드를 이용해서 window.IMP 변수를 초기화한다.
    • IMP.init('식별코드');
  • 결제 요청
    • 결제 창을 띄어야 하는 페이지에서 IMP.request_pay({parameter}) 함수 호출
    • 결제에 필요한 아래의 파라미터만 입력하고 함수를 실행하면 관리자 페이지에서 선택한 PG사의 결제 창이 실행된다.

11. reCAPTCHA

  • reCAPTCHA 유형 중 reCAPTCHA v2의 "로봇이 아닙니다." 체크박스를 사용
  • google reCAPTCHA 사이트에서 api 고유 사이트키를 발급받아 작성
  • site key : 사이트에서 reCAPTCHA 서비스를 호출하는 데 사용
  • secret key : 사용자의 응답을 확인하기 위해 어플리케이션 백엔드와 reCAPTCHA 서버 사이의 통신을 승인

About

No description, website, or topics provided.

Resources

Stars

Watchers

Forks

Releases

No releases published

Packages

No packages published