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

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

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

Firebase Authenticationは、Firebaseを利用したユーザーの認証機能です。バックエンドサービス、SDK、アプリでのユーザー認証に使用できるUIライブラリが用意されています。

React.js

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

Q&A

0回答

1040閲覧

【React+Firebase】ログインユーザーから取得したaccessTokenとsecretの扱いについて

ad_mania_g

総合スコア0

Firebase Authentication

Firebase Authenticationは、Firebaseを利用したユーザーの認証機能です。バックエンドサービス、SDK、アプリでのユーザー認証に使用できるUIライブラリが用意されています。

React.js

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

0グッド

0クリップ

投稿2021/11/16 13:27

編集2022/01/12 10:55

プログラム初心者です。
今、React+Firebaseで、ツイッター認証付きの掲示板のようなサイトを作成しています。
その中で、ツイッターでログインしたユーザーが掲示板に書き込むとそれと同時に
自信のツイッター上にツイートする機能を作ろうと考えています。

そこで困ったているのが、ログインユーザーのaccessTokenとsecretについて2つ質問させてください。

ツイッターでログイン時に、accessTokenとsecretが下記のような感じで取得できるですが、
これをFirebaseに保存して扱うのはセキュリティーとかを考えて、
一般的に良くないのでしょうか?それともOKなんでしょうか?

react

1firabase.js 2 3import firebase from "firebase/app"; 4import "firebase/auth"; 5import "firebase/firestore"; 6import 'firebase/analytics' 7 8const firebaseConfig = { 9 apiKey: "xxxxxxxxxxxxxxxxxxxxxxxxxxxx", 10 authDomain: "xxxxxxxxxxxxxxxxxxxxxxxxxxxx", 11 projectId: "xxxxxxxxxxxxxxxxxxxxxxxxxxxx", 12 storageBucket: "xxxxxxxxxxxxxxxxxxxxxxxxxxxx", 13 messagingSenderId: "xxxxxxxxxxxxxxxxxxxxxxxxxxxx", 14 appId: "xxxxxxxxxxxxxxxxxxxxxxxxxxxx", 15}; 16 17firebase.initializeApp(firebaseConfig); 18export const twitterProvider = new firebase.auth.TwitterAuthProvider(); 19export const db =firebase.firestore(); 20export const auth = firebase.auth(); 21 22export const signInWithTwitter = async ()=>{ 23 await firebase.auth().signInWithPopup(twitterProvider).then((result) => { 24 db.collection("users").doc(result.user.uid).set({ 25 uid:result.user.uid, 26 display: result.user.displayName, 27 email:result.user.email, 28 photoURL:result.user.photoURL, 29 createdAt: firebase.firestore.FieldValue.serverTimestamp() 30 31// accessToken と secret を firabaseで保存? 32 token:result.credential.accessToken, 33 secret:result.credential.secret, 34}) 35 36}).catch((error) => { 37 console.log(error.message); 38}); 39}

2.ログインしたユーザーの情報をuseContextで利用しているのですが、ここにツイッターでログイン時に取得できた、accessTokenとsecretの情報を下のコードに追加するにはどのように書けば良いのでしょうか?

react

1import React ,{useState,useEffect,createContext} from "react"; 2import {auth} from "../service/firebase"; 3 4export const AuthContext =createContext(); 5 6export const AuthProvider =({children})=>{ 7 const [currentUser, setCurrentUser] =useState(""); 8 useEffect(()=>{ 9 auth.onAuthStateChanged(setCurrentUser) 10 },[]); 11 12 return ( 13 <AuthContext.Provider value={{currentUser}}> 14 {children} 15 </AuthContext.Provider> 16 ); 17}; 18 19export default AuthProvider;

なにぶんプログラム初心者ですので、私が聞きたいことが伝わった自信はありませんが、ご助言を頂ければ幸いです。

【お聞きたいことまとめ】
1.ユーザーのaccessTokenとsecretを保存するのは問題ないのか?
2.AuthProvider.jsでaccessTokenとsecretをuseContextで取得するにはどのようにすれば良いのか?

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

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

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

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

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

hoshi-takanori

2021/11/18 21:53

> 1.ユーザーのaccessTokenとsecretを保存するのは問題ないのか? Firebase に保存すると他人からアクセスされる可能性があり、問題だと思います。
hiraba

2021/11/19 11:45 編集

ありがとうございます。 accessTokenとsecretはfirebaseで保存しない方向で作っていきます。 あと、初心者の質問で申し訳ございませんが、 ログインしているユーザーのツイッターのaccessTokenとsecretはfirebaseを取得する方法ってございますでしょうか?
guest

あなたの回答

tips

太字

斜体

打ち消し線

見出し

引用テキストの挿入

コードの挿入

リンクの挿入

リストの挿入

番号リストの挿入

表の挿入

水平線の挿入

プレビュー

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

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

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

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

ただいまの回答率
85.50%

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

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

質問する

関連した質問