Firebase身份验证可以正常运行,但会继续刷新页面

时间:2017-07-10 07:15:04

标签: javascript firebase web-applications firebase-authentication firebase-storage

所以我也是Web开发和Firebase的新手。我一直在尝试用简单的javascript和firebase构建一个多页面Web应用程序。应用程序看起来很好,适用于大部分内容。然而,由于我遇到了以下问题,它实在没用:

  1. 当我通过googleAuthProvider登录时(在我的index.html页面上),我将被带到另一个main.html页面。现在直到这里很好。但是一旦加载了main.html,它就会进入一个持续刷新的循环。
  2. 我的理由是,Firebase试图在加载时重新验证页面。所以循环发生了。但为什么,我无法调试。

    我已经查看了几乎所有我在互联网上找到的内容,但没有找到解决方案,这是基于简单的基于javascript的多页面web应用程序与firebase。

    如果有人有兴趣和善意的话,这里有我的应用程序的链接。

    Chatbot

    此外,这里也是我的javascript代码。

    var config = {
        apiKey: "XXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXX",
        authDomain: "XXXXXXXXX.firebaseapp.com",
        databaseURL: "https://XXXXXXXX.firebaseio.com",
        projectId: "XXXXXXXXXX",
        storageBucket: "XXXXXXXXXX.appspot.com",
        messagingSenderId: "XXXXXXXXXXXX"
      };
      firebase.initializeApp(config);
    
    //===============================================================================================
    $("document").ready(function(){
    
    const signinGoogle = document.getElementById("googleAuth");
    const signOut = document.getElementById("signout");
    const sendMsg = document.getElementById("send");
    const messageBox = document.getElementById("chatBox");
    const displayNAME = document.getElementById("dipslayName");
    const storageRef = firebase.storage().ref();
    	
    var currentUser;
    var name;
    var photoUrl;
    
     //++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++	
    	initApp();
     //++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++
     	if(signinGoogle){
    		 googleAuth.addEventListener('click', e=>{
    			firebase.auth().signInWithPopup(new firebase.auth.GoogleAuthProvider()).then(function(result) {	 
    			// This gives you a Google Access Token. You can use it to access the Google API.
      			var tokenGoogle = result.credential.accessToken;
    			  // The signed-in user info.
    			  var userGoogle = result.user;
    			  // ...Below line to be rmeooved if not working expectedly.
    				// var user = firebase.auth().currentUser;
    			}).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;
      			// ...
    			});
    		 });
    		
    		}
     //+++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++
     		if(signOut){
              signout.addEventListener('click', e=>{
    		   
    		  if(confirm("Do you wish to leave?")){
    			 promise = firebase.auth().signOut().then(function(){
    			 window.location = "index.html";
    			 });
    			 promise.catch(e => 
    	         console.log(e.message))
    			 }	
    			
    			});
    		 }
    //+++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++
        function initApp(){
        firebase.auth().onAuthStateChanged(function(user){
    	   
    	  if(user){
    	  window.location = "main.html";
    	 
    	  $("document").ready(function(){
    				
    			currentUser  = firebase.auth().currentUser;
    		        name  = currentUser.displayName;
    			photoUrl = currentUser.photoURL ;
    		  
    			console.log("Current user's name is : "+name);
    			console.log("Current user's photoUrl is : "+photoUrl);
    	        
    			displayNAME.innerHTML = "Hi "+name;
    			
        //+++++++++++Retrieving Msgs++++++++++++++++++++++++++++++++
    				var i=1;	
    				var firebaseRetrieveRef = firebase.database().ref().child(name+uid+"/MessageBoard");
    				firebaseRetrieveRef.on("child_added", snap =>{
    				var retrievedMsg = snap.val();
    				console.log("retrieved msgs is : "+retrievedMsg);
    				$("#taskList").append("<li id='list"+i+"'><div style='width:100%'><img src='"+photoUrl+"'style='width:10px;height:10px;border-radius:5px;'/><label>"+name+"</label></div><div style='width:100%'><p>"+retrievedMsg+"</p></div></li>");
    				i++;
    					});
    	//+++++++++++Storing Msgs++++++++++++++++++++++++++++++++
    		$("#send").on("click", function(){
    			 var newMessage=messageBox.value;
    			  if(newMessage==""){
    			  alert("Empty Message doesn't make any sense, does it?? ");
    			  }
    			  else{
    			  var firebaseStoreRef = firebase.database().ref().child(name+uid+"/MessageBoard");
    			 firebaseStoreRef.push().set(newMessage);
                  messageBox.value="";
    			  }
    			});
    	//+++++++++++Clearing/deleting all tasks++++++++++++++++++++++++
    		$("#clear").on("click", function(){
    			  var firebaseDeleteRef  = firebase.database().ref().child(name+uid+"/MessageBoard");
    			  firebaseDeleteRef.remove();
    			  $( ".scrolls" ).empty();
    			  });
        //+++++++++++++++++++++++++++++++++++++++++++++++++++++++
    	
    	  });
                    }
    		else
    		{
    		console.log(user+" is not logged in");
    		}
    		
    		});
        }	
    			  
    //+++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++
     });

1 个答案:

答案 0 :(得分:5)

您继续重定向到main.html。

firebase.auth().onAuthStateChanged(function(user){     
  if(user){
  window.location = "main.html";

每当您确定用户已登录时,您都会继续重定向到main.html。请确保在main.html上,您没有使用相同的逻辑并重新定向。