Browser

비동기 작업 취소하기. "AbortController"

예전에 과제전형 테스트에서 "비동기 요청 *초 전까지 응답이 오지 않는다면, 요청 취소 후 재전송"이라는 요구사항이 있었는데 그 이후(시원하게 말아먹고 난 이후) AbortController의 존재에 대해서 알게 되었다. 👍👍 먼저 간단하게 비동기 요청시 사용되는 fetch API의 특징을 간단하게 알아보고, 포스팅의 주 대상 AbortController를 공부해보자. fetch : return Promise fetch API의 결과는 Promise이다. 응답이 오기 전 까지 pending(대기) 상태를 유지하게 되며, pending 상태가 끝나면 fullfilled 혹은 rejected로 바뀌게 된다. fetch 자체만으로는 pending을 취소하는 방법이 따로 존재하지 않으며, 여기서 pending ..

[CORS] 다른 출처간 CORS 에러 해결과 웹팩 개발 서버의 Proxy 설정

Why? 부스트캠프 멤버십에서 최종 프로젝트를 진행하면서 기술공유를 할 기회가 있었는데, 프로젝트를 ncloud 인스턴스에 배포하면서 겪은 문제를 정리한 글이다. 개발을 하면서 상당히 짜증나는 이슈인 CORS 에러를 해결하기 위해 학습하면서 웹팩 개발 서버의 proxy 옵션에 대해서 더 이해하였고, 설정하는 방법 등을 포함 해 정리하였다. CORS? 배포 환경 뿐 아니라 심지어 로컬 환경에서도 자주 보이는 녀석 아니 친구.. CORS. 일명 코스는 Cross Origin Resource Sharing의 약자이다. mdn에 의하면 CORS는 한 출처에서 실행 중인 웹 애플리케이션이 다른 출처의 선택한 자원에 접근할 수 있는 권한을 부여하도록 브라우저에 알려주는 체제이다. 웹 애플리케이션은 리소스가 자신의 ..

웹 크롤링과 웹 크롤러 봇

웹 크롤링 웹 사이트에 있는 데이터를 추출해서 사용하기 위한 목적으로 홈페이지 내용을 수집하고, 추출하는 것 특정한 규칙에 맞춰서 웹 페이지에 방문해서 내용에 포함된 데이터를 가져오는 것이다. 요약 : 사용자가 검색해서 결과로 나온 정보를 노트에 써놓는 것과 비슷한 행동을 프로그램이 반복해서 저장하도록 만드는 것 웹 크롤러 봇 스파이더, 검색 엔진 봇이라고도 한다. 인터넷에서 콘텐츠를 다운로드하고 색인을 생성하여 웹 페이지가 무엇에 대한 것인지를 파악하고, 필요할 때 정보를 추출하기 위해 존재한다. 검색 엔진은 웹 크롤러가 수집한 데이터에 검색 알고리즘을 적용한다. 예를 들어, 구글에서 검색 키워드를 입력하면 보여지는 결과는 이러한 방식으로 수집되어 보여지는 것! 웹 크롤러 봇은, 마치 도서관 사서와 비..