웹 개발을 하다보면 자주 CORS 에러를 만날 수 있습니다. 이번에야 말로 CORS가 무엇인지 확실히 알아보고 왜 있어야 하는지 알아봅시다. CORS가 나를 괴롭힌다 로컬에서 개발하고 있던 중 서버에 http 요청을 했을 때 위와 같은 에러를 보게 되었습니다. 'Access-Control-Allow-Origin' header is present on the requested resource. 요컨데 클라이언트의 주소는 localhost:5173인데 api요청 주소는 localhost:8080이기 때문에 origin이 다르다. Access-Control-Allow-Origin 헤더가 따로 설정되어 있지 않기 때문에 이 요청은 내가 막았다! 랍니다.. 기존 해결법 저는 제대로 이해도 안한채 그..

쿠키와 세션 자주 들었는데 이번 기회로 명확히 알아봅시다. 먼저 이 기술이 등장한 배경을 이해해야 합니다. HTTP 프로토콜은 stateless(무상태), connectionless(비연결지향) 특성을 가지고 있기 떄문에 클라이언트의 요청에 대해 어떤 클라이언트인지 식별할 수 없습니다. Stateless: 커넥션이 종료되는 순간 상태정보를 유지하지 않는 특성 Connectionless: 클라이언트가 요청을 보내고 서버의 응답을 주면 연결을 끊는다. 초기에는 클라이언트의 IP 주소를 이용하여 식별하려 했으나 몇개의 문제점이 존재했습니다. 여러 사용자가 한 대의 컴퓨터를 사용한다면 하나의 IP로 어떤 사용자인지 식별할 수 없다. 인터넷 서비스 제공자(ISP)는 사용자가 로그인하면 동적으로 IP 주소를 할당한..

프로젝트 설계 스프링에 관심이 좀 있었는데 토이 프로젝트를 하면서 사용해 보기로 했습니다. 기능 종류 도메인 uri method body response 투두목록 조회 Todo /todo GET {tags:Tag[], start:Date, end:Date} Todo[] 투두 추가 Todo /todo POST Todo Todo 투두 수정 Todo /todo/:id PATCH Todo Todo 투두 토글 Todo /todo/toggle:id PATCH null Todo 투두 삭제 Todo /todo/:id DELETE null null type Todo = { id: number; title: string; content: string; modifiedDate: Date; isConplete: Boolean..