Почему JavaScript работает только после однократного открытия инструментов разработчика в IE?

Question

Ошибка IE9 - JavaScript работает только после однократного открытия инструментов разработчика.

Наш сайт предлагает пользователям бесплатную загрузку в формате pdf и имеет простую функцию «введите пароль для загрузки». Однако это не работает вообще в Internet Explorer.

Вы можете сами убедиться в этом примере .

Пропуск загрузки "makeuseof". В любом другом браузере работает нормально. В IE обе ​​кнопки ничего не делают.

Самое любопытное, что я обнаружил, это то, что если вы открываете и закрываете панель инструментов разработчика с помощью F12, все это внезапно начинает работать.

Мы пробовали режим совместимости и ничего подобного.

Как мне заставить это работать в Internet Explorer?

Answer 1

Похоже, в вашем JavaScript есть какой-то отладочный код.

Опыт, который вы описываете, типичен для кода, который содержит console.log() или любую другую console функциональность.

Объект console активируется только при открытой панели инструментов разработчика. До этого вызов консольного объекта приведет к тому, что о нем будет сообщено как undefined. После того, как панель инструментов была открыта, консоль будет существовать (даже если панель инструментов впоследствии будет закрыта), поэтому ваши вызовы консоли будут работать.

Есть несколько решений для этого:

Самый очевидный способ - просмотреть код, удалив ссылки на console. В любом случае, вы не должны оставлять подобные вещи в рабочем коде.

Если вы хотите сохранить ссылки на консоль, вы можете заключить их в оператор if() или в другое условное выражение, которое проверяет, существует ли объект консоли, прежде чем пытаться его вызвать.

Answer 2

HTML5 Boilerplate имеет хороший готовый код для решения проблем с консолью:

// 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;
        }
    }
}());

Как отмечено в комментариях @ plus, последняя версия доступна на их странице GitHub

Answer 3

Вот еще одна возможная причина, кроме проблемы console.log (по крайней мере, в IE11):

Когда консоль не открыта, IE выполняет довольно агрессивное кэширование, поэтому убедитесь, что любые $.ajax вызовы или *Для вызовов 1005 * кэширование установлено на false.

Например:

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

Когда консоль разработчика открыта, кэширование менее агрессивно.Кажется, это ошибка (или, может быть, функция?)

Answer 4

Это решило мою проблему после того, как я внес в нее небольшие изменения.Я добавил следующее на своей html-странице, чтобы исправить проблему IE9:

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

Answer 5

Помимо проблемы использования 'console', упомянутой в принятом ответе и других, есть по крайней мере еще одна причина, по которой иногда страницы в Internet Explorer работают только с активированными инструментами разработчика.

Когда инструменты разработчика включеныIE на самом деле не использует свой HTTP-кеш (по крайней мере, по умолчанию в IE 11), как в обычном режиме.

Это означает, что у вашего сайта или страницы есть проблема с кэшированием (если он кеширует больше, чем ондолжен например - это был мой случай), вы не увидите эту проблему в режиме F12.Поэтому, если javascript выполняет некоторые кэшированные запросы AJAX, они могут работать не так, как ожидается в обычном режиме, и нормально работать в режиме F12.

Answer 6

Я думаю, это могло бы помочь, добавив это перед любым тегом javascript:

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

Answer 7

Если вы используете AngularJS версии 1.X, вы можете использовать службу $ log вместо непосредственного использования console.log.

Простой сервис для ведения журнала.Реализация по умолчанию безопасно записывает сообщение в консоль браузера (если имеется).

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

Так что если у вас есть что-то похожее на

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

, выможет заменить его на

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

Angular 2+ не имеет встроенной службы регистрации .

Answer 8

Если вы используете angular и т. Е. 9, 10 или edge, используйте:

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';
}]);

Для полного отключения cache.

Answer 9

Это случилось в IE 11 для меня.И я вызывал функцию jquery .load.Поэтому я сделал это по старинке и вставил что-то в URL, чтобы отключить кеширование.

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

Answer 10

Я получил еще одну альтернативу для решений, предлагаемых runeks и todotresde , что также позволяет избежать ошибок, обсуждаемых в комментариях к ответу Spudley :

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

Это немного неопрятно, но, с другой стороны, оно сжато и охватывает все методы ведения журнала, описанные в ответе runeks ', и имеет огромное преимущество, заключающееся в том, что вы можете открыть окно консоли:IE в любое время и логи поступают.