# headers

12개의 포스트
post-thumbnail

코린이에서 코른이로 ( HTTP )

HTTP Messages HTTP Messages는 클라이언트와 서버 사이에서 데이터가 교환되는 방식이다. HTTP Messages에는 다음과 같은 두 가지 유형이 있다. 요청(Requests) 응답(Responses) HTTP Messages는 몇 줄의 텍스트 정보로 구성된다. 그러나 개발자는 이런 메시지를 직접 작성할 필요가 거의 없다. 구성 파일, API, 기타 인터페이스에서 HTTP Messages를 자동으로 완성한다. 요청(Requests)과 응답(Responses)은 다음과 같은 유사한 구조를 가진다. start line : start line에는 요청이나 응답의 상태를 나타낸다. 항상 첫 번째 줄에 위치한다. 응답에서는 status line이라고 부른다. HTTP

2023년 1월 30일
·
0개의 댓글
·
post-thumbnail

fetch를 쓰면 안되나요?

fetch를 사용해서 api 통신을 할 때 응답헤더에 값을 조회하며 생겼던 문제점에 대해 이야기를 해보자고 한다. 문제 상황 login을 처음에 진행했을 때 header에 authorization 값이 조회가 되지 않는 문제가 발생했다. fetch 코드 res.headers.authorization 를 콘솔로 찍어보았을 때 해당하는 값이 조회가 되지 않았다. res을 조회해도 해당하는 우리가 받을 수 있을거라고 예상했던 값들이 들어있지 않았다. ![401에러](https://velog.velcdn.com/image

2023년 1월 16일
·
0개의 댓글
·
post-thumbnail

axios.create

axios를 알아갈 수록 아직도 모르는게 너무 많다🥲 최근 headers에 같은 값을 넘겨주어야하는 상황이 생겼는데 매번 적어주기엔 너무 귀찮더라,,, (나 벌써 개발자 마인드인건가🧐) graphql에서는 컴포넌트로 뺐던 기억이 나서 axios도 분명이 있겠구나 싶어서 공부해봤다! ✏️ 기존의 코드 headers에 accessToken의 값을 받아와서 Authorization부분에 넣어주어야하는데 post 요청을 보내는 함수 마다 headers에 accessToken의 값을 받아와서 Authorization에 넣어주어야한다면 너무나 비효율적인 코드가 될것이다 그래서 axios를 분리하여 사용할 수 있는 것이 axios.create이다 ✏️ axios.create 이렇게 만들어주면 요청할때마다 accssToken값을 넣어주지 않아도 instance 컴포넌트를 불러와서 사용하면 토큰값을 넘겨줄 수 있다 baseUrl도 적어주기 때문에 post 요청

2022년 12월 6일
·
0개의 댓글
·
post-thumbnail

BE_Simple API Server_HTTP_10.26

참조 원문 0. 학습 목표 API 정의 HTTP의 Stateless 특징과 Request/Response message 구조 Instagram의 Backend API System의 기능을 정의 Node에서 제공하는 http built-in module을 활용해 간단한 API server 만들기 Node.js runtime으로 구현한 API 코드 실행. API server에 회원가입, 회원 정보 조회, 게시물 등록과 같은 기능을 수행하는 Endpoint 추가. > 요약 HTTP: 컴퓨터 사이의 소통을 위한 통신규약. HTTP 통신: Request(요청) + Response(응답). Stateless 특성: HTTP 통신의 매 요청과 응답은 이전 상태를 알지 못함. 1. HTTP (HyperText Transfer Prot

2022년 10월 26일
·
0개의 댓글
·
post-thumbnail

HTTP/네트워크 기초(2)

1. HTTP Messages 1.1. HTTP messages HTTP는 HyperText Transfer Protocol의 줄임말로, HTML과 같은 문서를 전송하기 위한 Application Layer 프로토콜이다. HTTP는 웹 브라우저와 웹 서버의 소통을 위해 디자인 되었다. 클라이언트가 HTTP messages 양식에 맞춰 요청을 보내면, 서버도 HTTP message 양식에 맞춰 응답함. HTTP는 특정 상태를 유지하지 않는 특징이 있음. (무상태성) 요청(Requests), 응답(Responses)이 있다. 1.2. 요청(Requests) 1.2.1. Start line HTTP 요청은 클라이언트가 서버에 보내는 메세지 입니다. 3가지 요소가 있다 수행할 작업(GET, PUT, POST)이나 방식(HEAD or OPTIONS)을 설명하는 HTTP method는 데이터를 서버로 전송 요청

2022년 8월 18일
·
0개의 댓글
·
post-thumbnail

HTTP, 그리고 Request & Response

1. HTTP (HyperText Transfer Protocol) ✅ HyperText HTTP에서 HyperText는 HTML(HyperText Markup Language)의 HyperText와 그 의미가 동일하다. HTML은 문서와 문서가 링크로 연결되도록 하는 태그로 구성된 언어란 뜻이다. 다시 말하면, HTML은 웹페이지를 만들기 위해서 웹브라우저 위에서 동작하는 언어를 뜻한다. ✅ Transfer Transfer은 사전적 의미로 "전송하다"이다. 전송에 큰 의미가 있다. 쉬운말로 "물건이나 편지 따위를 보낸다." 라는 의미다. 개발자가 로컬호스트(본인의 랩탑 또는 데스크탑)에서 작성한 HTML 파일을 로컬에서만 띄운다는 건 무엇을 의미할까. 예를들어 작성된 편지가 대상(부모님, 선생님, 연인 등..)을 갖고 있다면 그 대상에게 보내져야 의미가 있다. 편지를 보내지 않으면 응답이 오지 못한다. 의도 했던

2022년 7월 27일
·
0개의 댓글
·

controller - req, res, MediaType

Controller controller는 (Http)요청을 처리하고 응답을 리턴 Request GET요청은 body가 없음 요청에 포함된 데이터 받기 URL의 Path로 @PathVariable URL의 Query String @RequestParam Request Body의 데이터(주로 json) @RequestBody Request Headers의 데이터 Response headers로 데이터 보내기 body html 문자열 JSON 문자열 이미지 empty HttpServletRequest 사용자 요청 controller에서 Ht

2022년 4월 23일
·
0개의 댓글
·
post-thumbnail

24일) useQuery로 바로 안불러오고 useApolloClient로 axios처럼 원하는 위치에서 data 불러올래요! YUP! react HOOK! code camp FE 6기

흐름을 잘 이해하기위해 수업끝나고 그려본 코드의 숲(?)이 오늘의 썸넬..! 오늘 수업이 끝나면 알게될 것들 ! _**오늘은 여러가지 쿼리방식을 배웠습니다! 그 중, 컴포넌트가 열리면 실행되는 useQuery와 달리 원하는 시점에 실행 해줄 수 있는 useLazyQuery와 axios처럼 원하는 위치에서 받을 수 있게 도와주고 결과 값을 내가 원하는 상자에 담아줄 수 있는 useApolloClient를 알아봤죠! 위 특징으로 본다면 useLazyQuery는 useQuery와, useApolloClient는 axios와 닮았었습니다! 우리는 원하는 시점에 query요청을 보낼 수 있는 useApolloClient의 특징을 활용하여 fetchUserLoggedIn 결과값(UserInfo)을 GlobalState에 담아주는 실습을 진행했죠! 이를 위해서 우리는 onClickLogin 안에서 client.query({})로 요청을 보냈습니다! 여기서 중요한 포인트가 있었죠! 어느

2022년 4월 14일
·
0개의 댓글
·
post-thumbnail

HTTP Messages

HTTP Messages HTTP 즉, HyperText Transfer Protocol의 줄임말로, HTML과 같은 문서를 전송하기 위한 Application Layer 프로토콜이다. HTTP는 웹 브라우저와 웹 서버의 소통을 위해 디자인되었다. 전통적인 클라이언트-서버 모델에서 클라이언트가 HTTP messages 양식에 맞춰 요청(Requests)을 보내면, 서버도 HTTP messages 양식에 맞춰 응답(Responses)한다. ![](https://images.velog.io/images/hyo123/post/912d27de-d86b-45ac-abf3-597c0a8e97fb/%E1%84%89%E1%85%B3%E1%84%8F%E1%85%B3%E1%84%85%E1%85%B5%E1%86%AB%E1%84%89%E1%85%A3%E1%86%BA%202022-03-23%20%E1%84%8B%E1%85%A9%E1%84%8C%E1%85%A5

2022년 3월 22일
·
0개의 댓글
·
post-thumbnail

HTTP 헤더

📓 HTTP 헤더 HTTP 헤더에는 크게 약속된 표준 데이터을 넣거나 서버와 클라이언트간에 데이터를 위한 커스텀 데이터를 명시할 수 있다. HTTP 헤더 분류 약속된 표준 데이터 커스텀 데이터 🤝 HTTP 헤더 표준 - 약속된 표준 데이터 표준으로 명시된 헤더를 사용할 때는 정해진 규격의 키, 밸류를 사용해야한다. 그래야지 정상적으로 동작한다. 표준 헤더의 예시로는 아래와 같은것들이 있다. 인증 : Authorization 캐싱 : Cache-Control 쿠키 : Set-Cookie, Cookie CORS 웹소켓 기타 등등 > HTTP 헤더의 표준 데이터는 무엇이 있는지 궁금한다면! > [MDN HTT

2022년 1월 15일
·
0개의 댓글
·
post-thumbnail

드디어 난 깨달은것인가 -2-

WeCode 7기로 수업을 받고있는 슈퍼개발자, 춤추는망고입니다. ( 춤 안춥니다. ) 
 
 > #### - 이 글은 우리가 앞으로 할 일에 큰 도움이 될 글입니다. ( 큰 도움 == 큰 어려움 ) 
 
 
 
 인터넷의 역사와 인터넷 세상의 흐름을 어느정도 이해하고, 이제는 인터넷을 더 잘 이용하기 위해 이번글에서 여러분과 함께 공유할 내용은! 
 
 내가 누군가와 통신을 하기위해선? 통신의 구성과 활용 ( 심화 ) 입니다. 
 
 이번 글에선, > 통신방식에 대한 기초지식을 가지게된 뉴비가 ' 그럼 어떤식으로 써야하는거죠? ' 라는 질문을 받게되어 헉쓰! 하고 주저앉을때, 일으켜 세워줄 아주 좋은 내용을 소개합니다. 
 
&#1

2020년 4월 10일
·
0개의 댓글
·

SpringBoot에서 CORS할 때 header, preflight 이슈 해결하기

1. CORS 이슈 및 해결 스터디 프로젝트에서 화면(client)은 React로, 서버(server)는 Spring Boot으로 개발하고 있다. 다양한 이슈로 인해 화면 단 서버를 Node로 띄우고 있다. 따라서 CORS(Cross-Origin Resource Sharing, CORS) 이슈가 발생하여 Spring Boot에 다음과 같은 처리를 하였다. Java 코드 ` 2-1. CORS response header 이슈 하지만 JWT(JSON Web Token)을 적용하는 과정에서 서버 단에서 response header에 값을 설정하고, 화면 단에서 읽는 과정에서 값을 읽지 못하는 현상(null 값으로 반환됨)이 발생하였다. Java 코드 JavaScript 코드 2-2. CORS response header 이슈 해결 방법 구글링을 해보니 CO

2020년 3월 8일
·
2개의 댓글
·