我正在玩 Firebase,我正在尝试通过 Google 登录进行身份验证。我创建了一个 firebase 项目,并在登录方法中启用了 Google 提供程序。
然后在我的 index.html 中,我有这个主要是由 firebase init 生成的。我在那里添加了按钮。
<html>
<head>
<meta charset="utf-8">
<meta name="viewport" content="width=device-width, initial-scale=1">
<!-- update the version number as needed -->
<script defer src="/__/firebase/6.0.2/firebase-app.js"></script>
<!-- include only the Firebase features as you need -->
<script defer src="/__/firebase/6.0.2/firebase-auth.js"></script>
<script defer src="/__/firebase/6.0.2/firebase-database.js"></script>
<script defer src="/__/firebase/6.0.2/firebase-messaging.js"></script>
<script defer src="/__/firebase/6.0.2/firebase-storage.js"></script>
<!-- initialize the SDK after all desired features are loaded -->
<script defer src="/__/firebase/init.js"></script>
<script src="signin.js"></script>
</style>
</head>
<body>
<button id="signin">Sign in</button>
</body>
</html>
在我的 signin.js 我处理登录
document.addEventListener("DOMContentLoaded", function(event) {
var firebaseConfig = {
apiKey: "AIzaSyC8bHVEtWDcTLJ0b8UOOZ5ClCV1tobqm5w",
authDomain: "second-d10d4.firebaseapp.com",
databaseURL: "https://second-d10d4.firebaseio.com",
projectId: "second-d10d4",
storageBucket: "second-d10d4.appspot.com",
messagingSenderId: "912088308787",
appId: "1:912088308787:web:24c9fa6af5dd0771"
};
// Initialize Firebase
firebase.initializeApp(firebaseConfig);
let signinbutton = document.getElementById("signin");
signinbutton.addEventListener("click", signin);
});
function signin(){
var provider = new firebase.auth.GoogleAuthProvider()
firebase.auth().signInWithPopup(provider)
.then(result => {
console.log("auth success")
console.log(result)
var token = result.credential.accessToken
var user = result.user
})
.catch(error => {
console.log("auth error")
var errorCode = error.code;
var errorMessage = error.message;
var email = error.email;
var credential = error.credential;
})
}
部署后,当我访问该站点并尝试登录时,我收到此错误。
403. That’s an error.
Error: restricted_client
Application: project-912088308787
You can email the developer of this application at: unconfiguredapp@google.com
This app is not yet configured to make OAuth requests. To do that, set up the app’s OAuth consent screen in the Google Cloud Console.
Learn more
Request Details
response_type=code
client_id=912088308787-potc94v4vl23tscu3gm9pnqu282s52nl.apps.googleusercontent.com
redirect_uri=https://second-d10d4.firebaseapp.com/__/auth/handler
state=AMbdmDnNM2kSjUeMO4KsxjdWqODEehA03g2bOBE5ZMEgzwCFXx5_n81fN_IKs52mn6P9bWpzMGF0ja9gDSyA39vx5ukZo_bY6UBitPUkFTKQvK3hSYxYyrjCxW4mJ3F5076yhktxbVchOAkMtKCl7vyh2pX4SjBV2YjvP-_CL8l9y-RWaegyO7_qq7qcxXsjVe8SKziqRV_AjMt7I9GZTVfaLovBfz-KkLwG1CSGdvfXs8XZImuDz6KR9sri-QlcDFthhxih0EOi9fJt10oNYEvBNtn5Y_54sQcMVKanlnIWiltG-KJyjY_0pwy6HyhPBDdDGKUe5g
scope=openid https://www.googleapis.com/auth/userinfo.email profile https://www.googleapis.com/auth/contacts.readonly
有谁知道可能导致此错误的原因?
编辑:
问题解决了。用户提出的解决方案:Vanduc1102 已修复。
在 firebase 项目设置中设置支持电子邮件
编辑 2019 年 7 月 31 日:
如果您在插入支持电子邮件后仍有问题:在显示的 403 错误页面上,单击“了解更多”会将您带到 GCP“OAuth 同意屏幕”
从那里您将看到两个字段“支持电子邮件”和“应用程序 Logo ”。对于应用程序 Logo ,任何图标/图像都可用于识别应用程序,对于支持电子邮件,应该是 firebase 控制台中使用的电子邮件。上传应用程序 Logo 并填写支持电子邮件字段后,保存更改,Google 身份验证现在应该可以与您的应用程序一起使用。
最佳答案
我在学习教程时遇到了问题:https://medium.com/firebase-developers/how-to-setup-firebase-authentication-with-react-in-5-minutes-maybe-10-bb8bb53e8834
我通过更正 解决了这个问题支持邮箱字段,它是空白的
关于Firebase - 无法通过 Google 登录进行身份验证,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/56191807/