원활한 서버 조작을 위해 !!

1

node.js

목록 보기
3/5
post-thumbnail

앞으로 서버 조작을 위해 용어 정리를 해봅시다. !!

  • Browser
  • Server
  • API
  • HTTP
  • Ajax
  • CORS
  • XSS

1. 브라우저 & 서버

브라우저는 클라이언트 이며 html, js, css로 작성한 코드를 컴퓨터가 알 수 있게 합니다. 컴퓨터 사용자에게 눈에 보이는 화면을 보여줍니다.

서버는 클라이언트로 부터 요청받은 사항의 대해 응답을 해줍니다.

2. API & HTTP

API는 Application Programming Interface로 응용프로그램 프로그래밍 인터페이스 입니다. 쉽게 말해서는 클라이언트가 서버에 원하는 것을 요청할때 요청 할 수 있는 것을 보여주는 메뉴판 같은 역할입니다.
자세히 말하면 서버자원을 잘 가져다 쓸 수 있게 만들어 놓은 인터페이스 입니다.
HTTP는 클라이언트와 서버가 통신할 때 사용하는 규약규칙입니다.
항상 요청과 응답으로 이루어 집니다.
http는 기본적으로 헤더와 바디를 가집니다.
헤더는 어디서 보내는 요청인가, 컨텐츠 타입은 무엇인가, 어떤 클라이언트를 이용해 보냈는가 라는 정보를 가집니다.

GET - 서버에 자원을 요청
POST - 서버에 자원을 생성
PUT - 서버의 자원을 수정
DELETE - 서버의자원을 제거

3.Ajax


form태그로 정보를 서버에 전송하면 페이지가 한번 전환이 되어야 한다.
페이지 전환으로 인해 필요하지 않은 부분까지 전부 로딩을 해야 합니다.

그래서 탄생한것이 원하는 부분만 로딩을 하기 위해 서버와 자유롭게 통신할 수 있는 XRH(XMLHttpRequest) 과 페이지 깜박 없이 seamless하게 작동하는 javaScript와 DOM을 이용하는 Ajax가 탄생하였습니다.
지금은 보다 쓰기 쉬운 fetch API를 많이 사용합니다.

서버에서 데이터를 가져오는 방법으로는

  • XMLHttpRequest
  • jQuery ajax
  • fetch

XMLHttpRequest

function reqListener () {
  console.log(this.responseText);
}
var oReq = new XMLHttpRequest();
oReq.addEventListener("load", reqListener);
oReq.open("GET", "http://www.example.org/example.txt");
oReq.send();

jQuery ajax

$.ajax({
  url: 'http://example.com',
  method: 'GET',
  dataType: 'json'
})
  .done(function(json) {
	console.log(json)
  })
  .fail(function(xhr, status, errorThrown) {
    
  })
  .always(function(xhr, status) {
	console.log('요청완료')
  });

fetch

fetch('http://example.com')
  .then(res => res.json())
  .then(data => {
    console.log(data);
  })
  .catch(err=>{
    console.error(err)	
  });

4.CORS

cors는 브라우저가 리소스로드를 허용해야하는 원본이 아닌 다른 원본을 서버가 나타낼 수 있도록 하는 HTTP 헤더 기반 메커니즘 입니다.
즉, 이 API를 사용하는 웹 애플리케이션은 자신의 출처와 동일한 리소스만 불러올 수 있으며, 다른 출처의 리소스를 불러오려면 그 출처에서 올바른 CORS 헤더를 포함한 응답을 반환해야 합니다.

이때 출처는 Protocol과 Host, 그리고 위 그림에는 나와있지 않지만 :80, :443과 같은 포트 번호까지 모두 합친 것을 의미한다. 즉, 서버의 위치를 찾아가기 위해 필요한 가장 기본적인 것들을 합쳐놓은 것이다.

자세한건 다음 시간에 더 정리 할 것이다.

5.XSS

xss란 보안이 약한 웹 어플리테이션에 대한 웹기반 공격 입니다.
클라이언트 즉 사용자를 대상으로 한 공격이다.

reflected XSS와 Stored XSS 그리고 DOM Based XSS 세가지로 분류할 수 있다.

공격자가 미리 xss공격에 취약한 웹사이트를 탐색하고 xss공격을 위한 스크립트를 포함한 url을 사용자에게 노출시킨다. 사용자가 해당 url을 클릭할 경우 취약한 웹사이트의 서버에 스크립트가 포함된 url을 통해 request를 전송하고 웹 서버에서는 해당 스크립트를 포함한 response를 전송하게 된다.

XSS 위험성

  • 쿠키 정보 및 세션 ID 획득
  • 시스템 관리자 권한 획득
  • 악성코드 다운로드
  • 거짓페이지 노출
profile
👩🏻‍💻항상발전하자 🔥

0개의 댓글