- 학습 관련 질문을 남겨주세요. 상세히 작성하면 더 좋아요! - 먼저 유사한 질문이 있었는지 검색해보세요. - 서로 예의를 지키며 존중하는 문화를 만들어가요. - 잠깐! 인프런 서비스 운영 관련 문의는 1:1 문의하기를 이용해주세요.   뭐 때문에 자꾸 CORS 에러가 뜨는건지 모르겠네요ㅠㅠ 아무리봐도 똑같이 친거같은데.. 한번 봐주실 수 있으실까요?    

안녕하세요 강사님 해당 강의를 통해서 엄청난 꺠달음과 영감을 얻게되어 감사하다는 말씀을 먼저 올리고싶습니다. 제가 해당 강의를 통해서 성장을 하여 감히 마이크로서비스를 이용해서 프로젝트를 진행하고 있습니다. 하지만 프로젝트를 진행하다 보니 몇일 동안 해결할 수 없는 문제와 마주하게 되어 이렇게 문의 드립니다. 우선 Spring Cloud Gateway 가 존재하고 User-Service 가 그 뒤에 위치해 있습니다. User-Service 에서는 사용자가 로그인을 한다면 access_token 과 refresh_token 을 쿠키에 담아서 반환합니다. 그리고 로그아웃을 한다면 access_token 과 refresh_token 의 쿠키 값에 null 을 넣고 expires 를 과거로 만들어 만료되도록 합니다. Front 에서는 로그인을 수행하면 access_token 과 refresh_token 을 잘 받아서 브라우저에 저장하는 것을 확인하였습니다. 로그아웃을 수행한다면 응답으로 set-cookie 를 잘 받아오는 것도 확인을 하였습니다. - access_token=; expires= 1960 00:00:00 ... httpOnly; - refresh_token=; expires= 1960 00:00:00... httpOnly; 하지만 실제 브라우저에서는 쿠키가 지워지지 않더라구요.. axios의 credential 과 gateway 에서의 cors filter 도 설정을 잘 하였습니다. 실제 프로젝트 소스는 아래에 있습니다. - User-Service :: https://github.com/dhslrl321/PCUSS-User-Service - Gateway Service :: https://github.com/dhslrl321/PCUSS-Gateway-Server - Front 비동기 통신 코드 :: https://github.com/dhslrl321/PCUSS-Official-Site/blob/master/client/services/authService.js - Front axios 모듈 :: https://github.com/dhslrl321/PCUSS-Official-Site/blob/master/client/utils/api.js

강의에선 app에 cors 미들웨어를 붙여서 /user에 post하는 경우도 한번에 해결되었는데, 제가 개인적으로 연습할 때는 app이 아닌 요청의 대상이 되는 router 각각에 use(cors())를 붙여줘야 정상적으로 작동하더구요.proxy로 시도해보아도 app에 직접하는 것은 안되던데 이유가 뭔지 알 수 있을까요? 

POST 요청 시에는 req.user로 유저 데이터가 잘 받아지는데 GET 요청시에 계속 req.user 정보가 undefined로 뜨네요.. front/sagas/index.js back/app.js 위와같이 credentials도 true로 바꿔 줬는데도 GET에서 user 정보를 받을 수가 없습니다. 다른 설정 문제일까요?

