이번장에서는 Angular로 간단한 게시판을 만들어봄으로써 CRUD(Create/Read/Update/Delete) 실습을 해보겠습니다. 게시판의 기능은 총 4가지로 구성되며 각각 게시글 조회, 게시글 쓰기, 게시글 수정, 게시글 삭제로 이루어지며 하나씩 구현해보겠습니다.…
이번 장에서는 로그인한 회원의 정보를 표시하는 내정보 화면을 구현해 보겠습니다. Interceptor를 이용하여 인증이 필요한 API의 Http Header 세팅을 공통화하고, 인증(로그인)이 필요한 페이지에 대한 접근을 처리하는…
이번 장에서는 가입과 로그인 기능을 추가하여 Rest API와 연동하는 방법을 실습하겠습니다. 이번 실습 부터는 리소스를 제공할 rest api가 필요하므로 아래 내용을 참고하여 서버를 띄우고 실습하겠습니다.…
Angular 프레임워크를 이용하여 Front 웹사이트를 만드는 실습을 해보겠습니다. Angular는 Front 웹을 만드는 프레임워크 이므로 데이터와 비즈니스 로직을 적용하려면 리소스를 제공하는 API서버가 따로 필요합니다. 리소스를 제공할…
이번 장에서는 지금까지 만든 웹소켓 채팅 서버를 실제 서버에 올려보고 SSL을 적용하는 실습을 진행해보겠습니다. 실습 내용은 다음과 같습니다. 서버에서 Executable Jar로 Websocket 채팅서버를 실행CertBot을 설치하여 무료 SSL 인증서 발급Nginx의 ReverseProxy를 이용한 WSS( WebsocketSecure ) 구축 실습 환경 Instance - AWS Freetier…
이번 장에서는 채팅방의 기능을 좀 더 고도화하는 실습을 진행하겠습니다. 기존 채팅방에서는 메시지 전달이 무조건 클라이언트에서 서버 측으로 전달된 후에 처리되었는데요. 이번에는 서버에서 처리할 수 있는 메시지와 클라이언트에서 처리할 수 있는 메시지를 구분하여 좀 더 효율적으로 프로세스를 개선해 보겠습니다. 그리고 채팅방 입장 시 클라이언트의 숫자를 표시할 수 있도록 기능을 추가해보겠습니다. 채팅방 입장/퇴장시 알림 메시지를 서버에서 처리하도록 개선채팅방 입장/퇴장시 인원수 표시 채팅 메시지는 현재 ENTER(입장), TALK(대화) 두 가지 타입을 가지고 있습니다. 여기에 QUIT(퇴장)을 추가하여 총 3가지 타입을 사용하도록 합니다. 그리고 채팅방에 메시지가 전달될 때 인원수 정보도 포함되도록 하여 실시간으로 인원수가 갱신되도록 합니다. 채팅방 인원수의 갱신은 입장, 퇴장 이벤트에 한 번씩만 갱신해도 됩니다. 다만 채팅방에 입장한 모든 클라이언트가 입장, 퇴장 이벤트를 수신 못하는 경우를 대비하여 비효율적이긴 하지만 메시지가 수신될 때마다 갱신하도록 처리하겠습니다. ChatMessage…
이번 장에서는 SpringSecurity와 Jwt를 이용하여 Web 및 Websocket의 보안을 좀 더 강화하고. 기존의 복잡한 로직을 간소화하는 작업을 진행해 보겠습니다. 크게 아래의 3가지 작업을 진행하겠습니다. SpringSecurity를 통한 로그인 및 간단한 회원 정보 연동Jwt Token을 이용하여 websocket 통신 보안 강화Redis Topic 공유를 통한 메시지 전송 프로세스 간소화 간단하게 요약하면 채팅과 관련된 웹페이지의 접근권한은 SpringSecurity를 통해 통제합니다. 즉 로그인한 회원만 채팅 화면에 접근 가능하도록 처리합니다. 그리고 WebSocket 연결 및 메시지 전송은 Jwt 토큰을 통해 통제합니다. Websocket 접속이나 메시지 전송 시엔 헤더에 유효한 Jwt Token을 보내야 하며, 유효하지 않은 token에 대해서는 요청 내용을 처리하지 않습니다. …
앞 장에서 실습을 통해 채팅을 구현해 보았습니다. websocket과 Stomp를 이용한 구현만으로도 채팅의 기본 기능은 충분히 구현할 수 있는 것을 확인할 수 있었습니다. 하지만 서비스에 사용하려면 좀 더 쓸만하게 변경이 필요합니다. 앞장에서 만든 채팅 서비스는 몇 가지 문제가 있습니다. 서버를 재시작 할때마다 채팅방 정보들이 리셋됨 채팅방의 메인 저장소가 없으므로 서버의 메모리에 적재된 채팅방은 서버를 재시작할 때마다 초기화되는 이슈가 있습니다. DB를 이용하거나 다른 저장소를 이용하여 채팅방이 계속 유지되도록 처리가 필요합니다. 여기서는 Redis를 저장소로 이용해 보겠습니다. 채팅서버가 여러대이면 서버간 채팅방을 공유할수가 없음 현재는 채팅방을 websocket과 Stomp pub/sub를 이용하여 구현하였습니다. 그런데 이러한 구조는 pub/sub가 발생한 서버 내에서만 메시지를 주고받는 것이 가능합니다. 즉 구독 대상인 채팅방(topic)이 생성된 서버 안에서만 유효하므로 다른 서버로 접속한 클라이언트는 해당 채팅방이 보이지도 않고, 채팅방(topic) 구독도 불가능합니다. 즉 구독 대상(채팅방 : topic)이 여러 서버에서 접근할 수 있도록 개선이 필요합니다. 요구조건을 해결하려면 공통으로 사용할 수 있는 pub/sub 시스템을 구축하고 모든 서버들이 해당…
이전 장에서 websocket을 통하여 간단한 서버/클라이언트 통신을 구현해 보았습니다. 메시징 방식을 잘 정의한다면 websocket만으로도 충분히 좋은 서버/클라이언트 소켓 서버를 완성할 수 있습니다. 하지만 단순한 통신 구조로 인해 Websocket만을 이용해 채팅을 구현하면 해당 메시지가 어떤 요청인지, 어떻게 처리해야 되는지에 따라 채팅룸과 세션을 일일이 구현하고 메시지 발송 부분을 관리하는 추가 코드를 구현해 줘야 합니다. 이번 장에서는 Websocket의 프로세스를 좀 더 고도화하고 메시징에 좀 더 최적화된 방식을 구현하기 위해 Stomp를 적용해 보겠습니다. Stomp Stomp는 메시징 전송을 효율적으로 하기 위해 나온 프로토콜이며 기본적으로 pub/sub 구조로 되어있어 메시지를 발송하고, 메시지를 받아 처리하는 부분이 확실히 정해져 있기 때문에 개발하는 입장에서 명확하게 인지하고 개발할 수 있는 이점이 있습니다. 또한 Stomp를 이용하면 통신 메시지의 헤더에 값을 세팅할 수 있어 헤더 값을 기반으로 통신 시 인증처리를 구현하는 것도 가능합니다. pub/sub란 메시지를 공급하는 주체와 소비하는 주체를 분리하여 제공하는 메시징 방법입니다. 기본적인 콘셉트를 예로 들면 우체통(topic)이 있으면 집배원(publisher)이 신문을 우체통에 배달하는 액션이 있고, 우체통에 신문이 배달되는 것을 기다렸다가 빼서 보는 구독자(subscriber)의 액션이 있습니다. 여기서 구독자는 여러명이 될 수 있습니다. pub/sub 콘셉트를 채팅룸에 대입하면 다음과 같습니다. 채팅방을 생성한다 - pub/sub…
monolithic 아키텍쳐로 이루어진 시스템은 자원을 동적으로 할당하거나 해제하는 일이 빈번한 환경에서 유연하게 대처하기가 어렵습니다. 예를 들면 로드 밸런싱을 하거나 장애 복구 등이 빈번한 환경을 구축하려면 가용한 서비스 인스턴스에 대한 정보(host, port)를 누군가가 관리하고, 해당 정보를 동적으로 제공할 수 있어야 합니다. 그런데 monolithic 시스템은 처음부터 그러한 점을 고려하여 설계된 시스템이 아니기 때문에…
이번장에서는 Spring Cloud를 이용하여 Gateway(Routing & Filter)서버를 구축해 보도록 하겠습니다. SpringCloud에서 Gateway는 서로 분산되어있는 서비스들을 하나로 모아주는 관문같은 역할입니다. 기존의 로드밸런서, 리버스 프락시 기존의 리버스…
과거에 분산시스템이란 개인이 접근할 수 없는 전문적인 분야로, 복잡하고 정교한 시스템으로 구성되어 있어 개인 개발자 혼자 구축하거나 운영할 수 없는 영역이었습니다. 그러나 Spring Cloud가 나오면서…
이번장에서는 외부 리소스를 처리하는 방법에 대해 살펴보겠습니다. Angular는 통신을 위한 HttpClient 모듈을 제공하며, 이를 통해 외부 Rest 서버와 통신하여 리소스를 처리 할 수 있습니다. 외부…
Spring에서 제공하는 Websocket을 이용하여 간단한 채팅 서버를 구현해 보도록 하겠습니다. 일반적인 http통신을 하는 서버들과 달리 채팅 서버는 socket통신을 하는 서버가 필요합니다. 통상적으로 http통신은 Client의 요청이 있을 때만 서버가 응답하고 연결을 종료하는 단방향 통신입니다. 따라서 클라이언트가 서버에 접속해 콘텐츠를 요청하고 결과를 받아 소비하는 구조의 서비스에서 많이 사용됩니다. 그에 반해 socket통신은 Server와 Client가 지속적으로 연결을 유지하고 양방향으로 통신을 하는 방식입니다. 주로 채팅 같은 실시간성을 요구하는 서비스에서 많이 사용됩니다. Websocket Websocket은 기존의 단방향 HTTP 프로토콜과 호환되어 양방향 통신을 제공하기 위해 개발된 프로토콜입니다. 일반 socket통신과 달리 HTTP 80 Port를 이용하므로 방화벽에 제약이 없으며 통상 Websocket으로 불립니다. 접속까지는 HTTP 프로토콜을 이용하고 그 이후의 통신은 자체적인 Websocket 프로토콜로 통신하게 됩니다. Springboot Websocket 서버 구축 다음과 같이 Websocket서버를 구축합니다. 일반적인 boot구성과 별다를 게 없으므로 쉽게 구축 가능합니다. 신규…
이번 장에서는 Spring2.0의 주요 feature중 하나인 reactor(reactive)가 spring-data-redis에 어떻게 적용되어 있는지 실습을 통해 확인해 보겠습니다. redis에서 reactive를 사용하면 대용량의 요청을 처리할때 non block으로 처리하므로 blocking…
이번 장에서는 폼에 입력된 값의 유효성을 체크하는 방법에 대해 실습하겠습니다. Input 필드의 값 유효성 체크 ngModel을 사용해야 하므로 FormsModule을 app.module.ts에 선언합니다. // app.module.ts import {…
이번 장에서는 지금까지 개발한 api에 캐시를 적용해 보도록 하겠습니다. 캐시란 자주 사용되는 데이터를 메모리에 저장하고 반환하여 하드디스크의 원본데이터를 거치지 않게 함으로서 리소스 READ시 효율을 높이는…
Angular 프레임웍에서 웹페이지는 컴포넌트의 집합으로 표시됩니다. 또한 웹페이지를 브라우저에서 출력하기 위해서는 유일한 URL이 필요합니다. Angular에서는 이렇게 유일한 URL과 컴포넌트 사이를 맵핑하는 기능을 제공하는데 이것을 Routing이라고…
이번장에서는 Redis를 이용한 발행(publish)및 구독(subscribe)모델의 구현 방법에 대해 설명하겠습니다. (이하 pub/sub) pub/sub는 특정한 주제(topic)에 대하여 해당 topic을 구독한 모두에게 메시지를 발행하는 통신 방법입니다.이를테면 날씨정보를 구독한…
CentOS에 Apache Kafka를 설치하는 방법에 대하여 알아봅니다. 공식 홈페이지 https://kafka.apache.org/https://kafka.apache.org/quickstart java 설치 kafka는 Java기반에서 동작하므로 현재버전 확인 후 Java8 이상을 설치합니다. $ java -version $…