我尝试为我的reactjs/Expresjs Web应用程序添加google auth login。在前端,我使用react-google-login包:
import React from "react"
import { GoogleLogin } from "react-google-login"
import { useHistory } from "react-router-dom"
const axios = require('axios')
export default function LoginButton() {
let history = useHistory()
const { REACT_APP_GOOGLE_CLIENT_ID, REACT_APP_API_URL } = process.env
const onSuccess = async (response) => {
console.log(response)
const data = { token: response.tokenId }
const res = await axios.post(REACT_APP_API_URL + "/auth/google", data, {
'Content-Type' : 'text/json'
})
.then((res) => {
history.push('/home')
})
.catch((err) => {
console.log("[LOGIN FAILED]")
})
}
const onFailure = (response) => {
console.log(response)
}
return(
<GoogleLogin
clientId={REACT_APP_GOOGLE_CLIENT_ID}
buttonText="Log in with Google"
onSuccess={onSuccess}
onFailure={onFailure}
cookiePolicy={'single_host_origin'}
/>
)
}
从看起来,我从这个按钮上获得了正确的数据。我正在将令牌发送到快递应用程序接口。这是我遇到问题的地方。当使用谷歌身份验证库验证令牌时,我收到错误:“错误:令牌使用得太晚,number_1
const { OAuth2Client } = require('google-auth-library')
require('dotenv').config()
const client = new OAuth2Client(process.env.CLIENT_ID)
const postGoogleLogin = async (req, res) => {
const { token } = req.body
try{
const ticket = await client.verifyIdToken({
idToken: token,
audience: process.env.CLIENT_ID
})
const { name, email, picture } = ticket.getPayload()
res.status(201).json({
name: name,
email: email,
picture: picture
})
}
catch(e){
console.log(e)
}
}
我已经尝试使用endpointhttps://oauth2.googleapis.com/tokeninfo?id_token=XYZ123来验证该令牌,它表明该令牌是有效的,但据我所知,该endpoint不应用于生产中
问题似乎出在图书馆本身。只要您在React和ExpressJs上使用相同的客户端id,只要令牌仍然有效,verifyIdToken就应该返回成功响应。
此外,您可以利用https://oauth2.googleapis.com/tokeninfo?id_token=XYZ123在生产代码中。
在内部,库调用相同的endpoint来验证您的令牌。