ujean

안녕하세요. 버킷 주소의 경우 firebase 콘솔에서 storage 메뉴를 클릭하여 들어갈 경우 자동으로 생성될텐데요. 해당 메뉴를 한번도 사용하지 않았다면 버킷 주소가 보이지 않았을거라 생각됩니다. 질문 주신 내용 확인해서 강의 영상에 반영해두겠습니다. 질문 주셔서 감사합니다.

비전공자가 7강 자체를 따라하는 방법

안녕하세요. 우선 해결하셨다니 다행입니다.관련 질문들이 기존에 올라와 blog에 내용 정리를 해두었어요. <a target="_blank" rel="noopener noreferrer nofollow" href="https://blog.naver.com/usavetime/223952832946">https://blog.naver.com/usavetime/223952832946</a>참고하시면 되겠습니다.

16-17강 이미지 업로드 부분 잘 안되는데 확인 좀 부탁드립니다.

안녕하세요. 안일호님 우선 완강까지 해주셔서 너무 감사합니다~!로컬에서 개발할 때는 보통 API Key를 .env 파일에 넣고 Git에 올라가지 않도록 관리하는데요. 실제 서비스 단계에서는 키를 별도 저장소나 서버에서 관리하는 것이 더욱 안전합니다.문의 주신 Cloud Functions를 사용하실 경우, 앱 코드에는 키가 전혀 포함되지 않고 서버(Function) 쪽에서만 키를 보관·사용하기 때문에 직접적인 노출을 방지할 수 있습니다.모든 내용을 여기서 다루긴 어렵지만, 아래 예제를 참고하시면 단계별로 수행하실수 있으리라 생각됩니다. (제가 사용했던 방법이기도 합니다.)<a target="_blank" rel="noopener noreferrer nofollow" href="https://community.flutterflow.io/community-tutorials/post/securing-api-keys-with-flutterflow-and-firebase-DxDNd5nFlEDrmT7">https://community.flutterflow.io/community-tutorials/post/securing-api-keys-with-flutterflow-and-firebase-DxDNd5nFlEDrmT7</a>순서를 간단히 정리 드리면.1. Firebase CLI 설치 & 로그인2. Cloud Functions에 API 키 보관- ex.) firebase functions:config:set your_key="your-openai-api-key"3. Cloud Functions에서 프록시 함수 작성 및 배포- 클라이언트에서 보낸 요청 데이터와 처리결과를 FlutterFlow로 반환하는 값에 대한 함수 작성4. FlutterFlow에서 Cloud Functions 연결 (Custom Code에서 Firebase Functions에 액션 추가)5. FlutterFlow에서 Custom Code로 api 를 호출이렇게 되겠습니다. 도움이 되시길 바랄게요~!

완강 이후, 추가적인 내용(API Key 보안)에 대한 질문입니다!

안녕하세요~ 위젯에 대해 궁금하신거군요.Icon 위젯과 Icon Button 위젯은 다릅니다.Icon 위젯은 단순히 시각적으로 아이콘을 표시할때 사용하고 Icon 버튼은 클릭이나 탭을 하여 액션을 취하고 싶을때 주로 사용합니다. (페이지 이동, 변수 설정 등)Icon 위젯은 클릭해도 아무런 액션이 일어나지 않습니다. Action 메뉴에서 클릭 관련 설정이 불가해요.도움이 되셨길 바라겠습니다.

icon 과 iconbuttn 의 기능차이가 뭐가 있나요

