Silver Library (Archived)

핵심 요소. CORS policy, fetch, JavaScript, mutation 예시 코드. fetch('https://cors-anywhere.herokuapp.com/' + fileURL, { method: 'GET', headers: { 'Content-Type': 'application/pdf', }, }) .then((response) => response.blob()) .then((blob) => { // Create blob link to download const url = window.URL.createObjectURL( new Blob([blob]), ); const link = document.createElement('a'); link.href = url; link.setAtt..

사실, 이 cors policy 에 대한 구성은 이전 글에서 다뤘었습니다. 당시 content-type 저건 언제 쓸까 하며 알아 보던 중, 알게 된 문제점입니다. [react] 요즘 fetch Auth 구성에 대한 고찰. 코드를 계속 보다보니 느껴진 게, 대체 저건 뭘까? 였습니다. 언제부턴가 TS 와 비슷해지려는 느낌이 보이는 JS 코드들이 보이는데, 역시 2018년을 기점으로 권고안이 달라진 것을 볼 수가 있었습 silverlibrary.tistory.com 왜 표시 되나요? CORS policy 를 위반해서 브라우저가 막고 있어서 그렇습니다. 보안 때문에 이러나요? 네, 그리 보입니다. 자세한 것은 아래를 참고해주세요. 이걸 비유한다면, 윈도우의 UAC 와 유사하다고 보여집니다. "추가 HTTP ..

코드를 계속 보다보니 느껴진 게, 대체 저건 뭘까? 였습니다. 언제부턴가 TS 와 비슷해지려는 느낌이 보이는 JS 코드들이 보이는데, 역시 2018년을 기점으로 권고안이 달라진 것을 볼 수가 있었습니다 (미국 내 쿠키정책). 그리고 이것의 정체가 바로 CORS policy 인데요. 이에 대해 지속적으로 알아보고자 합니다. 아래는 client 측을 기준으로 재구성 한 예시 코드입니다. const loginButtonAsKim = document.getElementById("loginAuthKim") const loginButtonAsRaynor = document.getElementById("loginAuthRaynor") const adminButton = document.getElementById("a..

리엑트에서나 JS에서나, 방아쇠 역활을 하는 뭔가를 구성할 때가 되면: onChange={(e) => { setWhatever(e.target.value);}} 를 사용하죠. 독학으로 하는 분들이라면 아마 이런 생각을 하셨을 가능성이 있습니다. 저 e 가 event 를 의미하는 것 까지는 알겠는데, 저 target.value 같은 method 는 어느 JS 문법일까? 같이 말이죠. 하지만 방향은 근접했습니다. 그럼 어떻게 할까요? 우리에게는 console.log 가 있습니다. 그리고 짐작 하셨다시피, 이건 mutation 의 일종입니다. 한번 흐름을 타고 가보도록 하죠. #1. console.log(e) 라고 해보세요. 이걸 이해하려면, 우선 위와 같은 코드가 적용된 코드 파일 스크립트 내에서 onCha..