상황 분석

1. 로컬에서 React를 3000번 포트로, Flask를 5000번 포트로 동시에 구동중

2. React -> Flask 서버로 API 호출시도

3. 콘솔에서는 CORS 에러, Flask에 요청 들어가지 않음.

 

개발 환경

- PC : M2 Pro Macbook Pro

- Pycharm, Python3.9, Flask

- Webstorm, TypeScript5.1.3, React

 

해결 시도

1. flask에서 flask_cors의 CORS를 통한 설정

 

2. React의 package-json 내부에 proxy 설정 (시도 후 제거)

 

3. React의 Axios withCredentials 설정 (최종)

 

사실 정상적인 상태라면, 로컬에서 두 서버를 동시에 구동중이며, flask및 React에서 CORS와 Credentails를 모두 허용 하기에 정상 작동이 되어야 한다. 그럼에도 오류 발생하여 react와 flask 각각의 포트와 구성 확인 중 flask에서 자체적으로 403을 반환하는 것을 확인

 

원인 및 해결 방법 (결론)

결론적으로는, 맥북의 AirPlay 기능이 문제였다..........

Airplay의 데이터 수신이 5,000 Port를 쓰고 있기에 에러가 발생하는 것이었다.

즉 React의 localhost:5000 요청이 내 flask 서버로 가기 전에 AirPlay에서 거부를 맡고 flask는 엥?? 머임? 뭔 일 있음? 하고 있었던 것.

해결 방법 -> AirPlay 수신 모드를 끄거나, Flask의 포트를 5001 등 편한 포트로 변경 (미사용 포트)

airplay.. 너가 문제라니..

 

포트 변경 후 정상 작동하는 모습

 

Apple developer Program (애플 개발자 등록) 도중 등록을 완료할 수 없다는 창이 떴다.

조치 방법이나 어떠한 내용도 적혀있지 않은 불친절한 안내 문구

애플 고객센터에 해당 내용과 스크린샷을 포함하여 문의를 보냈으나..

 

무슨 말장난하는건지..

결국 이런 저런 시도 끝에 해결했다.

인과관계가 확실치 않으나, 일단 내 경우의 해결 방법을 공유하고자 한다.

 

1. Apple Safari 브라우저 + 시크릿 모드 접속

2. 약관 스크롤 끝까지 다 내려 읽기

 

 

<Env>

Java17-Correto, Gradle, IntelliJ, JSP

JSP에서 useBean으로 src/main/java/user 내에 User 클래스 접근시 Cannot resolve class or package 오류 발생

 

<해결 방법>

1. Project Structure 진입

2. Project Settings -> Modules 진입 후 내 프로젝트 클릭 (여기선 SCH-webproj-2023)

3. 오른쪽 Module SDK 아래 + 버튼 클릭

4. 3.Module Dependency.. 클릭 후 [프로젝트명].main 의존성 추가

5. 해결

+ Recent posts