프로그래머스 15일차(HTTP,CDN)

박상하·2023년 12월 11일
0
post-thumbnail

헷갈리거나 잘모르겠거나 🧐

HTTP 통신 🎯

http: 클라이언트 서버 간 통신규약(형식)

API를 설계하는 수업 중

GET method는 URL로 데이터를 전달해줄 수 있지만
POST method는 body로 데이터를 전달해준다.

이 부분을 더 이해하게 위해 학습하였다.

method가 뭘까

API = URL + method(목적)

으로 이루어져있다. API는 결국 데이터 요청에 대한 지도(URL) + 뭐에 쓰려고(method)를 서버에 알려줘야
원하는 정보를 내어준다. 후에 origin이라는 출처도 동일해야하는걸로 알고있다.

그럼 그 Method에 따라 데이터가 전달되는 방식이 다르다는 걸까?

Post: body, Get: url

POST 🎯

일단 POST는 클라이언트에서 넘어오는 Input 데이터 등 유저에 대한 정보가 많다.
이러한 유저 정보를 url에 직접 넣어 전달해준다면 보안상 매우 좋지 않다.👾
그리고 만약 string형태가 아닌 정보를 전달해준다면 url에 담을 수도 없다.

http://localhost/username?id=tkdgk1996&password=123123

위 처럼 정보를 전달해주면 안된다..

url에 데이터를 넣어 Post요청을 보내지 않는 이유
1. 보안상 나쁘다.
2. 데이터타입이 string만이 아닐 수 있다.

그래서 Post 요청을 할 때는 body에 담아서 데이터를 보내게된다.

axios.post("http://www.website.com/music",Data)

위 코드처럼 보내주게 된다.

그럼 서버에서는

const express =require("express")
const app = express()
app.use(express.json())

app.post("http://www.website.com/music",(req,res)=>{
const data = req.body
// 클라이언트에서 보낸 데이터 받아옴
})

그럼 서버로 http body에 담겨 보내지는 것이다.

GET 🎯

사실 GET요청도 데이터를 직접 URL에 넣어주는 것이 아닌 데이터와 관련된 힌트를 URL에 넣어주는것이다.

이러한 힌트는 url에 모두 담겨져있다.

이러한 유튜브 뮤직 플레이리스트의 Url을 보면 다음과 같다.

https://www.youtube.com/watch?v=Skr5svivGlk&t=1197s

youtube.com이라는 도메인으로 연결되어있는 IP주소에 있는 서버에게
watch라는 API라는 데이터요청 메뉴판(?)에게 v=~~~이거이고 t는 ~~이거인 페이지 주라!

라고하는 것이다.

이처럼 Get요청에는 대체로 정적리소스에 대한 요청이 많기 때문에 유저에 대한 정보가 Post요청에 비해
적게 들어있다.

그렇지만 그럼에도 api를 설계할 때 요구하는 데이터에 대한 보안을 유지하게위해 인코딩하는 과정을 거쳐야 할 때도 있다고한다.

그리고 저러한 ? 뒤에 오는 문자열을 쿼리문(query string)이라고한다.

GET요청은
1. URL에 원하는 데이터에 대한 힌트가 담겨져있다.
2. string으로 데이터를 요청할 수 밖에 없다.

그런데 아까 그 express.json()은 뭐지 🧐

클라이언트와 서버간 데이터 교환에서 필요한건 파싱 🎯

아까 Post요청할 때의 코드를 보면

