반응형 웹개발80 CORS란? 오늘은 CORS에 대해서 공부했다. CORS는 Cross Origin Resource Sharing의 줄임말로 교차 출처 리소스 공유라고 해석할 수 있으며 cross origin에서 리소스(서버 자원)를 요청하여 사용하는 것이다. 말이 조금 어렵지만.. 서로 다른 출처에서 서버에 자원을 요청하는 것이라고 해석하면 될 것 같다. 브라우저에서 크로스 도메인 요청은 기본적으로 제한되어있기 때문에 이것을 허용하기 위해서는 서버가 허용하는 범위 내애서 cross origin 요청을 허용해야 한다. const defaultCorsHeader = { 'Access-Control-Allow-Origin': '*', 'Access-Control-Allow-Methods': 'GET, POST, PUT, DELETE, O.. 2020. 11. 19. HTTP 오늘은 HTTP에 대해서 공부했다. HTTP는 Hyper Text Transfer Protocol의 약자로 서버와 클라이언트가 통신하는데 정해진 규약이라고 생각하면 된다. 작동방식은 항상 요청과 응답으로 이루어진다. 요청이 있으면 반드시 응답도 있어야 한다!!! 잘못된 요청이 들어와도 잘못된 요청이라 알려주는 응답이 돌아와야 한다. HTTP 요청과 응답은 기본적으로 Header와 Body를 가지는데 Header에는 다양한 정보들이 들어가 있다. (Body가 없는 경우도 많다. ) Request 맨 첫 줄에는 methods와 전송되는 url, 버전 등이 들어간다. - 요청(Request)의 Header Host : 요청이 전송되는 target의 host url Accept : 해당 요청이 받을 수 있는 응.. 2020. 11. 13. Promise와 fetch API (2) fetch API란 이전 글에 이어서 fetch API에 대해서 공부했다. fetch API는 특정 URL로부터 정보를 받아오는 역할을 해준다. fetch API를 통해 정보를 받아오게 되면 비동기로 이루어지기 때문에 다소 시간이 걸린다면 blocking이 발생하면 안되므로, 특정 DOM에 정보가 표시될 때까지 로딩 창을 대신 띄우는 경우도 많다. 간단한 예제를 통해 fetch API의 사용법을 알아보겠다. let url = 'https://apiURL'; fetch(url) .then(response => response.json()) // 자체적으로 json() 메소드가 있어, 응답을 JSON 형태로 변환시켜서 다음 Promise로 전달 .then(json => console.log(json)) // 콘솔에 json을 .. 2020. 11. 11. Promise와 fetch API (1) Promise란 오늘은 Promise와 fetch API에 대해서 공부했다. Promise는 자바스크립트에서 비동기 처리를 위한 하나의 패턴으로 콜백 패턴의 단점을 보완해준다. (콜백 패턴은 처리 순서를 보장하기 위해 중첩된 괄호를 적어야 하는데 이로 인해 복잡해지고 가독성도 안 좋을뿐더러 실수를 유발하기도 한다. 또한 에러 처리도 어려워 콜백 패턴의 한계를 느끼고 새롭게 Promise패턴을 도입하게 된 것이다.) 이제 Promise의 사용법을 알아보자. const getDataFromFilePromise = filePath => { return new Promise((resolve, reject) => { fs.readFile(filePath, 'utf-8', (err, data) => { if (err) { // 에.. 2020. 11. 11. 이전 1 ··· 6 7 8 9 10 11 12 ··· 20 다음 반응형