我目前正在构建服务器端渲染的Nuxt应用程序,该应用程序将使用Cloud Functions托管在Firebase上。也使用其他Firebase服务,例如Firestore,Auth等。
我使用Firebase Auth SDK通过电子邮件登录用户,然后将用户数据(电子邮件,uid和IdToken)存储在客户端的cookie中。每当页面重新加载时,nuxtServerInit
都会触发并将Cookie发送到Cloud Functions,然后在其中由admin SDK进行解析并返回给客户端,以将包含的用户数据存储在商店中。
我已经实现了这种方法,因为使用Nuxt SSR总是在刷新时“删除” auth().currentUser
对象。
在令牌过期之前它可以正常工作,但是我不知道如何在不访问auth()函数和调用getIdToken(true)
的情况下刷新令牌。
作为参考,下面是代码的外观:
在store / index.js中
async nuxtServerInit(vuexContext, { req }) {
// If the site is static, return
if (process.server && process.static) return;
// If there is no cookie, just return
if (!req.headers.cookie) return;
// Make the Token readable for Cloud Functions
const parsed = cookieparser.parse(req.headers.cookie);
const jwt = parsed.jwt;
// If there is no access token in the cookie, just return
if (!jwt) return;
await vuexContext.dispatch('auth/getUserFromCookie', jwt)
在store / auth.js中
getUserFromCookie(vuexContext, jwt) {
// Parse cookie in Cloud Function and return User Data
const parsed = firebase.functions().httpsCallable('parseJwT')
return parsed(jwt)
.then((decodedToken) => {
var userData = {
email: decodedToken.data.email,
uid: decodedToken.data.uid
}
vuexContext.commit('setUser', userData)
})
在functions / index.js中
exports.parseJwT = functions.https.onCall(jwt => {
return admin.auth().verifyIdToken(jwt).catch(error => {
console.log(error)
if (error.code === 'auth/id-token-revoked') {
return 'reauthenticate';
} else if (error.code === 'auth/id-token-expired'){
throw new functions.https.HttpsError('Id Token expired, please renew!');
} else {
return error;
}