¿Por qué JavaScript solo funciona después de abrir las herramientas de desarrollador en IE una vez?

Error de IE9: JavaScript solo funciona después de abrir las herramientas de desarrollador una vez.

Nuestro sitio ofrece descargas de pdf gratuitas a los usuarios, y tiene una función simple de "ingresar contraseña para descargar". Sin embargo, no funciona en absoluto en Internet Explorer.

Puedes verlo por ti mismo en este ejemplo .

El pase de descarga es "makeuseof". En cualquier otro navegador, funciona bien. En IE, ambos botones no hacen nada.

Lo más curioso que he encontrado es que si abres y cierras la barra de herramientas del desarrollador con F12, de repente todo comienza a funcionar.

Hemos probado el modo de compatibilidad y tal, nada hace la diferencia.

¿Cómo hago que esto funcione en Internet Explorer?

Parece que podría tener algún código de depuración en su javascript.

La experiencia que está describiendo es típica del código que contiene console.log()o cualquiera de las otras consolefunciones.

los console objeto solo se activa cuando se abre la barra de herramientas de desarrollo. Antes de eso, llamar al objeto de consola dará como resultado que se informe como undefined. Después de abrir la barra de herramientas, la consola existirá (incluso si la barra de herramientas se cierra posteriormente), por lo que las llamadas a la consola funcionarán.

Hay algunas soluciones a esto:

La más obvia es revisar su código eliminando referencias a console . No deberías dejar cosas así en el código de producción de todos modos.

Si desea mantener las referencias de la consola, puede envolverlas en una if()declaración o en algún otro condicional que verifique si el objeto de la consola existe antes de intentar llamarlo.

HTML5 Boilerplate tiene un buen código prefabricado para solucionar problemas de consola:

// Avoid `console` errors in browsers that lack a console.
(function() {
    var method;
    var noop = function () {};
    var methods = [
        'assert', 'clear', 'count', 'debug', 'dir', 'dirxml', 'error',
        'exception', 'group', 'groupCollapsed', 'groupEnd', 'info', 'log',
        'markTimeline', 'profile', 'profileEnd', 'table', 'time', 'timeEnd',
        'timeStamp', 'trace', 'warn'
    ];
    var length = methods.length;
    var console = (window.console = window.console || {});

    while (length--) {
        method = methods[length];

        // Only stub undefined methods.
        if (!console[method]) {
            console[method] = noop;
        }
    }
}());

Como @ plus señaló en los comentarios, la última versión está disponible en su página de GitHub

Aquí hay otra posible razón además del console.logproblema (al menos en IE11):

Cuando la consola no está abierta, IE realiza un almacenamiento en caché bastante agresivo, así que asegúrese de que cualquier $.ajaxllamada o XMLHttpRequestllamada tenga el almacenamiento en caché establecido en falso.

Por ejemplo:

$.ajax({cache: false, ...})

Cuando la consola del desarrollador está abierta, el almacenamiento en caché es menos agresivo. Parece ser un error (¿o tal vez una característica?)

Esto resolvió mi problema después de que le hice un cambio menor. Agregué lo siguiente en mi página html para solucionar el problema de IE9:

<script type="text/javascript">
    // IE9 fix
    if(!window.console) {
        var console = {
            log : function(){},
            warn : function(){},
            error : function(){},
            time : function(){},
            timeEnd : function(){}
        }
    }
</script>

Además del ' console' problema de uso mencionado en la respuesta aceptada y otras, hay al menos otra razón por la cual a veces las páginas en Internet Explorer funcionan solo con las herramientas de desarrollador activadas.

Cuando Developer Tools está habilitado, IE realmente no usa su caché HTTP (al menos por defecto en IE 11) como lo hace en modo normal.

Significa que si su sitio o página tiene un problema de almacenamiento en caché (si almacena más de lo que debería, por ejemplo, ese fue mi caso), no verá ese problema en el modo F12. Entonces, si javascript realiza algunas solicitudes AJAX almacenadas en caché, es posible que no funcionen como se esperaba en el modo normal y que funcionen bien en el modo F12.

