所有人
我在React.js中实现Google Login时遇到了一个问题,我使用了@react-oauth/google
import { Button, Typography } from '@mui/material'
import { GoogleOAuthProvider, useGoogleLogin } from "@react-oauth/google"
const googleClientId = process.env.REACT_APP_GOOGLE_CLIENT_ID
const googleIcon = (
<img alt="google" src="/static/images/icons/google-icon.svg" />
)
const GoogleLoginComponent = () => {
const googleLogin = useGoogleLogin({
flow: 'implicit',
onSuccess: async (tokenResponse) => {
try {
console.log(tokenResponse)
} catch (err) {
console.log(err)
}
},
onError: (errorResponse) => console.log(errorResponse)
})
return (
<Button
variant="outlined"
fullWidth
startIcon={googleIcon}
onClick={() => googleLogin()}
sx={{
padding: "11px 15px",
"& .MuiButton-startIcon": {
position: "absolute",
left: "15px",
},
textTransform: "capitalize",
color: "black",
}}
>
<Typography component="span">Continue with Google</Typography>
</Button>
)
}
const CustomGoogleLogin = () => {
return (
<GoogleOAuthProvider clientId={googleClientId}>
<GoogleLoginComponent />
</GoogleOAuthProvider>
)
}
export default CustomGoogleLogin
字符串
enter image description here
我可以成功获取访问令牌,但出现上述错误。请帮帮我
我想修复的错误时,实现谷歌登录
1条答案
按热度按时间dfuffjeb1#
似乎是一个bug。当我尝试使用最新版本的angular时,也得到了同样的错误。在头中的这个Meta将解决它:
字符串
但它不适用于 chrome 和边缘。
如果你做这个项目是为了学习react,请使用firefox。在firefox上,它不需要上面的Meta。但我知道,如果你开发一个生产就绪的系统,这不是一个真实的的解决方案。我希望它很快就能修好。