본문 바로가기

Web5

CORS/CSR/SSR CORS(Cross-Origin Resource Sharing) 브라우저에서는 보안적인 이유로 cross-origin HTTP요청을 제한합니다. 만약 cross-origin 요청을 하려면 서버의 동의가 필요하고, 서버가 동의할 경우 브라우저에서는 승인을, 동의하지 않는다면 브라우저에서 거절을 반환합니다. 이러한 허락을 구하고 거절하는 메커니즘은 HTTP-header를 이용해서 가능하며, 이를 CORS(Cross-Origin Resource Sharing)라고 부릅니다. 이러한 관문과 같은 역할을 하기에 cross-origin 요청을 보다 안전하게 할 수 있습니다. *cross-origin 1. 프로토콜 (http, https) 2. 도메인 3. 포트번호 CSR(Client Side Rendering) 클.. 2022. 9. 20.
DOM DOM(Document Object Model) : 문서 객체 모델로 XML이나 HTML 문서에 접근하기 위한 일종의 인터페이스 입니다. 이 객체 모델은 문서 내의 모든 요소를 정의하고, 각각의 요소에 접근하는 방법을 제공합니다. 이러한 DOM은 표준 객체 모델이며 다음과 같은 계층 구조로 표현됩니다. 또한 이런 객체 모델을 이용하여 새로운 HTML요소 또는 속성을 추가, 제거 HTML 문서의 모든 HTML요소, 속성 변경,CSS 스타일 변경 HTML 문서에 새로운 HTML 이벤트 추가, 모든 이벤트의 반응 등이 가능합니다. Javascript DOM 할일 저장 안내메시지 CSS * { margin: 0; padding: 0; } .header { background: #3b5999; color: #ff.. 2022. 7. 29.
REST API REST API Representational State Transfer API REST API❓ REST API란 REST를 기반으로 만들어진 API를 의미합니다. 이때 REST란 Representational State Transfer의 약자로 자원을 이름으로 구분하여 해당 자원의 상태를 주고받은 모든 것을 의미하게 됩니다 💡REST REST의 구성 자원 - HTTP URI를 통해 자원을 명시 행위 - HTTP METHOD 즉 웹에서 사용하는 CRUD 표현 - 자원에 대한 행위의 내용 REST의 구성 Server - Client 구조 REST서버는 API를 제공하고, 클라이언트는 사용자인증 및 컨텍스트 등을 직접 관리하는 구조로 각각의 역할이 확실하게 구분되어 상호 의존성이 줄어들게 되는 구조 Lay.. 2022. 7. 28.
API API : Application Programming Interface 한 프로그램에서 다른 프로그램으로 데이터를 주고받기 위한 방법 간단한 예시를 들어보자면 식당의 메뉴판이라고 볼 수 있습니다. 즉, 식당과 손님이 음식을 주고받기 위한 방법이라고 볼 수 있기 때문입니다. 앞서 API는 한 프로그램에서 다른 프로그램으로 데이터를 주고받기 위한 방법 이라고 설명 했습니다. 그럼 이 방법은 무엇일까요? 바로 '코드'입니다 간단하게 보자면 특정 url로 get을 요청하면 특정 코드를 실행해주세요 라는 문장에서 특정 url로 get을 요청한다면에 해당하는 코드가 API라고 볼 수 있습니다. 실제 네이버가 만들어둔 웹툰 API 예시를 보자면 (GET 요청) comic. naver.com/webtoon/detail.. 2022. 7. 20.