본문 바로가기

CS 잡지식

CORS 정책(Feat. 웹 사이트 보안 이슈, Referer) 일단 먼저 Request Header에 들어 가는 [Referer] 속성에 대해 먼저 이해를 하자 리퍼러를 참조함으로써 현재 표시 하는 웹페이지가 어떤 웹페이지에서 요청되었는지 알수 있으며, 어떤 웹사이트나 웹서버에서 방문자가 왔는지를 파악할수 있는 기능을 레퍼러를 통해 할수 있다. 구체적 설명 [http://www.info19.com/1.html] 이라는 웹페이지에 있는 링크를 클릭하여 [http://www.info19.com/2.html] 으로 이동했 을 때 Referer는 [http://www.info19.com/1.html] 이 된다. 대부분의 웹서버에는 전 트래픽로그가 존재하며, 브라우저가 송신한 HTTP리퍼러를 기록하고 있다. 많은 웹 로그 분석 소 프트는 이 정보를 처리 가능하다. 리퍼러 정.. 더보기
비동기/동기 + blocking/non-blocking(최종본) 동기 + blocking : [호출한] 함수가 [호출된] 함수의 실행이 완료될 때까지(return될 때까지) Thread1은 task2를 실행하지 않는다. 동기 + non-blocking : [호출한] 함수가 [호출된] 함수가 즉시 작업을 완료하지 못하면 즉시 return을 하여 코드 실행 제어 권을 다른 쓰레드에게 넘겨서 그 쓰레드는 [호출된] 함수의 실행이 완료될 때까지 다른 작업을 할 수가 있다. 이때, [호출한] 함수(쓰레드)는 주기적으로 [호출된] 함수에게 작업 완료 여부를 물어 본다 [호출된] 함수의 실행이 완료되면 비로서 return 값을 받아서 [호출한] 함수의 나머지 코드들을 실행을 한다. (non-blocking은 Thread 관점으로 본다면, 하나의 Thread가 여러 개의 IO를 처.. 더보기
CallBack함수(feat. 비동기 처리의 [동기화] ) CallBack함수 : A(),B()라는 두 개의 함수가 있다고 하자. 1.B()함수(Callback 함수)는 A()함수 내부에서 호출이 된다. 이떄, Callback 함수인 B() 함수는 A() 함수[B()함수를 제외한 코드의 집합]의 실행이 끝나고 나서야, 비로소 실행이 된다. 2.단지 함수를 등록하기만 하고 어떤 이벤트가 발생했거나 특정 시점에 도달했을 때 시스템에서 호출하는 함수! // 참고로 , 이 코드에는 callback 함수가 없고, callback 함수의 필요성을 설명을 하기 위하여 // setTimeout()이라는 비동기 함수를 먼저 설명을 하고 있다. function findUser(id) { let user; // 실행 순서 2 //setTimeout() : 비동기 함수(0.1초 실행.. 더보기
동기, 비동기 함수(FEAT. JS) function promiseFunc(){ return new Promise(function(res, rej) {// Doing something! res(1); }); } async function asyncFunc(){ console.log("2"); const res = await promiseFunc(); //여기서 asyncFunction()함수는 blocking 상태가 된다. console.log(res);// 고로, console.log(res)는 실행을 미루고, 17줄의 console.log(4) } //를 실행을 한다. // 그러다가 promiseFunc()실행이 완료가 되면, 그때서야 // console.log(res)가 실행이 되고, 함수가 종료된다. // 이 이하가 main() 부분.. 더보기
@Tailable(feat.SSE Protocol...) @Data @Document(collection = "chat") // 채팅이 오고 갈때마다, 이 [컬렉션]에 데이터들을 밀어 넣을 거다. public class Chat { @Id private String id; private String msg; private String sender; // 송신자 private String receiver; // 수신자 private LocalDateTime createdAt; } MongoDB에 "chat"이라는 [컬렉션]이 있다고 하자! db.chat.insert({sender:'ssar',receiver:'cos',msg:'안녕'}); // 송신자 : ssar, 수신자 : cos db.chat.insert({sender:'cos',receiver:'ssar'.. 더보기
Netty 서버(feat. 단일 스레드 이벤트 루프, 비동기,스프링은 비동기/Blocking..) 스프링 부트는 Spring [React] Web 사용 시, 톰캣이 아닌 Netty 서버를 자동으로 내장 서버로 등록을 한다. 이것은 [싱글 스레드 이벤트 루프 기능과] [비동기 기능]을 지원하는 서버이다. https://effectivesquid.tistory.com/65 Netty의 스레드 모델 Netty는 비동기 네트워크 프레임워크 입니다. 이번 글에서는 이 비동기 프레임워크가 어떻게 동작하는지 살펴 보겠습니다. Netty는 Channel에서 발생하는 이벤트들을 EventLoop가 처리하는 구조입니다. effectivesquid.tistory.com 자세한 내용은 위 사이트를 참조 (톰캣도 단일 스레드 이벤트 루프와 비공기 기능을 지원하지만, 스프링 부트가 자동으로 Netty 서버로 등록을 해버린다... 더보기
MongoDB의 장점(Feat. NoSQL...) Boar의 각 행이 누구의(어떤 user)의 데이터인지를 알기 위해서는 위와 같이 user 정보를 적어 주는 방법이 있다. 그러나 이 방법은 RDBMS의 [데이터 중복]을 최소화한다는 철학에 반한다. 그래서 FK를 이용하여 테이블들끼리 서로 참조하게 만든다. RDBMS의 장점 1. 데이터 중복 최소화 2. 데이터 변경 시, 해당 ROW만 변경하면 된다.(변경 용이) MongoDB와 같은 NoSQL은 컬렉션(List, 그중에서도 ArryaList 배열이라고 생각하면 됨)을 사용해서 저장을 한다. (Table 개념x,여담으로 MongoDB는 JavaScript로 만들어 져 있다.) (참고로, {id : 1, username : ssar, phone : 010-222}을 하나의 [JSON Object]라고 부.. 더보기
반응형 웹(Feat. boot strap) 반응형 웹 : 크기가 다양한 디바이스(스마트폰,데스크탑,노트북 등) 사이즈에 최적화된 UI를 제공하는 기술. Boot Strap: 어떤 디바이스에 어떤 OS가 사용되던 개발자는 신경 쓰지 않아도 UI가 자동으로 최적화되게 해주는 기술 (UI Component들이 매우 많다) boot strap은 12개의 그리드 시스템으로 실행된다. // 12 그리드 시스템 : 1개의 행을 12개의 열(column)으로 나눈다. A B C md: Middle Size 위 코드는 1개의 행(웹 브라우저에서의 한 줄)을 4 size만큼 3개의 layout으로 나눈 것이다. : 웹 브라우저에서 한 줄(row) 전체를 layout으로 한다. 그럼, 더보기