php - JavaScript-enabled checking routine works on Chrome/Opera/IE but not Firefox/Safari -
i've written short routine check whether javascript enabled on browser.
it works on chrome, opera, , ie11. not work on firefox or safari; on browsers causes infinite refresh loop. want understand why it's failing on firefox , safari, , how make work on browsers.
i've whittled down 4 separate php files, provided below, may copy , run. luck, you'll same success have had on chrome, opera, , ie, , same failure on firefox , safari.
in brief: index.php
makes ajax call written in pure javascript (i.e., no jquery needed). default, , firstly, false.php
copied body_message.php
, later included in index.php
<body>
message. if javascript enabled in browser, <script>
section calls ajax_copy_file.php
, in turn overwrite body_message.php
true.php
. result index.php
display short message indicating whether javascript enabled on browser.
the javascript minified, luck, seeing full routine not necessary (even in minification main jist can gotten).
this index.php:
<?php session_start(); ?> <!doctype html> <head> <title>javascript test</title> <?php if (!isset($_session['javascript'])) { copy('false.php', 'body_message.php'); ?> <script>var ajax={},hasax=window.hasownproperty("activexobject");ajax.x=function(){if(hasax){for(var a="msxml2.xmlhttp.6.0 msxml2.xmlhttp.5.0 msxml2.xmlhttp.4.0 msxml2.xmlhttp.3.0 msxml2.xmlhttp.2.0 microsoft.xmlhttp".split(" "),b,c=0;c<a.length;){try{b=new activexobject(a[c]);break}catch(f){alert(f)}c+=1}return b}return new xmlhttprequest};ajax.send=function(a,b,c,f,d){void 0===d&&(d=!0);var e=ajax.x();e.open(c,a,d);e.onreadystatechange=function(){4===e.readystate&&b(e.responsetext)};"post"===c&&e.setrequestheader("content-type","application/x-www-form-urlencoded");e.send(f)};ajax.post=function(a,b,c,f){var d=[];object.keys(b).foreach(function(a){d.push(encodeuricomponent(a)+"="+encodeuricomponent(b[a]))});ajax.send(a,c,"post",d.join("&"),f)};function logstuff(a){"string"===typeof a?console.log(a):"object"===typeof a&&object.keys(a).foreach(function(b){console.log(b+": "+a[b])})}ajax.post("ajax_copy_file.php",{copy_file:"true.php"},logstuff,!0);location.replace("index.php");</script> <?php } ?> </head> <body> <?php unset($_session['javascript']); include('body_message.php'); ?> </body> </html>
this ajax_copy_file.php:
<?php session_start(); copy($_post['copy_file'], 'body_message.php'); $_session['javascript'] = 'true'; echo 0; exit; ?>
this true.php:
<p>true: javascript enabled</p>
this false.php:
<p>false: javascript disabled</p>
why work on chrome, opera, , ie, not work (causing infinite loop) on firefox , safari?
the problem location.replace("index.php")
code placed after send xhr using ajax.post
, xhr requests asynchronous, redirected before true.php
/false.php
file has been copied. i'm guessing isolated firefox , safari because other browsers either have heavy optimisations xhr or delay location.replace
performance reasons. if put location.replace
inside xhr readystate
event handler or success function, works in firefox. see updated jsfiddle:
https://jsfiddle.net/j5qpwy9f/1/
additional notes:
- your object serialisation method incorrect; after running through
encodeuricomponent
, replace%20
+
, spec. - i'm assuming isn't final or production code please stick
<noscript>
. there many flaws approach, least of uses ajax, sessions, cookies, php, js, 3 http connections , redirect load single page.
use <noscript>
tags html parsed when javascript disabled.
<noscript> <style> #jsonly { display: none; } </style> </noscript> <noscript>javascript disabled</noscript> <p id="jsonly">javascript enabled</p>
https://developer.mozilla.org/en/docs/web/html/element/noscript
if want example, @ http://enable-javascript.com/ , source.
Comments
Post a Comment