Overwrite session variable using ajax - php

Question

I have created an YouTube search engine that sends video id, title etc. using session. I have created buttons with unique ids for each of them, onclicking which a page is called via ajax and the session is generated using the unique id for that button.
The javascript code is like follows:
<script type="text/javascript">
function loadXMLSession(videoid, videotitle) {
var xmlhttp;
if (window.XMLHttpRequest) {// code for IE7+, Firefox, Chrome, Opera, Safari
xmlhttp = new XMLHttpRequest();
} else {// code for IE6, IE5
xmlhttp = new ActiveXObject("Microsoft.XMLHTTP");
}
xmlhttp.onreadystatechange = function() {
if (xmlhttp.readyState == 4 && xmlhttp.status == 200) {
document.getElementById("myDiv").innerHTML = xmlhttp.responseText;
}
}
xmlhttp.open("GET", "GenerateDownloadSession.php?videoid=" + videoid + "&videotitle=" + videotitle, true);
xmlhttp.send();
//strip off spaces and embed dashes - clean urls
var downloadtitle = videotitle;
downloadtitle = downloadtitle.toLowerCase();
downloadtitle = downloadtitle.replace("-"," ");//strip off dashes with spaces
downloadtitle = downloadtitle.replace(/ +(?= )/g,'');//replace multiple spaces with one space
downloadtitle = downloadtitle.replace(/[`~!##$%^&*()_|+\-=?;:'",.<>\{\}\[\]\\\/]/gi, '');//strip off all special characters from video title
downloadtitle = downloadtitle.replace(/ /g,"-");//replace spaces with dashes
downloadtitle = downloadtitle.replace(/-+$|(-)+/g, '$1');//replace multiple dashes with single dash
var url = window.location.hostname;
url = "/development"//only for development phase
url = url+"/download/"+downloadtitle+".html";
window.location=url;
}
</script>
The download buttons are coded as follows:
echo "<button id=\"downloadbtn\" class=\"btn\" value = \"" . $YouTubeVideoID . "\" onclick=\"loadXMLSession(this.value,'" . $VideoContent['6'] . "')\"><img src=\"" . $HostURLRedirect . "/img/Arrow-Down-icon.png\" alt=\"download\" /> Download</button> ";
The php page called by ajax has simple session creation:
session_start();
$videoid = $_GET['videoid'];
$videotitle = $_GET['videotitle'];
$_SESSION['DownloadID'] = $videoid;
$_SESSION['DownloadTitle'] = $videotitle;
$_SESSION['DownloadType'] = "Download";
The problem that I am having is, when I click on any of the download button for the first time after opening the browser, it is working well. But when I search again, it is returning the previous session values. I am calling the session function through ajax and passing values to it. And, it should overwrite the session values. But in this case, it is not overwriting the values. How can I overcome this issue? Any suggestions?

Answer 1

At
xmlhttp.open("GET", "GenerateDownloadSession.php?videoid=" + videoid + "&videotitle=" + videotitle, true);
xmlhttp.send();
you are doing an asynchronous Request, which means, that the javascript continues after sending the request, not waiting for it to complete. Most likely it will hit your redirect of your current page to the download before the call could change the Session data.
Solution 1.) Make the script synchronous by setting the last parameter to false.
Solution 2.) Move your forward logic into the onreadystatechange callback function.
on a side node: why using ajax for this? you could simple pass the parameters appended to the url when forwarding...?

Answer 2

Do you have the GET-Values set when requesting your Script?
Use your Firebug to check what is answered by the PHP-Script. (Network -> you will see the requested file being loaded when your Ajax Request is being started).

Answer 3

you should change the location of you page once you get the ajax response:
xmlhttp.onreadystatechange = function()
{
if (xmlhttp.readyState == 4 && xmlhttp.status == 200) {
document.getElementById("myDiv").innerHTML = xmlhttp.responseText;
var downloadtitle = videotitle;
downloadtitle = downloadtitle.toLowerCase();
downloadtitle = downloadtitle.replace("-"," ");//strip off dashes with spaces
downloadtitle = downloadtitle.replace(/ +(?= )/g,'');//replace multiple spaces with one space
downloadtitle = downloadtitle.replace(/[`~!##$%^&*()_|+\-=?;:'",.<>\{\}\[\]\\\/]/gi, '');//strip off all special characters from video title
downloadtitle = downloadtitle.replace(/ /g,"-");//replace spaces with dashes
downloadtitle = downloadtitle.replace(/-+$|(-)+/g, '$1');//replace multiple dashes with single dash
var url = window.location.hostname;
url = "/development"//only for development phase
url = url+"/download/"+downloadtitle+".html";
window.location=url;
}
}
But I most be honest, I dont see the point of using ajax and then changing the location of the actual page.
Maybe you should start the download in another window?