목록2022/12 (28)
Silver Library (Archived)
사실, 이 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..
필자가 초창기에 REST API 를 이용해서 프로젝트 내부에 GET 을 구성할 때 가장 난감했던게 있었습니다. '보면 이해가는데, 대체 어떻게 했길래 저렇게 해 낸걸까?' 예를 들면 아래의 react 코드가 있습니다. const getData = async () => { const res = await fetch( `https://api.jikan.moe/v4/anime?q=${search}&sfw&limit=6` ); const resData = await res.json(); setAnimeData(resData.data); }; useEffect(() => { getData(); }, [search]); 참고로 이 getAnimeSearch 의 경우, 그냥 홈페이지 내에서 소개하는 GET 부분의 표..