전체 글

이미지를 다운로드 해야하는 기능을 구현하다가 나온이슈가 있어서 정리해 봅니다. 이미지 다운로드 구현 방법 1. a태그에 href, download 속성을 사용하여 구현합니다. 정말 간단!!! 그렇지만!! 변수가 있다는 점 - 같은 출처에 있는 이미지가 아니면 작동하지 않는다. - ie에서는 작동하지 않는다. 사실 이번작업에 같은출처 이미지가 아니라 a태그를 사용할수는 없었습니다. 2. XMLHttpRequest를 사용하여 직접 blob 을 얻어와 처리 이 방법으로 하면 교차출처 이미지도 가능하고, ie도 가능하다는 점 입니다! function downloadImg(url, fileName) { var xhr = new XMLHttpRequest(); xhr.open('GET', url, true); xh..

이번에 작업을 하면서 CORS 오류를 제대로 경험했다!! 정말 힘든 시간이었던 이번 작업 기능 개발보다 CORS오류를 해결하는 시간이 더 오래 걸렸다... 다음에는 당황하지 않기 위해 CORS에 대해 정리하는 시간을 가지려고 한다! CORS는 무엇인가? CORS(Cross-Origin Resource Sharing)는 교차 출처 리소스 공유라고 한다. HTTP 헤더를 사용해서 다른 출처에 접근할 수 있는 권한을 부여하도록 브라우저에 알려주는 체제라고 한다. 언제 CORS현상이 나올까 호스트, 프로토콜, 포드가 다른 경우에 CORS현상이 발생된다. https://shopping.naver.com:80/home/p/index?sort=asc&page=2#tab2 프로토콜 호스트 포트번호 패스 쿼리스트링 프래..

부정 가상선택자 :not은 익스를 지원하지 않는다. 사용법 p:not(.box) { color: red; } // box클래스를 제외 한 p태그 선택 body :not(p) { color: red; } // body안에 p태그를 제외한 태그 선택

Promise란?프로미스는 자바스크립트 비동기처리에 사용되는 객체입니다.자바스크립트는 동기식 언어로 한번에 한작업만 실행을 하게 되는데 비동기처리를 하면특정코드의 실행이 완료될때까지 기다리지 않고 다음코드를 먼저 수행하게된다. Promise가 필요한 이유?- callback 지옥에서 벗어날 수 있다.function c(callback) { setTimeout(() => { callback(); }, 1000)};c(() => {console.log('callback')}) //1초 뒤 console 출력// 콜백지옥c(() => { c(() => { c(() => { console.log('callback') //3초 뒤 console 출력 }) }) })- 데이터를 받아온 ..