auth.onAuthStateChanged(function(user){
if(user){
// is signed in
window.location.href = 'https://www.......';
} else {
// not signed in
alert("you are not logged in");
}
});
Solution 1 :
Problem :
I have a problem in identifying the used code that redirect the user to other page, as I copied the code from the internet, but I suffer trying to redirect the user after login; and I need to making sure the user is logged in not because he have the link so he can see the page I want to point out I am using firebase.google.com as a way to check the user
here is my app.js file
firebase.auth().onAuthStateChanged(function(user) {
if (user) {
// User is signed in.
document.getElementById("user_div").style.display = "block";
document.getElementById("login_div").style.display = "none";
var user = firebase.auth().currentUser;
if(user != null){
var email_id = user.email;
document.getElementById("user_para").innerHTML = "Welcome:" + email_id;
}
} else {
// No user is signed in.
document.getElementById("user_div").style.display = "none";
document.getElementById("login_div").style.display = "block";
}
});
function login(){
var userEmail = document.getElementById("email_field").value;
var userPass = document.getElementById("password_field").value;
firebase.auth().signInWithEmailAndPassword(userEmail, userPass).catch(function(error) {
// Handle Errors here.
var errorCode = error.code;
var errorMessage = error.message;
window.alert("Error : " + errorMessage);
// ...
});
}
function logout(){
firebase.auth().signOut();
}
auth.onAuthStateChanged(function(user){
if(user){
//is signed in
}else{
alert("you are not logged in");
//not signed in
}
});*{
direction: rtl;
}
body {
background: #fff;
padding: 0px;
margin: 0px;
font-family: 'Nunito', sans-serif;
font-size: 16px;
}
input, button {
font-family: 'Nunito', sans-serif;
font-weight: 700;
}
.logo{
display: block;
margin-left: auto;
margin-right: auto;
width: 128px;
height: 128px;
}
.main-div, .loggedin-div {
width: 20%;
margin: 0px auto;
margin-top: 150px;
padding: 20px;
display: none;
}
.main-div input {
display: block;
border: 1px solid #ccc;
border-radius: 5px;
background: #fff;
padding: 15px;
outline: none;
width: 100%;
margin-bottom: 20px;
transition: 0.3s;
-webkit-transition: 0.3s;
-moz-transition: 0.3s;
}
.main-div input:focus {
border: 1px solid #777;
}
.main-div button, .loggedin-div button {
background: #5d8ffc;
color: #fff;
border: 1px solid #5d8ffc;
border-radius: 5px;
padding: 15px;
display: block;
width: 100%;
transition: 0.3s;
-webkit-transition: 0.3s;
-moz-transition: 0.3s;
}
.main-div button:hover, .loggedin-div button:hover {
background: #fff;
color: #5d8ffc;
border: 1px solid #5d8ffc;
cursor: pointer;
}<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<meta http-equiv="X-UA-Compatible" content="ie=edge">
<title>Document</title>
<link rel="stylesheet" href="style.css">
<link rel="shortcut icon" href="imagesfavicon.ico" type="image/x-icon">
<link href="https://fonts.googleapis.com/css?family=Nunito:400,600,700" rel="stylesheet">
</head>
<body>
<div id="login_div" class="main-div">
<img src="./images/logo.png" alt="logo" class="logo">
<input type="email" placeholder="email" id="email_field" />
<input type="password" placeholder="password" id="password_field" />
<button onclick="login()">login</button>
</div>
<div id="user_div" class="loggedin-div">
<h3>welcome</h3>
<p id="user_para">Welcome to Firebase web login Example. You're currently logged in.</p>
<button onclick="logout()">logout</button>
</div>
<script src="https://www.gstatic.com/firebasejs/4.8.1/firebase.js"></script>
<script>
// Your web app's Firebase configuration
var firebaseConfig = {
apiKey: "******************************",
authDomain: "******************************",
databaseURL: "******************************",
projectId: "******************************",
storageBucket: "******************************",
messagingSenderId: "******************************",
appId: "******************************"
};
// Initialize Firebase
firebase.initializeApp(firebaseConfig);
</script>
<script src="app.js"></script>
</body>
</html>I want your help, please 🙂
Comments
Comment posted by Nick390
I am surprised The community is very big and nobody stopped to help me :(.
Comment posted by Nick390
Thank you for your response, after a long wait I decided to use other methods outside Firebase 🙂