- Server Goals
클라이언트, 서버, API 가 무엇인지 정의 내릴 수 있다.
- 클라이언트: 화면에 보여지는 앱 화면 (UI)부분을 담당
서버에 요청을 하고 서버로 부터 응답을 받는 역할- 서버 : 클라이언트와 DB사이에서 연결고리를 하는 역할
- API : 애플리케이션 소프트웨어를 구축하고 통합하는 정의 및 프로토콜 세트. 정보 제공자와 정보 사용자 간의 계약으로 지칭되며 소비자에게 필요한 콘텐츠(호출)와 생산자에게 필요한 콘텐츠(응답)를 구성
웹 개발과 관련한 클라이언트-서버 아키텍처를 이해할 수 있다.
- 2Tier아키텍쳐: 클라이언트와 서버로 구성된 구조
클라이언트와 서버를 분리하여 어플과 DB로 분리되어있기떄문에
DB의 변경이 편리하다는 장점
클라이언트와 서버가 서로 통신하기 위해 사용하는 HTTP 프로토콜에 대해 이해할 수 있다.
- HTTP: 클라이언트와 서버가 서로 통신할수있게 도와주는 징검다리같은 역할이 프로토콜인데 그 종류중 하나가 HTTP
HTTP를 통해 요청과 응답을 전달받을수 있다
HTTP 메소드의 종류를 이해할 수 있다.
- GET,POST,PUT,DELETE
HTTP 메시지가 어떤 구성으로 이루어져 있는지 이해할 수 있다.
- Request 메세지
- Response 메세지
AJAX가 무엇이고, 왜 필요한지를 이해할 수 있다.
- JS라이브러리중 하나이고 비동기식 자바스크립트XML이라고 한다
- XMLhttpRequest객체를 통해 전체 페이지를 새로고침할 필요없이 페이지 일부만 새로고침이 되고 데이터가 로드되는 기법
JS를 사용한 비동기 통신,
클라이언트와 서버간 XML데이터를 주고받는 방식
이런게 AJAX기능이다
ex)자동완성기능,네이버 메인화면의 뉴스스탠드- 비동기를 이용해 필요한 부분만 불러와 사용할 수있는게 큰 장점
- HTTP프로토콜은 무상태성이라는 특징을 갖고있기때매
res와 req를 보내고 받아오면 이전 요청과 응답에 대해선 기억하지않는다.
화면의 내용을 갱신할때 다시 req,res를 할려면 전체를 갱신해야 하기때매 자원과 시간낭비가 엄청나다.
이래서 페이지의 일부분만 갱신할 수 있도록 XMLhttprequest객체를 통해 서버에 req한다.
이떄 JSON형태나 XML형태로 필요한 데이터만 받아와 자원과 시간을 아낀다
AJAX 통신을 가능하게 하는 fetch API를 이용할 수 있다.
CORS가 왜 필요한지 이해할 수 있다
- 보안상의 이유로 브라우저는 보통 SOP(동일 출처 정책)을 따른다
동일한 서버에서만 리소스를 가져올수있다
하지만 현재엔 동일 서버에서만 리소스를 가져올수없어서
Cross-origin요청을 제한적으로 허용함으로서 안전하게
리소스를 받아올수있게 만들어준 정책
XSS가 어떤 원리를 통한 공격 방법인지 이해할 수 있다.
- 정상적인 웹 앱에 악성 스크립트를 주입하는 공격
- input태그 등 클라이언트의 입력을 통해 발생하는 경우가 많다
- 의도치않은 행동을 수행시키거나 쿠키나 세션,토큰등의 민감한 정보 탈취할수있다
- JS를 통한 공격이 가장많음
XSS를 어떻게 방지하는 지 이해할 수 있다.
- 스크립트를 일반 문자열로 변환하는 필터장치를 마련해 예방가능
- 입력필터나 라이브러리 제작 BBCode사용
XSS 공격을 방지하는 7계명
- 허용된 위치가 아닌 곳에 신뢰할 수 없는 데이터가 들어가는것을 허용하지 않는다.
- 신뢰할 수 없는 데이터는 검증을 하여라.
- HTML 속성에 신뢰할 수 없는 데이터가 들어갈 수 없도록 하여라.
- 자바스크립트에 신뢰할 수 없는 값이 들어갈 수 없도록 하여라.
- CSS의 모든 신뢰할 수 없는 값에 대해서 검증하여라.
- URL 파라미터에 신뢰할 수 없는 값이 있는지 검증하여라.
- HTML 코드를 전체적으로 한번 더 검증하여라.
출처: [불곰]
개발자를 향해