我目前正在工作中创建一个应用程序，我们选择了使用 Cordova/Phonegap 的混合应用程序，这样我们就可以拥有适用于 windows/android/IOS 的一个源代码。
我们遇到的问题是身份验证。在网上浏览并遵循 firebase 文档和此处的教程和示例代码后，我距离实现此功能还很远。
我们将首先使用 Google Auth。
据我所知，由于最近的一些更改，通过基于 Web View 的应用程序进行身份验证不再有效。使用 InAppBrowser 打开 googleAuth 弹出窗口或重定向的完整示例并不多。
以下代码是我们理想的使用方式:(根据 Firebase 的示例编辑) 问题是这在 Cordova/PhoneGap 应用程序中不起作用，但在 PC/Mac 的浏览器中完美运行
谁能解释一下我如何编辑它以使其在应用程序中工作？
<!-- Material Design Theming -->
<link rel="stylesheet" href="https://code.getmdl.io/1.1.3/material.orange-indigo.min.css">
<link rel="stylesheet" href="https://fonts.googleapis.com/icon?family=Material+Icons">
<script defer src="https://code.getmdl.io/1.1.3/material.min.js"></script>
<link rel="stylesheet" href="main.css">
<script src="https://www.gstatic.com/firebasejs/3.7.3/firebase.js"></script>
<script>
// Initialize Firebase
var config = {
apiKey: "xxx",
authDomain: "xxx.firebaseapp.com",
databaseURL: "https://xxx.firebaseio.com",
storageBucket: "xxx.appspot.com",
messagingSenderId: "xxx"
};
firebase.initializeApp(config);
</script>
<script type="text/javascript">
/**
* Function called when clicking the Login/Logout button.
*/
// [START buttoncallback]
function toggleSignIn() {
if (!firebase.auth().currentUser) {
// [START createprovider]
var provider = new firebase.auth.GoogleAuthProvider();
// [END createprovider]
// [START addscopes]
provider.addScope('https://www.googleapis.com/auth/plus.login');
// [END addscopes]
// [START signin]
firebase.auth().signInWithPopup(provider).then(function(result) {
// This gives you a Google Access Token. You can use it to access the Google API.
var token = result.credential.accessToken;
// The signed-in user info.
var user = result.user;
// [START_EXCLUDE]
document.getElementById('quickstart-oauthtoken').textContent = token;
// [END_EXCLUDE]
}).catch(function(error) {
// Handle Errors here.
var errorCode = error.code;
var errorMessage = error.message;
// The email of the user's account used.
var email = error.email;
// The firebase.auth.AuthCredential type that was used.
var credential = error.credential;
// [START_EXCLUDE]
if (errorCode === 'auth/account-exists-with-different-credential') {
alert('You have already signed up with a different auth provider for that email.');
// If you are using multiple auth providers on your app you should handle linking
// the user's accounts here.
} else {
console.error(error);
}
// [END_EXCLUDE]
});
// [END signin]
} else {
// [START signout]
firebase.auth().signOut();
// [END signout]
}
// [START_EXCLUDE]
document.getElementById('quickstart-sign-in').disabled = true;
// [END_EXCLUDE]
}
// [END buttoncallback]
/**
* initApp handles setting up UI event listeners and registering Firebase auth listeners:
* - firebase.auth().onAuthStateChanged: This listener is called when the user is signed in or
* out, and that is where we update the UI.
*/
function initApp() {
// Listening for auth state changes.
// [START authstatelistener]
firebase.auth().onAuthStateChanged(function(user) {
if (user) {
// User is signed in.
var displayName = user.displayName;
var email = user.email;
var emailVerified = user.emailVerified;
var photoURL = user.photoURL;
var isAnonymous = user.isAnonymous;
var uid = user.uid;
var providerData = user.providerData;
// [START_EXCLUDE]
document.getElementById('quickstart-sign-in-status').textContent = 'Signed in';
document.getElementById('quickstart-sign-in').textContent = 'Sign out';
document.getElementById('quickstart-account-details').textContent = JSON.stringify(user, null, ' ');
// [END_EXCLUDE]
} else {
// User is signed out.
// [START_EXCLUDE]
document.getElementById('quickstart-sign-in-status').textContent = 'Signed out';
document.getElementById('quickstart-sign-in').textContent = 'Sign in with Google';
document.getElementById('quickstart-account-details').textContent = 'null';
document.getElementById('quickstart-oauthtoken').textContent = 'null';
// [END_EXCLUDE]
}
// [START_EXCLUDE]
document.getElementById('quickstart-sign-in').disabled = false;
// [END_EXCLUDE]
});
// [END authstatelistener]
document.getElementById('quickstart-sign-in').addEventListener('click', toggleSignIn, false);
}
window.onload = function() {
initApp();
};
</script>
<button disabled class="mdl-button mdl-js-button mdl-button--raised" id="quickstart-sign-in">Sign in with Google</button>
<!-- Container where we'll display the user details-->
<div class="quickstart-user-details-container">
Firebase sign-in status: <span id="quickstart-sign-in-status">Unknown</span>
<div>Firebase auth <code>currentUser</code> object value:</div>
<pre><code id="quickstart-account-details">null</code></pre>
<div>Google OAuth Access Token:</div>
<pre><code id="quickstart-oauthtoken">null</code></pre>
</div>
<style>
div.quickstart-user-details-container
display: none;
}
</style>
最佳答案
询问Firebase
Firebase 假设您只会使用“http://”或“https://”，而不是phonegap 使用的内容，例如“local://”或“file://”，因此您无法添加该内容到“授权域”部分。如果 AskFirebase 人员考虑到混合开发路径 - 提示，那就太好了。 有一些信息在https://firebase.google.com/docs/auth/web/cordova 但这并不明显，例如在“授权域”配置区域附近或任何示例附近的任何地方。 #AskFirebase
关于javascript - 具有 PhoneGap + Firebase 身份验证问题的混合应用，我们在Stack Overflow上找到一个类似的问题： https://stackoverflow.com/questions/42996217/