서버랑 HTTP에 대해 심화적으로 배웠다.
스프린트때는 서버연결이 되었다가 안됬다가를 계속 반복해서 정말 화났다.
그런데 늘 문제는 코드의 미묘한 문제에 있었다..!
역시 집단지성의 힘으로 문제를 알 수 있었고, 실험을 해봄으로써 그 원리를 이해할 수 있었다.
오늘의 교훈 : 코드를 세심하게 분석하고 이해해보자..!
CORS 에러 해결법(npx serve client 실행시켰다고 가정했을때)
1. 포트를 5000번이 아닌 번호로 바꾼다.
2. 'Access-Control-Allow-Origin': '*'을 http://localhost:5000
로 바꾼다.(그러면 포트가 5000만 허용하게됨)
3. post부분의 fetch의 안에 들어가는 주소의 포트를 설정한 포트번호로 바꾼다.
4. App.js 파일에서 Content-Type을 text/plain으로 하게되면 preflight request가 발생하지 않는다.(preflight request를 하는 조건에 들어가지 않고 simple request 조건에 들어가서)
5. 그렇기 때문에 Content-Type을 application/json으로 설정한다.
6. 크롬탭을 하나 띄어서 http://localhost:5000
접속하여 실험해보셈
7. index.html 브라우저에서 열어서 똑같이 실행해보셈
8. 그렇게 되면 index.html은 실행이 안되게 된다. (index.html은 포트를 5000번이 아닌 번호로 지정했기 때문에 막힘)