I'm wanting to move away from *.php extensions for my markup pages to essentially break my code down to having the front-end handle just the markup and some javascript stuff and having the back-end handle just my database transactions.
Traditionally all of my markup pages would have a *.php extension and then the authorization would occur at the top of the file in a php tag.
Because I am fine with requiring the user have Javascript enabled, the idea that I had was to create an HTML page that has a noscript that redirects to a "the website requires Javascript" page and alternatively a script that submits an AJAX request for authentication and redirects if there is valid authentication. Demonstrated with the following markup:
<html lang="en">
<head>
<title>Authentication Demo</title>
</head>
<body>
<noscript>
<meta http-equiv="refresh" content="0;url=noscript.html">
<p>Javascript is required for Authentication. If you are not automatically redirect, please go to this page: <a href="noscript.html">noscript.html</a></p>
</noscript>
<script>
function getParameterByName(name, url) {
if (!url) url = window.location.href;
name = name.replace(/[\[\]]/g, '\\$&');
var regex = new RegExp('[?&]' + name + '(=([^&#]*)|&|#|$)'),
results = regex.exec(url);
if (!results) return null;
if (!results[2]) return '';
return decodeURIComponent(results[2].replace(/\+/g, ' '));
}
function authenticateUser() {
var xmlhttp = new XMLHttpRequest();
xmlhttp.onreadystatechange = function() {
if (xmlhttp.readyState == XMLHttpRequest.DONE) {
if (xmlhttp.status == 200) {
return xmlhttp.responseText;
}
else {
return null;
}
}
};
xmlhttp.open("POST", "authenticate.php", true);
xmlhttp.send();
}
var redirect = getParameterByName('redirect');
if (this.authenticateUser === true) {
window.location = redirect;
}
</script>
</body>
</html>
This would require that I setup my navigation anchors to be formatted as such authenticate.html?redirect=going-to-webpage.html
My question is two-fold:
- What are the security implications of this?
- Aside from requiring Javascript (as mentioned I'm cool with this) what are some other downsides associated with this approach?
