発生している事象

• 再読み込みすると認証が必要なページに遷移できなくなる（ローカルでは永続化できている）
• クッキーは消えていない（↓にエビデンス有り）

認証が必要なページの判定をしているmiddleware

/**
 * 認証が必要なページで未認証の場合はリダイレクトする
 */
export default function({ store, redirect, commit }) {
  if (
    store.state.authenticate.id === null ||
    typeof store.state.authenticate.id === 'undefined'
  ) {
    redirect('/signup')
  }
}

↑こんな感じでauthenticate.idに値が入っていなかったら未認証とみなしてsignupページへリダイレクトするようにしている

事象的にはこれが効いてしまっている。。。ということはauthenticate.idに値が入っていない

一番最初にクッキーを設定している実装

• 1.loginアクションにてuser_idとしてクッキーをセット

/** ログイン処理 */
  async login({ commit }, loginUserFilter: InputUserFilter) {
    const response = await fireApp
      .auth()
      .signInWithEmailAndPassword(
        loginUserFilter.email,
        loginUserFilter.password
      )
    if (response.operationType === 'signIn') {
      commit('setloginStatus', { loginStatus: true })

      const authUser = {
        id: response.user.uid,
        email: response.user.email,
        name: response.user.displayName
      }
      const cookies = new Cookies()
      cookies.set('user_id', JSON.stringify(response.user.uid))
      // firebase上のログインデータ取得まで確認済み
      commit('setId', { id: authUser.id })
      commit('setEmail', { email: authUser.email })
      commit('setName', { name: authUser.name })
    }
  },

再読み込みに対応した（ハズ）のmiddleware

• 1.middlewareにてuser_idクッキーを取得しstoreへ格納する

import Cookies from 'universal-cookie'

export default ({ req, store }) => {
  if (process.browser) {
    return
  }
  const cookies = new Cookies(req.headers.cookie)
  const userId = cookies.get('user_id')
  store.commit('authenticate/setId', { id: userId })
}

再読み込み前のクッキー

再読み込み後のクッキー

クッキーは消えていない

• ご指摘があればいただけると嬉しいです。

追記

middlewareの挙動でローカルと本番で異なる

• ローカルだとif (process.browser)の所には入らないのに本番だと入ってしまいreturnされ、終わる。。。