javascript sessionStorage doesn't get element, set in PHP

Question

There is a PHP value from a form, that I've set to the session. In my javascript code, I want to be able to access this value, but it doesn't work.

    'use strict';
    let numOfPlayers = Number(sessionStorage.getItem('numOfPlayers'));//This returns 0
    alert(numOfPlayers);

    <?php
      session_start();
    ?>
    <!DOCTYPE html>
    <?php
      if ($_SERVER['REQUEST_METHOD'] == 'POST') {
        $numOfPlayers = $_POST['numOfPlayers'];
        $_SESSION['numOfPlayers'] = $numOfPlayers;//It works until here
      }
    ?>
    <html>
    <body>
      <!--Code-->
      <script src="Script.js"></script>
    </body>
    </html>

PHP `$_SESSION` is unrelated to browser `sessionStorage` - the only thing they have in common is the word session — Jaromanda X, Jun 21 '21 at 12:16
`sessionStorage` != `$_SESSION`. I think you've got your concepts / tools mixed up. — ADyson, Jun 21 '21 at 12:19
What @JaromandaX just said, the browser's sessionStorage and PHP's session are two different things. You'll have to share the information you want (by printing a js script block via PHP, a js readable cookie, etc). — nitrin0, Jun 21 '21 at 12:19
Does this answer your question? [How to connect between the sessionStorage in PHP to JS](https://stackoverflow.com/questions/45211303/how-to-connect-between-the-sessionstorage-in-php-to-js) — Nico Haase, Jun 22 '21 at 15:26

Woodrow · Answer 1 · 2021-06-22T16:02:48.420

Welcome to SO! As some of the other answers have already stated, Browser sessionStorage that is accessible via JavaScript and other client scripting languages, is not the same as PHP $_SESSION storage accessible on the server side. When should I use PHP Session vs Browser Local Storage vs JavaScript Object Parameters?

However, here is an example that would take the PHP session variable value of $_SESSION['numOfPlayers']; and set that as a JavaScript variable numOfPlayersPHPSession, that in turn could be set into client session storage (this won't work on SO or most online tools as session/local storage is typically locked down, but you should be able to test locally assuming proper permissions/config).

Also, this is a loose example, so you would still need to make sure and follow best security practices when rendering PHP values into JS variables to be used in client side scripting, etc.

<?php
  session_start();
?>
<!DOCTYPE html>
<?php
  if ($_SERVER['REQUEST_METHOD'] == 'POST') {
    // Use null coalesce to make sure we set a value / 0 if no players
    $numOfPlayers = $_POST['numOfPlayers'] ?? 0;
    $_SESSION['numOfPlayers'] = $numOfPlayers; //It works until here
  }
?>
<html>
    <body>
        <!--Code-->
        <!--<script src="Script.js"></script>-->
        <script type="text/javascript">
            // In place of calling Script.js, embedding code here for example
            let numOfPlayersPHPSession = <?php echo $_SESSION['numOfPlayers']; ?>;
            sessionStorage.setItem('numOfPlayers', numOfPlayersPHPSession);
            let numOfPlayers = Number(sessionStorage.getItem('numOfPlayers'));
            // alert(numOfPlayers); or console.log(numOfPlayers);
        </script>
    </body>
</html>

If you go to the example at the below link and click "Execute code" (which has some of the $_SESSION / $_POST logic commented out due to sandbox limitations), you will see that the value of 5 is set on a JS variable coming from the PHP session value, and then that could be set into sessionStorage. http://sandbox.onlinephpfunctions.com/code/285dbdec5446316c712dd49f895039eec8c4c915

Another item of note, if using client sessionStorage, you may want to add additional checks to your JS logic to ensure the browser window / application supports I/O with local/session storage, as outlined here: Most elegant way to check sessionStorage support?

score 0 · Answer 2 · edited Jun 22 '21 at 14:12

0

sessionStorage uses client-side storage and PHP $_SESSION is stored on server-side.
You can access this value to sending AJAX request to server to get the session value from server-side

edited Jun 22 '21 at 14:12

shaedrich

5,457
3
26
42

answered Jun 21 '21 at 12:53

Hamza Zee Khan

1
3

javascript sessionStorage doesn't get element, set in PHP

2 Answers2