您当前的位置: 首页 > 慢生活 > 程序人生 网站首页程序人生
邮箱激活链接生成及自定义token基于php的生成(firebase)
发布时间:2022-10-20 20:46:27编辑:雪饮阅读()
上篇有讲到firebase的短信注册登录验证、和google登录以及token解密。
那么这篇来了解下邮箱激活功能,也就是发送邮件到邮箱去,然后邮件内容就是一个激活链接。
邮箱激活链接的实现实际上啊也是不难的
<template>
<div class="about">
<div>
<input v-model="email" placeholder="输入email"/>
<input v-model="password" placeholder="输入password"/>
</div>
<div>
<button v-on:click="fn1">基于邮箱与密码的账户-创建</button>
</div>
<div>
<button v-on:click="fn2">基于邮箱与密码的账户-登录</button>
</div>
<div>
<button v-on:click="fn3">基于邮箱与密码的账户-发送到邮箱验证(激活)</button>
</div>
</div>
</template>
<script>
import {createUserWithEmailAndPassword,getAuth,signInWithEmailAndPassword,sendEmailVerification} from "firebase/auth";
import {initializeApp} from "firebase/app";
const firebaseConfig = {
apiKey: "AIzaSyDZgBzK3WWgfVhsxFxKnhRNBecvOSe7Qok",
authDomain: "ccat-5ba6c.firebaseapp.com",
projectId: "ccat-5ba6c",
storageBucket: "ccat-5ba6c.appspot.com",
messagingSenderId: "913510634757",
appId: "1:913510634757:web:52828d850dc6e5b705d36c",
measurementId: "G-XQM7EZV06M",
};
const firebaseApp=initializeApp(firebaseConfig);
console.log("firebaseApp",firebaseApp);
export default {
name: 'EmailWithPasswordView',
components: {
},
data() {
return {
email:"gaojiupan@gmail.com",
password:null,
}
},
mounted:function(){
},
methods:{
fn1(){
createUserWithEmailAndPassword(getAuth(), this.email, this.password)
.then((userCredential) => {
console.log("邮箱与密码注册=》注册凭据",userCredential);
// Signed in
//const user = userCredential.user;
// ...
})
.catch((error) => {
console.log("邮箱与密码注册=>错误",error);
//const errorCode = error.code;
//const errorMessage = error.message;
// ..
});
},
fn2(){
signInWithEmailAndPassword(getAuth(), this.email, this.password)
.then((userCredential) => {
console.log("邮箱与密码登录=>登录凭据",userCredential);
})
.catch((error) => {
console.log("邮箱与密码登录=>错误",error);
});
},
fn3(){
var actionCodeSettings = {
//配置邮箱中激活邮件时候的激活链接
url: 'http://localhost:8080/?email=' + getAuth().currentUser.email,
};
sendEmailVerification(getAuth().currentUser,actionCodeSettings)
.then(function() {
// Verification email sent.
console.log("验证邮件已发送至"+getAuth().currentUser.email);
})
.catch(function(error) {
//可能会遭遇的错误及解决方案:https://github.com/firebase/firebaseui-web/issues/566
console.log("验证邮件发送失败",error);
});
}
}
}
</script>
那么所谓的自定义id令牌的实现其实可以说是基于用户名和密码的一种登录方式
php后端生成自定义token实现如:
public function firebase_custom_token_generate(){
$uid="xxxx";
//私钥来自https://console.cloud.google.com/iam-admin/serviceaccounts/details/103791253834152494906/keys?project=ccat-5ba6c&supportedpurview=project
// iam admin =>Service Accounts=>某个条目=》actions=》 Manage keys =》add key(视情况而定)会产生一个json文件,PRIVATE KEY就在该json文件中
$json_contnet=file_get_contents(__DIR__."/ccat-5ba6c-b32988c86dd0.json");
$json_contnet=preg_replace('/[\x00-\x1F]/','', $json_contnet);
$json_to_arr=json_decode($json_contnet,true);
$private_key = $json_to_arr["private_key"];
// 您项目的服务帐号电子邮件地址
$service_account_email=$json_to_arr["client_email"];
$now_seconds = time();
$payload = array(
// 您项目的服务帐号电子邮件地址
"iss" => $service_account_email,
// 您项目的服务帐号电子邮件地址
"sub" => $service_account_email,
//受众
"aud" => "https://identitytoolkit.googleapis.com/google.identity.identitytoolkit.v1.IdentityToolkit",
//颁发时间 当前时间(与 UNIX 计时原点之间相隔的秒数)
"iat" => $now_seconds,
/*
* 令牌到期的时间(与 UNIX 计时原点之间相隔的秒数),该时间可能比 iat 晚最多 3600 秒。
注意:这仅会控制自定义令牌本身的过期时间。但是,一旦您使用 signInWithCustomToken() 让用户登录,他们将一直在设备上保持登录状态,
直到其会话失效或用户退出帐号为止。
* */
"exp" => $now_seconds+(60*60), // Maximum expiration time is one hour
// 已登录用户的唯一标识符(必须是长度为 1-36 个字符的字符串)
"uid" => $uid,
/* "claims" => array(
"premium_account" => $is_premium_account
)*/
);
$jwt_token=JWT::encode($payload, $private_key, "RS256");
return $this->success($jwt_token);
}
然后前端就可以使用该token去实例化了
<template>
<div class="about">
<button id="sign-in-button" v-on:click="fn1">自定义身份验证</button>
</div>
</template>
<script>
import {signInWithCustomToken,getAuth} from "firebase/auth";
import {initializeApp} from "firebase/app";
import axios from "axios";
const firebaseConfig = {
apiKey: "AIzaSyDZgBzK3WWgfVhsxFxKnhRNBecvOSe7Qok",
authDomain: "ccat-5ba6c.firebaseapp.com",
projectId: "ccat-5ba6c",
storageBucket: "ccat-5ba6c.appspot.com",
messagingSenderId: "913510634757",
appId: "1:913510634757:web:52828d850dc6e5b705d36c",
measurementId: "G-XQM7EZV06M",
};
initializeApp(firebaseConfig);
export default {
name: 'CustomView',
components: {
},
data() {
return {
code:"",
confirmationResult:null,
phoneNumber:'+8613916354914',
}
},
mounted:function(){
},
methods:{
async fn1(){
var response=await axios({
method: 'post',
url: 'http://www.zhuanzhuan.com/api/firebase_custom_token_generate',
});
console.log("axios response",response);
signInWithCustomToken(getAuth(),response.data.msg)
.then((userCredential) => {
console.log("唤醒自定义身份验证=》用户凭证",userCredential);
// Signed in
//const user = userCredential.user;
// ...
if(typeof(userCredential.user)!="undefined" && typeof(userCredential.user.uid)!="undefined"){
alert("唤醒自定义身份验证=>登录唤醒成功");
}
})
.catch((error) => {
console.log("唤醒自定义身份验证失败 error",error);
/*const errorCode = error.code;
const errorMessage = error.message;*/
// ...
});
},
fn2(){
}
}
}
</script>
关键字词:邮箱,激活,链接,生成,自定义,token,基于,php,firebase