支持 JavaScript 的检查例程适用于 Chrome/Opera/IE，但不适用于 Firefox/Safari

JavaScript-enabled checking routine works on Chrome/Opera/IE but not Firefox/Safari

本文关键字：适用于 不适用 Safari Firefox IE 支持 检查 例程 Chrome JavaScript Opera      更新时间：2023-09-26

我写了一个简短的例程来检查浏览器上是否启用了JavaScript。

它适用于Chrome，Opera和IE11。它不适用于火狐或野生动物园;在这些浏览器上，它会导致无限刷新循环。我想了解为什么它在Firefox和Safari上失败，以及如何让它在这些浏览器上运行。

我已将其缩减为 4 个单独的 php 文件，如下所示，您可以复制并运行这些文件。运气好的话，你会得到和我在Chrome、Opera和IE上一样的成功，在Firefox和Safari上也会得到同样的失败。

简而言之：index.php进行用纯JavaScript编写的AJAX调用（即不需要JQuery）。默认情况下，首先，false.php被复制到 body_message.php ，稍后作为其<body>消息包含在index.php中。如果在浏览器中启用了 JavaScript，则 <script> 部分调用 ajax_copy_file.php ，这反过来会用 true.php 覆盖body_message.php。结果是index.php将显示一条短消息，指示浏览器上是否启用了 JavaScript。

JavaScript 被缩小了，但运气好的话，看到完整的例程是没有必要的（即使在缩小中也可以获得主 jist）。

这是索引.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>

这是ajax_copy_file.php：

<?php
session_start();
copy($_POST['copy_file'], 'body_message.php');
$_SESSION['JavaScript'] = 'true';
echo 0;
exit;
?>

这是真的.php：

<p>TRUE: JavaScript enabled</p>

这是错误的.php：

<p>FALSE: JavaScript disabled</p>

为什么这在Chrome，Opera和IE上有效，但在Firefox和Safari上不起作用（导致无限循环）？

问题是您的location.replace("index.php")代码是在您使用 ajax.post 发送 XHR 后放置的，但 XHR 请求是异步的，因此您在复制 true.php/false.php 文件之前被重定向回去。我猜这是与Firefox和Safari隔离的，因为其他浏览器要么对XHR进行了大量优化，要么只是出于性能原因延迟了location.replace。如果你把location.replace放在 XHR readystate 事件处理程序或成功函数中，它可以在 Firefox 中工作。请参阅更新的 jsFiddle：

https://jsfiddle.net/j5qpwy9f/1/

附加说明：

  • 您的对象序列化方法略有不正确;在运行encodeURIComponent后，将所有%20替换为 + ，因为这是规范。
  • 我假设这不是最终代码或生产代码，但请坚持<noscript>。您的方法存在许多缺陷，其中至少它使用AJAX，会话，cookie，PHP，JS，3个HTTP连接和重定向来加载单个页面。

使用<noscript>标记，以便仅在禁用 JavaScript 时解析 HTML。

<noscript>
    <style>
        #jsOnly {
            display: none;
        }
    </style>
</noscript>
<noscript>JavaScript is disabled</noscript>
<p id="jsOnly">JavaScript is enabled</p>

https://developer.mozilla.org/en/docs/Web/HTML/Element/noscript

如果你想要一个例子，请查看 http://enable-javascript.com/及其来源。

相关文章：