Supongo que esto podría ayudar, agregando esto antes de cualquier etiqueta de javascript:

try{
  console
}catch(e){
   console={}; console.log = function(){};
}

Si está utilizando AngularJS versión 1.X, podría utilizar el servicio $ log en lugar de utilizar console.log directamente.

Servicio simple para iniciar sesión. La implementación predeterminada escribe de forma segura el mensaje en la consola del navegador (si está presente).

https://docs.angularjs.org/api/ng/service/$log

Entonces, si tienes algo similar a

angular.module('logExample', [])
  .controller('LogController', ['$scope', function($scope) {
    console.log('Hello World!');
 }]);

puedes reemplazarlo con

angular.module('logExample', [])
  .controller('LogController', ['$scope', '$log', function($scope, $log) {
    $log.log('Hello World!');
 }]);

Angular 2+ no tiene ningún servicio de registro incorporado .

Si está usando angulary es decir, 9, 10o edgeusa:

myModule.config(['$httpProvider', function($httpProvider) {
    //initialize get if not there
    if (!$httpProvider.defaults.headers.get) {
        $httpProvider.defaults.headers.get = {};    
    }    

    // Answer edited to include suggestions from comments
    // because previous version of code introduced browser-related errors

    //disable IE ajax request caching
    $httpProvider.defaults.headers.get['If-Modified-Since'] = 'Mon, 26 Jul 1997 05:00:00 GMT';
    // extra
    $httpProvider.defaults.headers.get['Cache-Control'] = 'no-cache';
    $httpProvider.defaults.headers.get['Pragma'] = 'no-cache';
}]);

Para desactivar por completo cache.

Sucedió en IE 11 para mí. Y estaba llamando a la función jquery .load. Así que lo hice a la antigua usanza y puse algo en la url para deshabilitar el almacenamiento en caché.

$("#divToReplaceHtml").load('@Url.Action("Action", "Controller")/' + @Model.ID + "?nocache=" + new Date().getTime());

Obtuve otra alternativa para las soluciones ofrecidas por runeks y todotresde que también evita las trampas discutidas en los comentarios a la respuesta de Spudley :

        try {
            console.log(message);
        } catch (e) {
        }

Es un poco desaliñado pero, por otro lado, es conciso y cubre todos los métodos de registro cubiertos en la respuesta de runeks y tiene la gran ventaja de que puede abrir la ventana de la consola de IE en cualquier momento y los registros vienen fluyendo.

Nos encontramos con este problema en IE 11 en Windows 7 y Windows 10. Descubrimos cuál era exactamente el problema al activar las capacidades de depuración para IE (IE> Opciones de Internet> pestaña Avanzado> Navegación> Desmarcar Desactivar depuración de scripts (Internet Explorer) ). Los administradores de dominio normalmente verifican esta característica en nuestro entorno.

El problema era porque estábamos usando el console.debug(...)método dentro de nuestro código JavaScript. La suposición hecha por el desarrollador (yo) era que no quería que se escribiera nada si la consola de Developer Tools del cliente no estaba abierta explícitamente. Si bien Chrome y Firefox parecían estar de acuerdo con esta estrategia, a IE 11 no le gustó nada. Al cambiar todas las console.debug(...)declaraciones por console.log(...)declaraciones, pudimos continuar registrando información adicional en la consola del cliente y verla cuando estaba abierta, pero de lo contrario mantenerla oculta para el usuario típico.

Puse la resolución y solucioné mi problema. Parece que la solicitud de AJAX que puse dentro de mi JavaScript no se estaba procesando porque mi página tenía algún problema de caché. si su sitio o página tiene un problema de almacenamiento en caché, no verá ese problema en el modo desarrolladores / F12. mi JavaScript AJAX en caché solicita que no funcione como se esperaba y que la ejecución se rompa, lo que F12 no tiene ningún problema. Así que solo agregué un nuevo parámetro para hacer que el caché sea falso.

$.ajax({
  cache: false,
});

Parece que IE necesita específicamente que esto sea falso para que la actividad de AJAX y JavaScript se ejecute bien.