안녕하세요 U진입니다.첨부해주신 스냅샷은 별다른 문제점은 보이지 않고 있습니다.우선 firebase 콘솔에 로그인 하시어 storage 규칙에 아래와 같이 읽기 쓰기가 허용되어 있는지 확인해주세요.&nbsp;<pre><code>service firebase.storage {
match /b/{bucket}/o {

match /{allPaths=**} {

allow read, write: if true;

 }

 }

}</code></pre>&nbsp;권한 설정이 모두 허용되어 있는데도 에러가 난다면 cors 설정 문제일 가능성이 높습니다.최근 flutterflow 커뮤니티에도 관련글이 올라왔네요.firebase storage가 cors 허용을 해줘야 이미지가 보이는데 허용이 되어 있지 않으면 에러가 발생합니다.&nbsp;명확하게 확인할수 있는 방법은 이미지 업로드시 크롬 개발자 도구를 띄워서 콘솔 로그를 확인해보면 "blocked by cors policy" 이런 메세지가 확인됩니다.&nbsp;아래와 같이 cors 설정을 적용해 봅니다. mac os 기준으로 제가 직접 테스트 해보았으며 타OS를 사용하신다면 인터넷에 "firebase storage cors 설정"으로 검색해보시면 많은 적용 사례들을 확인하실 수 있습니다.&nbsp;<ol><li>firebase cli 설치</li></ol><pre><code>npm install -g firebase-tools
firebase login</code></pre><ol start="2"><li>googld cloud sdk 설치</li></ol><pre><code>brew install --cask google-cloud-sdk
gcloud init</code></pre>&nbsp;<ol start="3"><li>cors.json 파일 생성 (*는 테스트용이고 추후 실제 flutterflow 웹앱 주소만 넣어주시면 됩니다.)&nbsp;</li></ol><pre><code>[

{

"origin": ["*"],

"method": ["GET", "HEAD", "OPTIONS"],

"maxAgeSeconds": 3600

}

]</code></pre><ol start="4"><li>버킷 이름 확인</li></ol><pre><code>gcloud storage buckets list
예시: handsbook-wxhk78.firebasestorage.app</code></pre>&nbsp;<ol start="5"><li>cors 설정 적용</li></ol><pre><code>gsutil cors set cors.json 버킷주소
예시: gsutil cors set cors.json gs://handsbook-wxhk78.firebasestorage.app</code></pre>&nbsp;추가로 브라우저에서 쉘을 이용하여 설정하는 방법도 안내해드리겠습니다.<a target="_blank" rel="noopener noreferrer nofollow" href="https://console.cloud.google.com/">https://console.cloud.google.com/</a> 에 접근하여 우측에 클라우드쉘 활성화를 클릭해줍니다.그럼 하단에 쉘이 활성화 될것입니다.&nbsp;활성화된 쉘에 3번 항목에서 안내해드린 cors.json 파일을 생성한후 5번에서 안내드린 커맨드를 입력하시면 됩니다.<pre><code>gsutil cors set cors.json 버킷주소</code></pre>&nbsp;도움이 되시길 바라며 강의내용에 업데이트 관련 보완 필요한 부분은 보완하도록 하겠습니다.감사합니다.

이미지업로드에러

안녕하세요 U진입니다.첨부된 화면을 보았을때 이메일로 회원가입 진행시 오류가 발생하고 있는걸로 보입니다.오류내용은 Firebase 프로젝트에서 해당 로그인 Provider가 활성화 되어있지 않아 발생한걸로 확인되네요.firebase 콘솔에 로그인하셔서 로그인 제공업체에 원하시는 항목이 있는지 확인해보시기 바랍니다.로그인하자 하는 항목이 없을 경우 "새 공급업체 추가"를 통해서 추가해주시면 됩니다.&nbsp;<img src="https://cdn.inflearn.com/public/files/posts/32a4705d-ce38-45d0-846c-f509de08a4cf/f1d093d4-8e67-4b21-8fbf-6338f68ff728.webp" media-type="img" alt="스크린샷 2025-07-10 오후 4.38.32.png.webp" title="스크린샷 2025-07-10 오후 4.38.32.png.webp" width="643" height="232">&nbsp;&nbsp;

하단에 왜 이런 에러가 발생하는 건가요

안녕하세요. U진입니다.overflow가 발생하였네요. flutterflow 구현을 하다가 종종 겪는 현상입니다.먼저 listview 위젯을 container 위젯으로 감싸주어야 합니다.아래는 예시에요.<img src="https://cdn.inflearn.com/public/files/posts/72ed0849-c005-46b2-9b2b-837d96ef34b5/b77803fa-590c-4cc5-acfb-88a682f84aba.webp" media-type="img" alt="스크린샷 2025-06-02 오후 7.08.09.png.webp" title="스크린샷 2025-06-02 오후 7.08.09.png.webp" width="546" height="534">&nbsp;그다음 container 위젯의 height 비율을 조정해주시고요.<img src="https://cdn.inflearn.com/public/files/posts/7ba72454-e330-4edf-b7fd-ef0c39ceef97/c4d243f7-ffca-4c34-903e-7a7e5bbff0fe.webp" media-type="img" alt="스크린샷 2025-06-02 오후 7.08.20.png.webp" title="스크린샷 2025-06-02 오후 7.08.20.png.webp" width="586" height="276">&nbsp;마지막으로 listview로 감싸져 있는 이미지를 클릭한후 우측 속성창에서 Expansion을 Flexible이나 Expanded로 수정해주시면 됩니다.<img src="https://cdn.inflearn.com/public/files/posts/b8d0aa64-ab07-47a6-b83a-d60380b07cf8/2f26e65b-413c-4d2d-910f-c29c1677e31b.webp" media-type="img" alt="스크린샷 2025-06-02 오후 7.09.00.png.webp" title="스크린샷 2025-06-02 오후 7.09.00.png.webp" width="602" height="190">&nbsp;도움이 되셨길 바랍니다.

ujean

投稿