javascript - identifica - noscript para que sirve
Detectando NoScript(no la etiqueta, la extensión) (8)
Parece que NoScript bloquea la carga de JavaScript en mi sitio y bloquea las superposiciones de inicio de sesión, que son muy importantes para el sitio.
¿Hay alguna manera de detectar la extensión NoScript y alertar a los usuarios?
Editado para agregar: parece que muchos de ustedes no me entendieron, o tal vez no estaba claro. No estoy hablando de la etiqueta <noscript>
, pero la extensión NoScript Firefox, ¿cómo puedo detectar si un usuario lo tiene instalado y / o habilitado?
Como el contenido de <noscript>
solo se muestra cuando JavaScript está desactivado, no puede usar una alerta (ya que es, bueno, JavaScript ). Si necesita llamar la atención sobre el hecho de que el sitio requiere JavaScript para funcionar correctamente, necesitará CSS.
Una posibilidad es pegar una etiqueta <link />
en el <noscript>
que carga un archivo CSS que contiene reglas para ocultar todo excepto el mensaje de error. Un ejemplo extremadamente simple (que solo usa una etiqueta incrustada <style>
):
<html>
<head>
<meta charset="utf-8" />
<title></title>
<link href="http://netdna.bootstrapcdn.com/bootstrap/3.0.3/css/bootstrap.min.css" type="text/css" rel="stylesheet" />
</head>
<body>
<div class="container">
<noscript>
<style>
.noscript { display:none; }
</style>
<div class="alert alert-danger">
<b>Sorry!</b> This site requires JavaScript. Please enable it in your browser.
</div>
</noscript>
<div class="noscript">
<p>
Lorem ipsum dolor sit amet, consectetur adipiscing elit. Mauris id blandit lacus. Nulla tempus ornare arcu vel iaculis. Duis sit amet interdum enim, sed molestie massa. Proin in leo nunc. Nullam justo felis, consectetur sit amet sapien ut, feugiat tincidunt arcu. Ut dignissim, nisl ut placerat interdum, odio nibh euismod ipsum, nec placerat est est tempor erat. Curabitur in ligula sed enim eleifend fermentum. Duis sit amet adipiscing eros. Mauris lacinia ut tortor sed accumsan.
</p>
<p>
Curabitur libero risus, sagittis sed urna ut, molestie fermentum enim. Donec fringilla pharetra neque sed ullamcorper. Phasellus ante lacus, rutrum eu ligula eu, mattis tempor metus. In tincidunt arcu non enim rutrum, at fringilla eros mattis. Nulla facilisi. Mauris eu elit id tellus ornare sollicitudin quis nec lacus. Curabitur aliquam porttitor enim, pretium vestibulum felis tristique id. Donec dictum congue turpis, sit amet dictum purus placerat quis.
</p>
<p>
Curabitur quis nulla consequat, adipiscing quam eget, vulputate nulla. Pellentesque elit ante, sagittis vitae magna id, adipiscing aliquet purus. Phasellus eros tellus, eleifend sit amet tellus vel, porta ultrices elit. Vestibulum tincidunt, ligula in gravida mattis, nulla mi blandit nulla, hendrerit sodales erat mauris sit amet nulla. Morbi congue imperdiet mi, vitae vulputate neque euismod a. Pellentesque consectetur, diam vel feugiat elementum, arcu enim faucibus risus, ut tempor leo magna sit amet augue. Donec justo nisi, lacinia et risus at, dapibus ultrices risus. In consequat felis id lectus dictum ornare. Proin egestas tortor urna, sed vehicula sapien gravida vitae.
</p>
</div>
</div>
</body>
</html>
Hasta donde yo sé, es imposible detectar la extensión NoScript específicamente. Supongo que desea mostrar mensajes personalizados a los usuarios que tienen NoScript y a los usuarios que simplemente tienen JavaScript deshabilitado, pero lamentablemente esto no es posible.
Una buena forma de manejar esto es mostrar algún tipo de mensaje de alerta en las etiquetas <noscript>
diciendo algo como "Debe habilitar JavaScript para usar este sitio".
Las personas que tienen instalado NoScript sabrán lo que eso significa y lo desactivarán en consecuencia.
NoScript bloqueará todo el JavaScript. Así que simplemente oculte el mensaje de advertencia con JS y si aún está presente, NoScript está habilitado (o JS generalmente está desactivado).
<html>
<head>
<title>test</test>
</head>
<body>
<div id="noscript">Warning! You have disabled JS or you''re using NoScript which will break this site! Please active JS or deactivate NoScript to continue.</div>
<div id="content">
...
</div>
<script type="text/javascript">
document.getElementById(''noscript'').style.display = ''none'';
</script>
</body>
</html>
- El usuario sin NoScript ingresa a su página -> se ejecuta el JS y el mensaje está oculto.
- El usuario con NoScript ingresa a su página -> el JS no se ejecuta y el mensaje no se ocultará.
Puede construir una página antes de su página normal con el siguiente código:
<html>
<head>
<meta http-equiv="refresh" content="3; URL=http://www.yourpage.com?javascript=false">
<script type="text/javascript">
location.href = "http://www.yourpage.com?javascript=true";
</script>
</head>
<body>
<span>Please wait while the page is loading ...</span>
<noscript>If nothing happens follow this <a href="http://www.yourpage.com?javascript=false">link</a>.</noscript>
</body>
</html>
Si el usuario tiene Javascript habilitado, será inmediatamente reenviado a http://www.yourpage.com?javascript=true
y usted sabe que tiene javascript habilitado.
Si Javascript está desactivado, el usuario será reenviado a http://www.yourpage.com?javascript=false
después de 3 segundos mediante la etiqueta meta http-equiv="refresh"
que funciona sin Javascript.
Como alternativa hay un enlace para los usuarios que tienen JavaScript y otros métodos de reenvío desactivados en su navegador.
Ahora tiene dos páginas separadas donde puede permitir que el usuario inicie sesión y trabaje con o sin Javacsript.
Notas:
- Esto no es específico para NoScript (funcionará de la misma manera cuando JavaScript esté desactivado por otros medios).
- Todos los usuarios tendrán un retraso al acceder a su página.
- Sus URL contienen el parámetro javascript que se ve feo. Puede usar dos páginas diferentes en lugar de una página con parámetros para ocultar esto.
Es por eso que NoScript se han creado para bloquear cualquier código de JavaScript en los sitios. Alert también funciona con js, por lo que necesita alguna solución para notificar a los usuarios. Simplemente puede diseñar una ventana de advertencia modal sin JS y eliminarla, si JS está habilitado.
HTML
<div id="js-disabled-warning">
<div class="message">
<p>You''re using this site with javascript disabled (set by manually or with a browser extension like NoScript)!</p>
<p>Javascript is essential for using this site. Please enable it!</p>
<p>Here you can get some help: <a href="http://www.enable-javascript.com" target="_blank">http://www.enable-javascript.com</a></p>
</div>
</div>
<div class="site-content">
<p>Here comes your site content!</p>
<p>Lorem ipsum dolor sit amet, consectetur adipisicing elit. Deleniti inventore velit sint aspernatur nemo quasi in officia doloribus dolores deserunt nostrum quas. Excepturi recusandae eum libero sint necessitatibus corporis id.</p>
</div>
CSS
#js-disabled-warning {
position: absolute;
top: 0;
left: 0;
right: 0;
bottom: 0;
margin: auto;
background: rgba(0,0,0,.5);
}
#js-disabled-warning .message {
position: absolute;
top: 0;
left: 0;
right: 0;
bottom: 0;
margin: auto;
display: table;
width: 30%;
background: #bada55;
padding: 20px;
border-radius: 5px;
}
Y JS para eliminar el mensaje
(function() {
var alert_modal = document.getElementById(''js-disabled-warning'');
alert_modal.parentNode.removeChild(alert_modal);
})();
Con el complemento habilitado, este script no se ejecutará y se mostrará su mensaje.
Aquí hay un violín para él: http://jsfiddle.net/X7q9F/
NOTA: He instalado la extensión NoScript de Firefox para probar esta solución y funciona correctamente.
Noscript es principalmente un complemento de seguridad, por lo que detectar o anular Noscript no es una opción.
Como no tiene Javascript en ese escenario, deberá confiar en el HTML / CSS estático para informar al usuario y luego usar javascript para eliminar la notificación.
<html>
<head>
<title>noscript detect</title>
</head>
<body>
<div id="noJavascript">
Your browser does not have javascript enabled. This site
requires javascript to operate properly. Please enable
javascript.
</div>
<script type="text/javascript">
var noJavascript = document.getElementById("noJavascript");
noJavascript.parentNode.removeChild(noJavascript);
</script>
</body>
</html>
Utilice un bloque <noscript>
en su HTML:
<noscript>
This site requires Javascript. Please enable Javascript in your browser for this site.
</noscript>
El método que he usado es el siguiente.
<head>
<style>
.noscript-error {
background-image: url(noscript.php)
}
</style>
<style>
@import url(chrome://noscript/skin/browser.css);
</style>
</head>
<body>
<div class="noscript-error">If noscript is NOT installed (and enabled) then Firefox will make a request for noscript.php.
</div>
</body>
Es bastante auto explicativo. Esto puede confirmar si NoScript no está en uso. Solo necesita hacer lo que elija en noscript.php para establecer algo en la sesión que diga NoScript está deshabilitado.
NOTA : En otros navegadores siempre se llamará a noscript.php
, esto no es un problema porque incluso si se usa otro navegador y llama a noscript.php, no usará NoScript ya que solo es para Firefox. Puede hacer su propia magia para evitar esta llamada si lo desea, pero el peor caso extremo en el que se está falsificando un agente de usuario seguirá teniendo un indicador preciso de si se está utilizando o no NoScript. Más información aquí
Además, si solo quiere saber si el servidor está habilitado o no, puede usar
<noscript>
<img src="noJS.php" alt="JavaScript is disabled" />
</noscript>
En noJS.php
puede escribir un script PHP para representar un solo píxel transparente (PNG o GIF) y dentro de ese script establecer una variable de sesión, o almacenar la información.