How to read php session values inside javascript?-CodePudding

i am very new in html ,JS and php . I have created a page that has only a sidebare menu with some options and there are some users logged in(in the log in phase i used php with mySQL for my base in an other file):

    <div id="mySidenav" class="sidenav">
    <a href="javascript:void(0)" class="closebtn" onclick="closeNav()">&times;</a>
    <a id="concerts"href="#">Concerts</a>
    <a id="favorites"href="#">Favorites</a>
    <a id="organizer"href="#">Orginizer</a>
    <a id="admin"href="#">Administration</a>
</div>


<span style="font-size:30px;cursor:pointer" onclick="openNav()">&#9776; </span>

<script>
    function openNav() {
        document.getElementById("mySidenav").style.width = "250px";
    }

    function closeNav() {
        document.getElementById("mySidenav").style.width = "0";
    }

    document.getElementById("concerts").onclick = function () {
        location.href = "concerts.php";
    };

My problem here is that i need to exclude some users lets say based on their names by clicking on the 'Concerts' option from my menu . How can i do that in javascript ?

i thought of php SESSION but nothing seems to work .

Any help would be valuable and i am really sorry if the answer is too obvious.

CodePudding user response：

I have modified your original code a bit. I added a PHP code to show you how to determine the registration status of your users using their name. Then I modified the JS to show you how to get and use the registration status to allow or deny access to your concert page.

Consider improving your code by: 1)Using session variable to hold the user name. 2)Query your DB for registered users and populate it into an array. 3)Instead of using name as a criteria for screening consider using their id.

<?php
   
//session_start();
//$name = $_SESSION['name'];

// Create 2 variables $name and $registered_names
$name = 'Jane';
$registered_names = ['John', 'Rose', 'Steve', 'James', 'Jane'];

// Check if name of current user is among the array of registered names 
$is_registered = is_int(array_search($name, $registered_names));

?>

<div id="mySidenav" class="sidenav">
    <a href="javascript:void(0)" class="closebtn" onclick="closeNav()">&times;</a>
    <a id="concerts" href="#">Concerts</a>
    <a id="favorites" href="#">Favorites</a>
    <a id="organizer" href="#">Orginizer</a>
    <a id="admin" href="#">Administration</a>
</div>

<span style="font-size:30px;cursor:pointer" onclick="openNav()">&#9776; </span>

<!----------Attach the registration status to an hidden input field-------->
<input id="registration-status" type="hidden" value="<?php echo $is_registered ?>">

<script>
const
    is_registered = document.getElementById('registration-status').value

function openNav() {
    document.getElementById("mySidenav").style.width = "250px";
}

function closeNav() {
    document.getElementById("mySidenav").style.width = "0";
}

document.getElementById("concerts").onclick = function() {
    // Finally check the registration status before giving them access
    if (is_registered) {
        location.href = "concerts.php";
    }
};
</script>

CodePudding user response：

It's a bad practice to use client side(JS) to restrict access to a resource. Because any users can modify JS code and modify/bypass your logic.

PHP session is a good thing to authenticate and manage which part of your front-end users will access or not.

You can use session_start() at the top of the php files to check if users are logged or not.

[EDIT] To restrict user from accessing somehting,you can use something like PHP manual :

if ( isset( $_SESSION['user'] ) ) {
// restricted to login user
}