blocked by CORS policy: Response to preflight request doesn't pass access control check
강의를 보면서 firebase storage를 프로젝트에 셋팅하고,
이미지 등록을 테스트 해보려고 하니
위와 같은 CORS 에러가 났다.
404에러가 나고, 콘솔로그에 위와 같은 에러메세지가 떠있었다.
공식문서를 참고해 해결했다.
강의와 다른점이 꽤 있었다... ㅠ
아마 24년 10월 30일 파이어베이스가 유료로 바뀌고나서 바뀐건가 싶다...
Firebase Storage 유료로 변경!!
강의를 보면서 firebase storage 를 적용해보려고 했는데뭔가 정책도 바뀌고, 사용법도 바뀐 것 같다.강의 설명과는 달라서 참고용으로 글을 작성한다. 일단 24년 10월 30일 이후로 스토리지를 사용
dpdnjs402.tistory.com
CORS 에러를 해결해보자!!
storage를 선언해줄 때, 내 버킷 정보도 같이 작성해준다.
gs:// 이렇게 시작하는 부분이다.
그리고 Cloud Storage 버킷을 Firebase로 가져올 때, 파일에 액세스 할 수 있게 Firebase에 권한부여도 해줘야한다.
구글 콘솔에 들어가서 권한부여를 할 수 있다.
gsutil -m acl ch -r -u service-<project number>@gcp-sa-firebasestorage.iam.gserviceaccount.com gs://<your-cloud-storage-bucket>프로젝트 번호와 버킷정보를 콘솔에 입력해준다.
이렇게 하고나서 CORS에러가 사라졌다.
뭔가 하다가 잘 안될 때는 공식문서를 꼼꼼히 살펴보자!!
웹에서 Cloud Storage 시작하기 | Cloud Storage for Firebase
이 페이지는 Cloud Translation API를 통해 번역되었습니다. 의견 보내기 웹에서 Cloud Storage 시작하기 컬렉션을 사용해 정리하기 내 환경설정을 기준으로 콘텐츠를 저장하고 분류하세요. Cloud Storage for
firebase.google.com
'Frontend > React' 카테고리의 다른 글
| Firebase Storage 유료로 변경!! (0) | 2024.11.05 |
|---|---|
| 431에러를 해결하다! (1) | 2024.09.04 |
| react-router-dom 설치하기 (0) | 2024.07.28 |
| CRA 프로젝트 Setting 명령어 (0) | 2024.07.28 |
| tailwind custom color가 적용이 안될때 (0) | 2024.05.13 |