How to retrieve PHP $_GET using JavaScript?

Question

I have an app running on localhost/index.php
In Javascript I use a History API: history.replaceState({}, null, "?uid=" + uid); to change the URL of my page (uid is a variable with randomly generated value). After this manipulations address was updated to localhost/index.php?uid=dqw12312aws, for example.
Then I try to receive a uid variable on server side by: console.log('<?php echo "$_GET[uid]"; ?>');. But I obtain an unexpected value.
My first request to localhost/index.php?uid=dqw12312av - $_GET[uid] will be an empty string.
But my second request to localhost/index.php?uid=qwtgas23123 for example - $GET[uid] will be a value of my first request and equal dqw12312aws and so on. Why is this happening?

Answer 1

You are using console.log('<?php echo $_GET["uid"]; ?>'); in javascript, correct?. Javascript is not on the server side. Javascript get interpreted by the browser. The PHP is interpreted by the server, I.E. PHP is server side. Server side means that the code only gets interpreted when the server side-file is run by the server. (I.E. when the page is loaded).

When you load the PHP file you basically ask the server to go into the file, find any PHP and execute it.

This means, in this case, that $_GET['uid'] will contain the uid url-param that was set when the page was loaded. So

$_GET['uid'] will not change when the URL is changed dynamically via javascript. Because:
The page isn't refreshed → The PHP file does not run → PHP code doesn't get evaluated again.

---

You could solve this by retrieving the URL-query string by using javascript.
E.G.

function getUrlVar(requestedKey) {
    var hash;
    var hashes = window.location.href.slice(window.location.href.indexOf('?') + 1).split('&');
    for (var i = 0; i < hashes.length; i++) {
        hash = hashes[i].split('=');
        var key = hash[0],
            val = hash[1];
        if (key === requestedKey) {
            return val;
        }
    }
    return false;
}
var uid = getUrlVar("uid");

If you have this URL in the browser: http://localhost/index.php?uid=1234 Then the uid variable in the code above contains 1234

JS Function source

---

In a comment below you asked me how to send a get variable to PHP.

To run a PHP-script without refreshing the page, you could use dynamic requests. E.G. ajax.
If you are new to web-scripting and javascript, I recommend you take a look at jQuery and jQuery.ajax

So you would include jQuery in your index.php and run this JS code:

function getUrlVar(requestedKey) {
    var hash;
    var hashes = window.location.href.slice(window.location.href.indexOf('?') + 1).split('&');
    for (var i = 0; i < hashes.length; i++) {
        hash = hashes[i].split('=');
        var key = hash[0],
            val = hash[1];
        if (key === requestedKey) {
            return val;
        }
    }
    return false;
}

function sendUidToPHP(){
    $.post("receiver.php", {uid: getUrlVar("uid")}, function(data){
        // The data argument now contains the response from php
        // To learn more about this see http://api.jquery.com/jquery.ajax
        // and http://api.jquery.com/jquery.post
    });
}

The receiver.php would be able to read the uid from $_POST['uid'].

---

One more thing. If the uid URL-param is the only thing needed to log in to another user, then your script has a HUGE security flaw. Take a look at PHP-Cookies and PHP-Sessions