이 글은 Velog에서 이전한 글입니다. Velog 원문 보기현재 진행중인 2개의 프로젝트 중 Sucat 프로젝트에서 문제가 발생했다.문제는 '닉네임 중복 검사' API 요청에서 발생했는데 기존 요구사항을 살펴보자닉네임 중복 검사 요구사항Get 요청body에 json 형식으로 'nickname' 속성에 중복 검사할 닉네임을 담아서 전송성공시 200 코드 반환기존의 요구사항은 위와 같았다. 백엔드 측에서 Postman으로 테스트할 때는 문제 없이 API 요청이 가능했기에 문제가 생길거라고 생각하지 못했다.그러나 AWS로 서버를 배포하고 프론트 쪽에서 API 테스트를 하던 중 문제가 발생했다. '닉네임 중복 검사' API에서 요구 사항을 모두 충족했음에도 에러가 발생했다.문제의 해답은 아주 가까이 있었다.H..

이 글은 Velog에서 이전한 글입니다. Velog 원문 보기⭐️ 프록시는 무엇일까?프록시는 클라이언트와 서버 사이에 대리로 통신을 수행하는 것을 가리켜 프록시(Proxy)라고 하며, 그 중계 기능을 하는 서버를 프록시 서버라고 한다.클라이언트, 혹은 반대로는 서버가 다른 네트워크에 간접적으로 접속 할 수 있기 때문에, 보안, 캐싱을 통한 성능, 트래픽 분산 등의 장점이 있다.한국에 있는 클라이언트(웹 브라우저)가 외국의 원 서버에 있는 특정 데이터가 필요한 상황이라고 가정해보자.정보를 가져오기 위해서 많은 시간이 소요될 것이다.이 때 외국의 원 서버와 한국 클라이언트의 중간에 위치한 한국의 캐시 서버가 있다면 프록시 캐시 서버에서 데이터를 가져올 수 있기 때문에 시간을 줄일 수 있다.또한 여러 사람이 ..

이 글은 Velog에서 이전한 글입니다. Velog 원문 보기캐시 시간 초과캐시 유효 시간이 초과해서 서버에 다시 요청하면 다음 두 가지 상황이 나타난다.서버에서 기존 데이터를 변경함서버에서 기존 데이터를 변경하지 않음캐시 만료후에도 서버에서 데이터를 변경하지 않았다면 데이터를 전송하는 대신에 저장해 두었던 캐시를 재사용 할 수 있다.단, 클라이언트의 데이터와 서버의 데이터가 같다는 사실을 확인할 수 있는 방법인 검증 헤더가 필요하다.⭐️ 검증 헤더와 조건부 요청검증 헤더와 조건부 요청검증 헤더캐시 데이터와 서버 데이터가 같은지 검증하는 데이터Last-Modified , ETag조건부 요청 헤더검증 헤더로 조건에 따른 분기If-Modified-Since: Last-Modified 사용If-None-Mat..

이 글은 Velog에서 이전한 글입니다. Velog 원문 보기⭐️ 캐시캐시는 데이터나 값을 미리 복사해 놓는 임시 장소를 가리킨다. 캐시는 캐시의 접근 시간에 비해 원래 데이터를 접근하는 시간이 오래 걸리는 경우 또는 값을 다시 계산하는 시간을 절약하고 싶은 경우에 사용한다.캐시에 데이터를 미리 복사해 놓으면 계산이나 접근 시간없이 더 빠른 속도로 데이터에 접근할 수 있다.📌 캐시의 기본 동작캐시가 없을 때 - 첫 번째 요청웹 브라우저가 GET/star.jpg 요청을 서버에 전송하면 서버에서 별 사진 응답을 내려준다.가정: 헤더 용량은 0.1M, 바디는 1.0M 라고 가정한다.요청을 하면 1.1M의 네트워크를 차지하며 응답이 내려온다.캐시가 없을 때 - 두 번째 요청클라이언트가 이전처럼 GET/star..

이 글은 Velog에서 이전한 글입니다. Velog 원문 보기⭐️ 쿠키쿠키HTTP 쿠키(HTTP cookie)란 하이퍼 텍스트의 기록서(HTTP)의 일종으로서 인터넷 사용자가 어떠한 웹사이트를 방문할 경우 사용자의 웹 브라우저를 통해 인터넷 사용자의 컴퓨터나 다른 기기에 설치되는 작은 기록 정보 파일을 일컫는다. 쿠키, 웹 쿠키, 브라우저 쿠키라고도 한다. 이 기록 파일에 담긴 정보는 인터넷 사용자가 같은 웹사이트를 방문할 때마다 읽히고 수시로 새로운 정보로 바뀐다.출처: https://ko.wikipedia.org/wiki/HTTP_%EC%BF%A0%ED%82%A4Set-Cookie: 서버에서 클라이언트로 쿠키 전달(응답)Cookie: 클라이언트가 서버에서 받은 쿠키를 저장하고, HTTP 요청시 서버로..

