Search code examples
javascriptphpjqueryblueimpjquery-upload-file-plugin

Implementing required user login with jQuery File Upload


I am needing a suggestion on the easiest way to implement required user login for the jQuery File Upload. On the site home page users login with an email and password. We are then using $_SESSION[email] site wide to allow or disallow accessing of pages depending on whether or not the user is logged in.

So far this has worked fine on all PHP pages and below is the example of the code being used:

<?php
// at the top most of the page
session_start();

// Checking user login credentials
if(!isset($_SESSION['email'])){

// Alerting the user they must be logged in
echo "<script>alert('You must be logged in to access this page.')</script>";

// Sending the non-logged in user back to the home page
echo "<script>window.open('../index.php','_self')</script>";
}

// If the user is logged in let them see the page
else { ?>

// added to the very last line of the page
<?php } ?>

The login form is below in case you need to see that:

<form method="post" action="#">

        <table width="90%" border="0" align="center" bgcolor="white">


            <tr>
                <td bgcolor="ffffff" colspan="2" align="center"><h2>User Login</h2></td>
            </tr>

            <tr>
                <td align="right">Email:</td>
                <td><input type="text" name="email" id="email"></td>
            </tr>

            <tr>
                <td align="right">Password:</td>
                <td><input type="password" name="password" id="password"></td>
            </tr>

            <tr>
                <td colspan="2" align="center"><input type="button" name="login" id="login" value="Login"></td>

            </tr>

            <tr>
                <td colspan="2" align="center"><h3 style="margin-top:7px;"><a href="nonadmin_user_forgot_password.php" target="_blank" title="Reset Your Lost Password">Forgot Password?</a></h3></td>
            </tr>


            <tr>
                <td bgcolor="#ffffff" colspan="2" align="center"><div style="padding-top:5px;"><span style="font-size:20px;">Don't have an account?<br /><a href="/includes/register-user.php" title="Register with us!" target="_self">Sign Up</a> is <em>quick</em> and <em>easy</em>!</span></div></td>

        </table>
    </form>

This is the Login PHP file:

<?php
session_start();

// Connecting to the database and making the Bcrypt functions available
include("admin/includes/connect.php");
include ("lib/password.php");

// Let's get the mail and password from the Login Form
$email=$_POST['email1'];
$password= ($_POST['password1']); 

// Let's see if the entered email is in the database and if it is retrieve the password
$result = mysqli_query($conn, "SELECT * FROM nonadmin_user_login WHERE email='$email'");

// Create variables for the database result, password and email
$data = mysqli_fetch_array($result);
$bcrypt_pass = $data['nonadmin_user_pass'];
$email_match = $data['email'];

// If the email and password match up
if (password_verify ($password, $bcrypt_pass) == 1 AND $email == $email_match) {

// Start a session bound to the email
$_SESSION['email']=$email;

// Alert the user of a successful login
echo "Successfully Logged in.";

// Make a variable for the date and time
$mysqltime = date ("Y-m-d H:i:s");

// Update the database to show the time of the user's last successful login
mysqli_query($conn, "UPDATE nonadmin_user_login SET last_login='$mysqltime' WHERE email ='".$email."' ") or die(mysqli_error($conn));

}

// Alert the user of a failed login
else{
echo "Email or Password is wrong please try again.";
}

?>

And this is the Login JS:

<script>
// Let's get this party started
$(document).ready(function(){

// Binding this to the login form submit button
$("#login").click(function(){

// Setting variables and binding them to the login form fields
var email = $("#email").val();
var password = $("#password").val();

// Checking if the email or password is empty
if( email =='' || password ==''){
$('input[type="text"],input[type="password"]');
$('input[type="text"],input[type="password"]');

// Alerting the user of empty email and/or password
alert("Please fill all fields.");

// If the fields are not empty
}else {

// Posting the entered email and password to log-me-in.php
$.post("log-me-in.php",{ email1: email, password1:password},

// Function to event handle incorrect email or password
function(data) {

// If the email is invalid
if(data=='Invalid Email.......') {
$('input[type="text"]');
$('input[type="password"]');

// Alert the user of invalid entry
alert(data);

// If email and/or password don't match the database query
}else if(data=='Email or Password is wrong please try again.'){
$('input[type="text"],input[type="password"]');

// Alert the user of invalid entry
alert(data);

// If nothing went wrong so far it's time to login and alert user of login success
} else if(data=='Successfully Logged in.'){

// Let's refresh the window so the sidebar signin block can swap to the logged in block
window.location=window.location;
$("form")[0].reset();
$('input[type="text"],input[type="password"]');
alert(data);
} else{
alert(data);
}
});
}
});
});</script>

I have tried several methods and all of them failed. I tried using the standard code (uppermost code sample box) used on all other pages at the top of the jQuery File Upload index.html and it's a no go.

I also tried to add this standard code (uppermost code sample box) to the jQuery File Upload UploadHandler.php where the @session start line of code is...

protected function get_user_id() { //
        @session_start();
        return session_id();
    }

...and once again it did not work. The way it stands now anyone on earth can open the jQuery File Upload page and start loading files which is not okay. My thought is maybe I need to give up on not displaying the whole page if the user is not logged in and just let the page display... and then if the upload file button is clicked at that point fail the upload if they are not logged in?

If you have a suggestion how to block the whole page based on login let me know. If you have a suggestion on how to block the file upload based on login let me know. If you have any suggestions on anything at all let me know I am all ears and thanks in advance for any help you can lend!


Solution

  • Why not just check if

    if(isset($_SESSION['email']))
    

    is set and if so execute file upload script, if not, don't run the script and return an error

    if(!isset($_SESSION['email'])) 
    { actual upload script } 
    else
    { echo "I dont think so hombre" }