안녕하세요! 좋은 강의 해주셔서 감사드립니다! 다름이아니라 리액트+스프링부트+스프링시큐리티 환경에서 로그인api 연동중에 CORS 이슈가 발생하여 구글링을 계속하였지만 결국 문제점을 해결하지 못하였습니다.. 죄송스럽지만 이렇게 질문 요청드립니다!! 질문요청드릴 내용은 스프링 시큐리티에서 CORS 설정 부분입니다. 우선 제가 적용한 코드는 아래와 같습니다! @Configuration @EnableWebSecurity public class SecurityConfig extends WebSecurityConfigurerAdapter { @Bean public CorsConfigurationSource corsConfigurationSource(){ CorsConfiguration configuration = new CorsConfiguration(); configuration.addAllowedOriginPattern("*"); configuration.setAllowedMethods(Arrays.asList("*")); configuration.setAllowedHeaders(Arrays.asList("*")); configuration.setAllowCredentials(true); UrlBasedCorsConfigurationSource source = new UrlBasedCorsConfigurationSource(); source.registerCorsConfiguration("/**", configuration); return source; } @Override protected void configure(HttpSecurity http) throws Exception { http .csrf().disable() .cors().and() .authorizeRequests() .antMatchers("/","/api/register","/api/login","/h2-console/**","/api/email","/api/verify","/api/matching/**").permitAll(); http.addFilterBefore(loginProcessingFilter(), UsernamePasswordAuthenticationFilter.class); //ajax 인증방식 사용 http.headers().frameOptions().disable(); //h2 console 접근 } } 이후 talend API Tester를 이용해서 api 테스트를 해본 결과 GET방식에는 문제가 없었으나 POST방식에서 403 에러 가 발생하였고 확인해본결과 preflight 요청에 대한 응답을 보내지못하는 문제로 판단되었습니다. 문제점을 해결하기 위해 configure 메소드에 아래와 같이 preflight 요청을 허가하는 코드를 작성 해보았지만 결과는 동일 하였으며 http.authorizeRequests() .requestMatchers(CorsUtils::isPreFlightRequest).permitAll( 스프링부트에서 configuration.allowCredentials(true) 와 configuration.allowedOrigins("*") 는 동시에 설정 못하도록 하였다고 해서 configuration.allowCredentials(true) 대신 .allowedOriginPatterns("*") 으로 변경해보았지만 역시 결과는 동일했습니다. 추가로 fliter의 순서가 문제인것같아 Filter를 상속받는 CORSFilter를 만들어서 적용해보았지만 결과는 동일 하였습니다. (해당부분은 https://sas-study.tistory.com/298 이 블로그를 참조했습니다.) 현재 어느 부분에서 해결점을 찾아야 할지 갈피를 못집고 있는 상황이라 이렇게 질문 요청드립니다..ㅜㅜ 답변해주시면 정말 감사드리겠습니다!

CORS error를 피하기 위한 방법으로  devServer: { proxy: ".....", } 이렇게 프락시 서버를 설정해서 피했는데, 근데 이것은 Development 모드 일때만 적용되는 된다고 생각합니다. 실제 Production에서는 dist 만 배포될텐데 Production 에서는 어떤 해결방법이 있나여???

안녕하세요! 지금 강의 따라가면서 axios 사용법을 익히는 중입니다~ 다른 서버에서 돌아가고 있는 php 파일을 axios로 불러오고 싶은데 cors 정책에 걸려서 다음으로 나갈 수가 없어서요..! 서로 다른 서버에서의 axios 사용은 어떻게 하는게 좋을까요?

안녕하세요! 강의에서 알려주신대로 프론트-백엔드 서버 요청, 응답은 cors를 통해 해결했었는데요. 제 백엔드 서버가 아닌 오픈 api를 테스트 해보려고 하다가 난관에 막혀 질문드립니다. 강의에서 서버와 서버의 통신에는 cors 문제가 안생긴다고 하여 브라우저에서 제 백엔드로 요청을 먼저 보내고 그 다음에 오픈 api로 요청을 보내는 방식으로 작업을 했는데요. 동작에는 문제가 없긴한데, 좀 느린것 같기도하고... 문제가 생길까 염려되어 질문드립니다.  또한 문제가 있다면 좋은 방법은 무엇일까요? ㅠㅠ 일단 동작하기 위해 아래와 같이 처리했습니다.. + 추가로 기존 글이 있나 찾아보고 질문을 추가합니다!! https://www.inflearn.com/questions/81377 위에 제가 진행한 방식과 프론트에 proxy서버를 따로 띄워(?) 작업하는 방식이 사용하는 상황이 다를 뿐 성능과는 차이가 없나요? (백엔드 서버가 없을 경우 프론트에서 proxy를 사용하는건가요??)