匿名でログイン認証するサンプル

Loading...

<p id="uid"><img src="loading.gif"> Loading...</p>
<button id="login" class="hidden">login</button>
<button id="logout" class="hidden">logout</button>

.hidden {
  display: none;
}

// Initialize Firebase
const config = {
  apiKey: "AIzaSyDO1bPBMVsLjYdJgEwWDQhdw9BJ9OorRgg",
  authDomain: "mylogin-827cc.firebaseapp.com",
  databaseURL: "https://mylogin-827cc.firebaseio.com",
  projectId: "mylogin-827cc",
  storageBucket: "mylogin-827cc.appspot.com",
  messagingSenderId: "129404956124"
};
firebase.initializeApp(config)

let uid = document.getElementById('uid')
const auth = firebase.auth()
const login = document.getElementById('login')
const logout = document.getElementById('logout')
login.addEventListener('click', () => auth.signInAnonymously())
logout.addEventListener('click', () => auth.signOut())
auth.onAuthStateChanged(user => {
  if (user) {
    login.classList.add('hidden')
    logout.classList.remove('hidden')
    uid.textContent = `${user.uid}でログイン中`
  } else {
    login.classList.remove('hidden')
    logout.classList.add('hidden')
    uid.textContent = 'ログアウト中'
  }
})