为什么JavaScript仅在IE中打开开发人员工具一次后才能工作？

IE9错误-JavaScript仅在打开开发人员工具一次后才能工作。

我们的网站为用户提供免费的pdf下载，并且具有简单的“输入密码下载”功能。 但是，它根本无法在Internet Explorer中使用。

在此示例中，您可以自己看到。

下载通行证为“ makeuseof”。 在任何其他浏览器中，它都能正常工作。 在IE中，两个按钮都不起作用。

我发现的最奇怪的事情是，如果使用F12打开和关闭开发人员工具栏，所有这些都会突然开始工作。

我们已经尝试了兼容模式，因此没有任何区别。

如何在Internet Explorer中进行这项工作？

---

#1楼

我想这可能会有所帮助，将其添加到任何javascript标签之前：

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

---

#2楼

在对它进行了较小的更改后，这解决了我的问题。 我在html页面中添加了以下内容，以解决IE9问题：

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

---

#3楼

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页面上找到。

---

#4楼

除了公认的答案和其他提到的“ console ”使用问题之外，至少还有另一个原因有时导致Internet Explorer中的页面仅在激活开发人员工具的情况下才能工作。

启用开发人员工具后，IE不会像在正常模式下那样真正使用其HTTP缓存（至少在IE 11中默认情况下）。

这意味着，如果您的站点或页面有缓存问题（例如，如果它缓存的缓存超过了应有的数量，例如我的情况），则在F12模式下您将不会看到该问题。 因此，如果JavaScript执行某些缓存的AJAX请求，则它们可能无法在正常模式下按预期工作，并且在F12模式下可以正常工作。

---

#5楼

对于runeks和todotresde提供的解决方案，我还有另一种选择，它还避免了对Spudley答案的评论中讨论的陷阱：

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

它有点sc，但是另一方面，它简洁明了，涵盖了runeks答案中涵盖的所有日志记录方法，并且它具有巨大的优势，您可以随时打开IE的控制台窗口，并且日志会流入。

---

#6楼

除了console.log问题（至少在IE11中），这还有另一个可能的原因：

如果未打开控制台，则IE会进行积极的缓存，因此请确保将任何$.ajax调用或XMLHttpRequest调用的缓存设置为false。

例如：

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

打开开发人员控制台后，缓存的积极性就会降低。 似乎是一个错误（或者是一个功能？）

---

#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+ 没有任何内置日志服务 。

---

#8楼

对我来说，它发生在IE 11中。 我正在调用jquery .load函数。 因此，我采用了旧的方式，并在url中添加了一些内容以禁用缓存。

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

---

#9楼

如果使用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 。

---

#10楼

我们在Windows 7和Windows 10的IE 11上遇到了这个问题。我们通过打开IE的调试功能（IE> Internet选项>高级选项卡>浏览>取消选中禁用脚本调试（Internet Explorer） ）发现了问题所在。 域管理员通常在我们的环境中选中此功能。

问题是因为我们在JavaScript代码中使用console.debug(...)方法。 开发人员（我）所做的假设是，如果客户端开发人员工具控制台未显式打开，我不希望编写任何内容。 尽管Chrome和Firefox似乎同意这一策略，但IE 11一点也不喜欢它。 通过将所有console.debug(...)语句更改为console.log(...)语句，我们能够继续在客户端控制台中记录其他信息，并在打开时查看该信息，否则将其隐藏来自典型用户。

---

#11楼

我提出解决方案并解决了我的问题。 我放入JavaScript的AJAX请求似乎没有处理，因为我的页面存在缓存问题。 如果您的站点或页面存在缓存问题，则在Developers / F12模式下不会看到该问题。 我的缓存JavaScript AJAX请求它​​可能无法按预期运行，并导致执行中断，F12完全没有问题。 因此，只需添加新参数即可使缓存为假。

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

看起来IE特别需要将此字段设置为false，以便AJAX和javascript活动运行良好。

---

#12楼

听起来您的javascript中可能有一些调试代码。

您所描述的体验是包含console.log()或任何其他console功能的典型代码。

仅在打开“开发工具栏”时激活console对象。 在此之前，调用控制台对象将导致其报告为undefined 。 打开工具栏后，控制台将存在（即使随后关闭了工具栏），因此您的控制台调用也将起作用。

有一些解决方案：

最明显的方法是遍历代码，删除对console引用。 无论如何，您都不应该在生产代码中留下类似的内容。

如果要保留控制台引用，则可以将它们包装在if()语句中，也可以将其包装在尝试调用控制台对象之前检查控制台对象是否存在的其他条件。