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

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

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

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

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

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

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

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

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

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

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

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

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

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

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.

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

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

Например:

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

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

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

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

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

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

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

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

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

Если вы используете 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+ не имеет встроенного сервиса журналов .

Если вы используете 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.

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

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

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

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

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

Мы столкнулись с этой проблемой в IE 11 в Windows 7 и Windows 10. Мы выяснили, в чем именно проблема, включив возможности отладки для IE (IE> Свойства обозревателя> вкладка «Дополнительно»> «Просмотр»> «Отключить» Отключить отладку сценариев (Internet Explorer) ). Эта функция обычно проверяется в нашей среде администраторами домена.

Проблема заключалась в том, что мы использовали console.debug(...)метод в нашем коде JavaScript. Предположение, сделанное разработчиком (мной), состояло в том, что я не хотел, чтобы что-то было написано, если клиентская консоль Developer Tools явно не была открыта. В то время как Chrome и Firefox, похоже, согласились с этой стратегией, IE 11 не понравился. Изменяя все console.debug(...)утверждения наconsole.log(...) операторы, мы смогли продолжать регистрировать дополнительную информацию в клиентской консоли и просматривать ее, когда она была открыта, но в противном случае скрыть ее от обычного пользователя.

Я ставлю разрешение и исправляю свою проблему. Похоже, что запрос AJAX, который я поместил в свой JavaScript, не обрабатывался, потому что на моей странице была проблема с кэшем. если у вашего сайта или страницы есть проблема с кэшированием, вы не увидите эту проблему в режиме разработчика / F12. мой кэшированный JavaScript AJAX запрашивает, что он может работать не так, как ожидалось, и приводить к прерыванию выполнения, что у F12 не вызывает никаких проблем. Так что просто добавили новый параметр, чтобы сделать кеш ложным.

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

Похоже, что IE определенно нужно, чтобы это было ложным, чтобы AJAX и javascript-активность работали хорошо.