// 클라이언트
fetch.post("http://www.website.com/music",Data).then((res)=>res.json()).then((data)=>console.log(data)
//data출력
                                                                             
                                                                             
// 웹 서버
const express =require("express")
const app = express()
app.use(express.json())

app.post("/music",(req,res)=>{
const data = req.body
})

바로 데이터를 사용하지 못하고 클라이언트에서는 res.json() 내장 메서드를 사용하였고
웹 서버에서는 express.json()이라는 미들웨어를 사용하였다.

참고

객체 내부에 정의된 함수를 메서드
http에서 목적을 나타내는 GET,POST등도 메서드

다시 본론으로 돌아와서 왜 저러한 과정을 거쳐줄까

사실 서버와 클라이언트간의 데이터를 교환할 때 그 데이터의 타입을 맞춰주어야한다.
그럴때 필요한게 파싱

파싱 🎯

파싱이란 데이터의 구조,형식 변환
주로 데이터 형식간의 변환을 나타낸다.

이렇게 데이터를 교환할 때 서로 데이터 타입을 다시 한번 정렬해주어야하고
위 두 예제는 JSON (Javascript Object Notation)으로 형태를 맞춰주었다.

미들웨어 🧐

미들웨어: 양쪽을 연결하여 데이터를 주고 받을 수 있도록 중간에서 매개역할을 하는 소프트웨어

위 상황처럼 HTTP 요청과 응답 중간에 위치하여 해당 요청 및 응답을 가로채고
필요한 처리를 수행하거나 변경할 수 있는 기능을 제공한다.

주로 서버쪽에서 사용되는 게 미들웨어라고한다.

위 서버에서는 Express.json()이 req를 가로채 중간에 형변환을 시켜주는 미들웨어가 된다.

CDN 🎯

HTTP를 학습하다보니 CDN이란 단어가 많이 보였다.

CDN: Content Delivery Network

즉, 콘텐츠를 가져다주는 그런 서버이다.

CDN은 사실 이런 기업에서 많이 제공한다.
넷플릭스, 유튜브가 대표적이다. 넷플릭스와 유튜브는 세계 각국에서 사용되는 서비스이다.

그럼 서버는 어디에?? 유튜브의 메인 서버는 미국에 있다고한다.

그럼 해당 서버를 우리가 사용하려면?? 미국서버를 사용하게되면?

너무 멀고 아주 긴 케이블을 따라서 제공되는 데이터를 받기 때문에 가격도 비싸질 것이다.

그렇기 때문에 이런 기업들은 CDN이라는 네트워크를 사용한다.

CDN서비스는 결국 각 나라별 또는 지역별로 캐싱서버를 두는 것이다.

각 나라에 캐싱서버를 두고 사용자와 가까운 캐싱서버와 연결하여 사용자가 원하는 컨텐츠를 가져다준다.

결국 캐싱서버는 해당 기업이 제공하는 서비스의 리소스 일부를 캐싱해 저장해놓는다. 그렇게되면

사용자는 먼 거리의 서버와 소통해 DB를 새롭게 뒤져서 데이터를 받아올 필요없이
가까운 거리에 있는 캐싱서버에게 해당 데이터를 요청해 콘텐츠를 배달받을 수 있다.

그냥 "체인점"이라고 생각하면 된다.

이러한 과정으로 캐싱서버에 연결된다고한다.

  1. 사용자가 도메인을 검색한다.
  2. DNS 서버에서 해당 도메인과 일치하는 IP주소를 찾을 때 사용자와 가까이있는 캐싱서버를 찾는다.
    (이것은 기업에서 설정을 해놓는다)
  3. 사용자는 캐싱서버와 연결이 되고 해당 캐싱서버에서 원하는 컨텐츠를 받아오게된다.
  4. 만약 원하는 컨텐츠가 없다면 원본 서버에서 데이터를 가져올 수 있다.

캐싱이라는건 소프트웨어 하드웨어 가리지 않고 모두 사용할 수 있는데 이는 모두 목적은 동일하다.
그런데 그 범위가 넓어 추가적인 학습이 필요할 거 같다. 👾

일단은

캐시는 임시저장소.
알고리즘으로 치면 hash같은 알고리즘이다.
바로바로 꺼내쓸수있는 가벼운 데이터형태로 저장이 된다고 한다.

0개의 댓글

관련 채용 정보