質問をすることでしか得られない、回答やアドバイスがある。

15分調べてもわからないことは、質問しよう!

新規登録して質問してみよう
ただいま回答率
85.48%
Firebase

Firebaseは、Googleが提供するBasSサービスの一つ。リアルタイム通知可能、並びにアクセス制御ができるオブジェクトデータベース機能を備えます。さらに認証機能、アプリケーションのログ解析機能などの利用も可能です。

React.js

Reactは、アプリケーションのインターフェースを構築するためのオープンソースJavaScriptライブラリです。

Q&A

0回答

324閲覧

firestoreに保存したファイルを一覧で呼び出したいが、tokenが見つからない

andy0505

総合スコア12

Firebase

Firebaseは、Googleが提供するBasSサービスの一つ。リアルタイム通知可能、並びにアクセス制御ができるオブジェクトデータベース機能を備えます。さらに認証機能、アプリケーションのログ解析機能などの利用も可能です。

React.js

Reactは、アプリケーションのインターフェースを構築するためのオープンソースJavaScriptライブラリです。

0グッド

0クリップ

投稿2019/07/05 08:44

編集2019/07/05 10:10

前提・実現したいこと

React + firebaseで画像アップロードとダウンロードの処理を書いています。
一括表示をしたいため、この記事にあるように、storageに保存したurlをdatabaseに保存することにより一覧表示をしたいと考えています。

発生している問題・エラーメッセージ

しかし、firebaseのアクセス権限の関係から、storageに保存したファイルのURLを見ると、?alt=mediaの後に&token?={トークン}が必要となっていました。そこで該当トークンを得ようと思ったのですが、得る方法を見つけることができませんでした。

ファイルURLのtoken?=以下の情報を取得するにはどうすれば良いのでしょうか?

該当のソースコード

storageにある画像ファイルのurlをdatabaseに保存する処理

js

1// storageのurlをdatabaseに保存 2const getImageUrl = async () => { 3 const currentUser = await firebase.auth().currentUser; 4 const imageDb = await firebase.firestore(); 5 const bucketName = await 'sample'; 6 const filePath = await `users/${currentUser.displayName}/images`; 7 const idToken= await currentUser.getIdToken(true); 8 console.log('token', idToken); // これでは無い 9 try { 10 imageDb 11 .collection('users') 12 .doc(currentUser.displayName) 13 .collection('images') 14 .add({ 15 downLoadUrl: `https://firebasestorage.googleapis.com/v0/b/${bucketName}.appspot.com/o/${encodeURIComponent( 16 filePath, 17 )}?alt=media&token=${idToken}`, // idTokenが違う 18 }); 19 console.log('set url'); 20 } catch (err) { 21 console.log(err); 22 } 23 };

試したこと

このトークンをfirebase.auth().currentUser.getIdToken(true)(参考:ID トークンの確認)を使って呼び出そうと思った所、全く異なるトークンが表示されてしまいました。

補足情報(FW/ツールのバージョンなど)

firebase cloud fire storeを使用
データ保存は以下のように書いています。
user名/images直下にファイルが保存されるようになっています。

js

1// storageにデータ保存 2const saveImage = async (inputFile) => { 3 const db = await firebase.storage().ref(); 4 const currentUser = await firebase.auth().currentUser; 5 try { 6 const imageRef = await db.child(`${currentUser.displayName}/images`); 7 const res = await imageRef.put(inputFile); 8 await getImageUrl(); 9 console.log(res); 10 } catch (err) { 11 console.log(err); 12 } 13 };

気になる質問をクリップする

クリップした質問は、後からいつでもMYページで確認できます。

またクリップした質問に回答があった際、通知やメールを受け取ることができます。

バッドをするには、ログインかつ

こちらの条件を満たす必要があります。

guest

あなたの回答

tips

太字

斜体

打ち消し線

見出し

引用テキストの挿入

コードの挿入

リンクの挿入

リストの挿入

番号リストの挿入

表の挿入

水平線の挿入

プレビュー

まだ回答がついていません

会員登録して回答してみよう

アカウントをお持ちの方は

15分調べてもわからないことは
teratailで質問しよう!

ただいまの回答率
85.48%

質問をまとめることで
思考を整理して素早く解決

テンプレート機能で
簡単に質問をまとめる

質問する

関連した質問