Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Settings : CORS 에러 회피 세팅 #91

Merged
merged 1 commit into from
Jan 3, 2024

Conversation

kkkapuq
Copy link
Collaborator

@kkkapuq kkkapuq commented Jan 2, 2024

개요

로컬 및 vercel 도메인에 대한 CORS 예외처리를 진행했습니다. (프론트 테스트 확인 완료)

closed #90

PR 유형

어떤 변경 사항이 있나요?

  • 새로운 기능 추가
  • 버그 수정
  • CSS 등 사용자 UI 디자인 변경
  • 코드에 영향을 주지 않는 변경사항(오타 수정, 탭 사이즈 변경, 변수명 변경)
  • 코드 리팩토링
  • 주석 추가 및 수정
  • 문서 수정
  • 테스트 추가, 테스트 리팩토링
  • 빌드 부분 혹은 패키지 매니저 수정
  • 파일 혹은 폴더명 수정
  • 파일 혹은 폴더 삭제
  • 배포 및 PR 관련

PR Checklist

PR이 다음 요구 사항을 충족하는지 확인하세요.

  • 커밋 메시지 컨벤션에 맞게 작성했습니다. Commit message convention 참고.
  • 변경 사항에 대한 테스트를 했습니다.(버그 수정/기능에 대한 테스트).

- 로컬 및 vercel CORS 예외 세팅
@kkkapuq kkkapuq added ⚙️Settings 프로젝트 환경 및 실행환경 설정 💻 BE 백엔드 labels Jan 2, 2024
@kkkapuq kkkapuq self-assigned this Jan 2, 2024
Copy link
Collaborator

@GBGreenBravo GBGreenBravo left a comment

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

세팅은 언제나 옳습니다~
수고 많으셨슴다!!

config.setAllowedHeaders(Collections.singletonList("*"));
config.setAllowedMethods(Collections.singletonList("*"));
config.setAllowedOriginPatterns(Arrays.asList("http://localhost:3000", "https://f1-orury-client.vercel.app/")); // 허용할 origin
config.setAllowCredentials(true);
Copy link
Collaborator

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

정확히 적용되는 내용은 아니지만 추후에 Security관련 filter를 덧붙일 때 적용될 것 같아 미리 남깁니다!
아래 링크에 따르면, setAllowCredentials(true)로 설정하면 Authentication Filter 인증보다 앞에서 작동해야 하는 것 같습니다.
그리고 다음 Security 작업 시, SecurityConfig가 너무 헤비해진다고 생각되면, CorsConfig를 따로 빼는 것도 고려할 사항일 듯 합니다!
https://velog.io/@minnseong/CORS-with-Spring-MVC-Security

Copy link
Collaborator

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

cors.disable()이랑 비슷한 개념인건가요?

Copy link
Member

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

CORS 설정이 프론트에서 API 요청을 보내기 위해 하는 것으로 이해했는데, 이 경우에는 프론트에서 백엔드 서버에 API 요청을 보내기 위해 설정한 것으로 이해하면 될까요? 프론트에서 카카오맵 등을 사용할 때에도 카카오에 API 요청을 하는 것으로 알고 있어 정확히 어디에 요청을 보내기 위해 설정했는지 궁금합니다 !

Copy link
Collaborator

@GBGreenBravo GBGreenBravo Jan 3, 2024

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

프론트에서 백에게 요청할 때, 각기 다른 서버로 배포해놨기 때문에 SOP 이슈가 있었던 듯 합니다.
그래서 희태님께서 요청해주셔서 형준님께서 반영하신 부분입니다!

추가로, 프론트에서 카카오맵으로 api 요청을 보내는 것에 대한 CORS 처리는 카카오측의 설정에 따라 이용할 수 있지, 저희가 할 수 있는 바는 없는 걸로 알고 있습니다!ㅎㅎ

Copy link
Collaborator Author

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

cors.disable()이랑 비슷한 개념인건가요?

cors disable은 아예 동작하지 않게 하는거고, 별도의 configurer를 둬서 해당 origin만 cors 허용되도록 수정했습니다.
아예 그냥 꺼버릴까요?

@corazzon
Copy link
Contributor

corazzon commented Jan 2, 2024

수고 많으셨습니다. 새해 복 많이 받으세요 :)

@kkkapuq kkkapuq merged commit d6c0151 into Kernel360:develop Jan 3, 2024
1 check passed
@kkkapuq kkkapuq deleted the feature/#90_setting_cors branch January 3, 2024 03:07
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
💻 BE 백엔드 ⚙️Settings 프로젝트 환경 및 실행환경 설정
Projects
None yet
Development

Successfully merging this pull request may close these issues.

CORS 에러 회피 세팅
5 participants