이 글은 Velog에서 이전한 글입니다. Velog 원문 보기HTTP Header를 보다보면 생각보다 많은 정보들이 담겨있는 것을 확인할 수 있다.개발자 도구만 열어 확인해보더라도 수많은 Header Key와 Value 값들이 존재하는 것을 볼 수 있는데, 여태 개발하면서 주로 사용하는 값은 극히 적었다.⭐️ 일반 정보• From: 유저 에이전트의 이메일 정보• Referer: 이전 웹 페이지 주소• User-Agent: 유저 에이전트 애플리케이션 정보• Server: 요청을 처리하는 오리진 서버의 소프트웨어 정보• Date: 메시지가 생성된 날짜📌 From유저 에이전트의 이메일 정보일반적으로 잘 사용되지 않음검색 엔진 같은 곳에서, 주로 사용요청에서 사용📌 Referer이전 웹 페이지 주소현재 요청..

이 글은 Velog에서 이전한 글입니다. Velog 원문 보기⭐️ 협상(Content-Negotiation)Content-Negotiation?클라이언트와 서버가 있다고 하자. 클라이언트가 원하는 표현으로 달라고 서버한테 요청을 한다. 그렇다면** 서버는 클라이언트가 원하는 우선순위에 맞춰서 표현 데이터를 만들어 준다.**클라이언트가 선호하는 표현 요청Accept: 클라이언트가 선호하는 미디어 타입 전달Accept-Charset: 클라이언트가 선호하는 문자 인코딩Accept-Encoding: 클라이언트가 선호하는 압축 인코딩Accept-Language: 클라이언트가 선호하는 자연 언어협상 헤더는 요청시에만 사용📌 Accept-Language 적용 전예를 들어서 내가 한국어 브라우저를 사용한다고 하자. ..

이 글은 Velog에서 이전한 글입니다. Velog 원문 보기⭐️ HTTP Header📌 HTTP 헤더의 용도-HTTP 전송에 필요한 모든 부가정보예) 메시지 바디의 내용, 메시지 바디의 크기, 압축, 인증, 요청 클라이언트, 서버 정보, 캐시 관리 정보...표준 헤더가 너무 많음https://en.wikipedia.org/wiki/List_of_HTTP_header_fields필요시 임의의 헤더 추가 가능helloworld: hihi❕ 과거📌 HTTP 헤더 분류 - REF2616(과거)과거의 헤더는 4가지로 분류됨.헤더 분류General 헤더: 메시지 전체에 적용되는 정보, 예) Connection: closeRequest 헤더: 요청 정보, 예) User-Agent: Mozilla/5.0 (Mac..

이 글은 Velog에서 이전한 글입니다. Velog 원문 보기⭐️ HTTP 상태코드HTTP 상태코드란 클라이언트가 보낸 요청의 처리 상태를 응답에서 알려주는 기능이다.크게 아래 5가지로 구분된다.1xx (Informational): 요청이 수신되어 처리중2xx (Successful): 요청 정상 처리3xx (Redirection): 요청을 완료하려면 추가 행동이 필요4xx (Client Error): 클라이언트 오류, 잘못된 문법등으로 서버가 요청을 수행할 수 없음5xx (Server Error): 서버 오류, 서버가 정상 요청을 처리하지 못함100번대 상태코드는 거의 사용하지 않는다.만약 모르는 상태 코드가 나타나면?클라이언트가 인식할 수 없는 상태코드를 서버가 반환하면?클라이언트는 상위 상태코드로 해..

이 글은 Velog에서 이전한 글입니다. Velog 원문 보기이미지 주소: http://www.lghnh.com/global/brand/detail.jsp?gbn=2&bid1=H125❓ 클라이언트에서 서버로 데이터 전송데이터 전달 방식은 크게 2가지쿼리 파라미터를 통한 데이터 전송GET주로 정렬 필터(검색어)메시지 바디를 통한 데이터 전송POST, PUT, PATCH회원 가입, 상품 주문, 리소스 등록, 리소스 변경데이터 전송의 4가지 상황정적 데이터 조회이미지, 정적 텍스트 문서동적 데이터 조회주로 검색, 게시판 목록에서 정렬 필터(검색어)HTML Form을 통한 데이터 전송회원 가입, 상품 주문, 데이터 변경HTTP API를 통한 데이터 전송회원 가입, 상품 주문, 데이터 변경서버 to 서버, 앱 클..