2017-03-24 11 views
0

私は現在作業中のアプリケーションを作成しており、Cordova/Phonegapを使用したハイブリッドアプリを選択しているので、windows/android/IOS用のソースコードを1つ作成できます。PhoneGap + Firebase認証の問題を伴うハイブリッドアプリ

私たちが問題を抱えているところは、認証です。オンラインで調べたり、チュートリアルやサンプルコードをfirebaseのドキュメントに載せたりして、ここで私はこれを動作させることには近づいていません。

Google認証を使用して始めます。

最近のいくつかの変更により私が読んだことから、Webビューベースのアプリケーションによる認証の使用はもはや機能しません。 InAppBrowserを使用してgoogleAuthのポップアップやリダイレクトを開く完全な例はほとんどありませんでした。 (Firebaseの例から編集) 問題は、これはコルドバ/ 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> 

答えて

1

AskFirebase

Firebaseはあなただけ "のhttp://" を使用しようとしている前提としていますPhoneGapのような使用するものではないか "// HTTPSを" 「local://」または「file://」と入力して、「Authorized domains」セクションに追加することはできません。 AskFirebaseの人々がハイブリッド開発の道をヒントに取ったなら、それはいいだろう。 https://firebase.google.com/docs/auth/web/cordova にはいくつかの情報がありますが、これは「認証済みドメイン」設定エリアの近くまたは例の近くのどこにでも明白ではありません。 #AskFirebase

関連する問題