[TIL]이노베이션 캠프 38일차

 

미니프로젝트 주차 9.2(금) ~ 9.8(목)

팀 프로젝트: 주제, Scope 자유, 프론트엔드와 첫 협업 프로젝트

 

진행 계획

- 2일(금) 기획, 와이어 프레임 작성, API 명세서 작성, ERD 작성, 와이어 프레임 작성, S.A.작성, 기능 역할 분담

- 3일(토) S.A. 서면 피드백 -> 피드백 결과 반영, ERD 관련 회의

- 4일(일) 기능 구현을 위한 개인 공부

- 5일(월) 팀 과제 코드 작성 프론트엔드와 연결 확인

- 6일(화) 팀 과제 코드 작성 CORS 관련 설정 및 공부

- 7일(수) 팀 과제 코드 작성 프론트엔드 서버와 연결

- 8일(목) 팀 과제 코드 최종 취합 및 AWS 배포

 

 

 

1. 개발 진행 상황

프론트엔드와 연결하여 작업하면서 프론트엔드에서 에러나는 부분 확인하고 수정

 

2. 개발 중 발생한 이슈와 해결

에러: Response to preflight request doesn't pass access control check: No 'Access-Control-Allow-Origin' header is present on the requested resource.

👉🏻  실행 전 요청에 대한 응답이 액세스 제어 확인을 통과하지 못했습니다. 요청된 리소스에 'Access-Control-Allow-Origin' 헤더가 없습니다.

 

원인: CORS 문제로 아래 코드를 추가해서 해결하였음

//            권한없이 (=토큰없이) 이용가능한 api설정
        .authorizeRequests()
        .antMatchers("/api/user/**").permitAll()
        .antMatchers("/api/post").permitAll()
        .antMatchers("/api/comment").permitAll()
        .antMatchers("/h2-console/**").permitAll() // h2-console 사용을 위해 추가
        .requestMatchers(CorsUtils::isPreFlightRequest).permitAll() // preflight 허용을 위해 추가
        .anyRequest().authenticated()

        .and()
        .apply(new JwtSecurityConfiguration(SECRET_KEY, tokenProvider, userDetailsService));

 

3. 오늘 한 일 / 회고

에러 잡기 바쁨.. 처음이랑 거의 비슷하다.

포스트맨에서는 테스트가 잘되니까 왜 에러가 발생하는 지 잘 모르겠고, 프론트에서 어떤 응답이 필요한건지 잘모르니까 문제 해결하는데 시간이 많이 걸린다.

 

 

4. TO-DO LIST

- 스프링 강의

- 에러 처리

 

 

5. 참고 레퍼런스

https://hodongman.github.io/2019/01/14/Database-PK%EB%A5%BC-%EC%82%AC%EC%9A%A9%ED%95%B4%EC%95%BC-%ED%95%98%EB%8A%94-%EC%9D%B4%EC%9C%A0.html

Table 작성 시 PK를 무조건 사용해야 하는 이유 - 기술 블로그

https://yeonyeon.tistory.com/236

[Spring] CORS 에러 해결하기

https://velog.io/@hellozin/Spring-API-%EC%84%9C%EB%B2%84%EC%97%90%EC%84%9C-PUT-DELETE-%EC%9A%94%EC%B2%AD-%EC%8B%9C-CORS-%EC%84%A4%EC%A0%95%EC%9D%B4-%EC%A0%81%EC%9A%A9-%EC%95%88%EB%90%98%EB%8A%94-%EA%B2%BD%EC%9A%B0

Spring API 서버에서 PUT, DELETE 요청 시 CORS 설정이 적용 안되는 경우

https://docs.spring.io/spring-framework/docs/4.2.x/spring-framework-reference/html/cors.html

26. CORS Support

https://developer.mozilla.org/ko/docs/Web/HTTP/CORS

교차 출처 리소스 공유 (CORS) - HTTP | MDN