如何解决Ionic IOS Google登录移动“ location.protocol”科尔多瓦
因此,我无法在具有移动应用程序的IOS上使用Google登录。
最初我的代码是
auth.service.ts
constructor(
private afAuth: AngularFireAuth,private afs: AngularFirestore,private router: Router
) {
this.user$ = this.afAuth.authState.pipe(
switchMap(user => {
if (user) {
return this.afs.doc<any>(`users/${user.uid}`).valueChanges();
} else {
return of(null);
}
})
);
}
googleSignIn() {
const provider = new firebase.auth.GoogleAuthProvider();
return this.oAuthLogin(provider);
}
private async oAuthLogin(provider) {
const credential = await this.afAuth.signInWithPopup(provider);
return this.updateUserData(credential.user);
}
private updateUserData({ uid,email,displayName,photoURL }) {
const userRef: AngularFirestoreDocument<any> = this.afs.doc(`users/${uid}`);
const data = {
uid,photoURL
};
__email = email;
__id = uid;
this.router.navigate(['/tabs']);
return userRef.set(data,{ merge: true });
}
有了此代码,一切都可以在Web和Android上完美运行。 显示一个弹出窗口,我可以用Google登录。
IOS引发错误
Error: Uncaught (in promise):
Error: This operation is not supported in the environment this
application is running on. "location.protocol" must be http,https or chrome-extension and
web storage must be enabled.
所以我添加了一些Cordova插件,因为我的应用程序同时使用了Capacitor和Cordova。
https://firebase.google.com/docs/auth/web/cordova
但是,文档中的代码似乎也没有在IOS上运行。
signInWithPopup()
signInWithRedirect()
linkWithPopup()
和linkWithRedirect()
所有导致的错误均与以前相同。
似乎Google不再允许登录网络视图
https://developers.googleblog.com/2016/08/modernizing-oauth-interactions-in-native-apps.html
解决方法
我终于明白了!
https://jsmobiledev.com/article/ionic-google-login
此链接对我帮助很大。花了我一段时间才能完全实现所有功能,但它适用于ionic 4。
链接中的所有步骤必须完成。
结束代码:
auth.service.ts
constructor(
private afAuth: AngularFireAuth,private afs: AngularFirestore,private router: Router,private googlePlus: GooglePlus,) {
this.user$ = this.afAuth.authState.pipe(
switchMap(user => {
if (user) {
return this.afs.doc<any>(`users/${user.uid}`).valueChanges();
} else {
return of(null);
}
})
);
}
googleSignIn() {
this.googlePlus.login({
'webClientId': 'THIS_IS_YOUR_WEB_CLIENT_ID','offline': false
}).then( res => {
this.afAuth.signInWithCredential
(firebase.auth.GoogleAuthProvider.credential(res.idToken))
.then( success => {
console.log("Firebase success: " + JSON.stringify(success));
return this.updateUserData(success.user);
})
.catch( error => console.log("Firebase failure: " +
JSON.stringify(error)));
}).catch(err => console.error("Error: ",err));
}
private updateUserData({ uid,email,displayName,photoURL }) {
const userRef: AngularFirestoreDocument<any> = this.afs.doc(`users/${uid}`);
const data = {
uid,photoURL
};
__email = email;
__id = uid;
this.router.navigate(['/tabs']);
return userRef.set(data,{ merge: true });
}
版权声明:本文内容由互联网用户自发贡献,该文观点与技术仅代表作者本人。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如发现本站有涉嫌侵权/违法违规的内容, 请发送邮件至 dio@foxmail.com 举报,一经查实,本站将立刻删除。