본문 바로가기
블로그 이미지

방문해 주셔서 감사합니다! 항상 행복하세요!

  
   - 문의사항은 메일 또는 댓글로 언제든 연락주세요.
   - "해줘","답 내놔" 같은 질문은 답변드리지 않습니다.
   - 메일주소 : lts06069@naver.com


Javascript/[중요] Javascript

Firebase 파일다운로드 크로스 도메인(Cross-origin)

야근없는 행복한 삶을 위해 ~
by 마샤와 곰 2019. 4. 27.

 

 

파이어베이스 연동을 하다보면 파일 업로드는 뭐 상관없이 되는데..

파일 다운로드를 하는 경우에 데이터가 있는 곳을 url로 주기 때문에 일반 웹에서 접근하면 크로스 도메인에 걸리게 된다. 뭐..jsonp나 기타등등 방법을 사용해도 안된다.

아무튼, 이 현상을 해결하려면 검색에서 "Firebase 저장소 크로스도메인" 이런 내용으로 검색하면 해결 방법이 나온다.

대충 몇자 적어보면,

 

1. Cloud SDK 설치 프로그램을 다운로드

2. Google Cloud SDK shell 실행

3. gcloud components update로 업데이트를 수행 (옵션, 안해도된다.)

4. gsutil 명령어 실행

5. 변경할 프로젝트 선택

6. cors.json 파일 만들기

7. 변경할 버킷 url 가져와서 set 명령 실행

7단계 과정을 거치면 크로스 도메인이 허용되며 웹에서도 비동기 방식으로 데이터를 가져 올 수 있다.

Cloud SDK 설치(위 옵션에서 3,4번째거를 선택 안하면 좀 불편하다)

 

 

설치 완료 후 gsutil 명령어로 선택하고자 하는 프로젝트 선택

 

파이어 베이스 저장소에 가서 사진처럼 gs://주소 를 복사하여 준다.

 

 

콘솔창에 해당 내용을 입력하면 완료. 주석처리 된 부분이 저장소 이름이다.

 

* gsutil 명령이 실행되는 곳에 cors.json 파일이 있어야 한다.

* "gs://주소" 내용은 파이어베이스에 접속해서 Storage를 클릭하면 바로 볼 수 있다.

cors.json
0.00MB

 

 

* 차근차근 적용단계를 보고 싶다면 아래 주소에서 파이어 베이스 저장소 세팅법에 대해 살펴보자.

* 내용이 앵귤러이지만 저장소 세팅방법이 중간부터 나오는데..위 내용을 풀어쓴 글 이다.

https://lts0606.tistory.com/190

 

반응형
* 위 에니메이션은 Html의 캔버스(canvas)기반으로 동작하는 기능 입니다. Html 캔버스 튜토리얼 도 한번 살펴보세요~ :)
* 직접 만든 Html 캔버스 애니메이션 도 한번 살펴보세요~ :)

댓글