LOGICKY BLOG

PHP、Javascript、Python等のプログラミングに関するブログです

FirebaseでGoogleログインする

ここに説明があります。vueでやるときどこに何書くのがいいのかなーと思いますが、api/firebase.jsに下記みたいのを書きました。firebase.config.jsに、apiKeyとか、authDomainとかを書いております。

src/api/firebase.js

import firebase from 'firebase/app'
import 'firebase/firestore'
import 'firebase/storage'
import 'firebase/auth'
import config from '../../firebase.config'

firebase.initializeApp(config)
export const db = firebase.firestore()
db.settings({timestampsInSnapshots: true})
export const storage = firebase.storage()
export const auth = firebase.auth

firebase.config.js

export default {
  apiKey: "***********************",
  authDomain: "**********************",
  databaseURL: "***********************",
  projectId: "*********************",
  storageBucket: "********************",
  messagingSenderId: "**********************"
}

あとは、Googleログインのログイン状態の取得、ログイン処理、ログアウト処理などは、vuexのstoreに書いてます。main.jsで、Vueインスタンスを作るときに、ログインチェックが動作するようにしてます。

下記のリポジトリでやってみてます。

github.com