developer tip

JS가있는 웹 사이트는 개발자 도구가 활성화 될 때까지 IE9에서 작동하지 않습니다.

copycodes 2020. 12. 9. 08:24
반응형

JS가있는 웹 사이트는 개발자 도구가 활성화 될 때까지 IE9에서 작동하지 않습니다.


저는 jQuery와 여러 스크립트를 많이 활용하는 복잡한 웹 사이트를 개발 중입니다. 사이트가로드되면 내 스크립팅이 작동하지 않습니다 (다른 스크립트가 제대로 작동하는지 확인할 수 있지만). 나는 한 가지를 제외하고 여기 SE에 그런 절름발이 질문을 게시하지 않을 것입니다.

내 문제를 디버깅 할 수 있도록 개발자 도구를 켜기 위해 F12 키를 누르는 즉시 모든 것이 완벽하게 작동합니다!

더 나쁜 것은 브라우저를 종료하고 시작하고 Dev Tools를 먼저 켜고 사이트를 방문하면 모든 것이 예상대로 작동합니다.

그래서 Dev Tools가 문제를 해결하기 때문에이 문제를 디버깅 할 수도 없습니다! 작업을 수행하기 위해 Dev Tools는 무엇을 할 수 있습니까? UA를 변경합니까 (jQuery.browser 감지를 수행합니다)? doctype에 뭔가를합니까?

편집하다

내 모든 콘솔 로깅은 다음 래퍼 유틸리티 함수로 래핑됩니다.

   function log(msg){
    if (console){
        console.log(msg);
    }
   }

내가 시도 할 수있는 모든 생각이나 제안은 환영 할 것입니다. 해결책을 찾으면 여기에 게시하겠습니다.


여기 파티에 꽤 늦었 어 고맙지 만 IE9에 대한 솔루션이 조금 다릅니다.

(function() {
    var temp_log = [];
    function log() {
        if (console && console.log) {
            for (var i = 0; i < temp_log.length; i++) {
                console.log.call(window, temp_log[i]);
            }
            console.log.call(window, arguments);
        } else {
            temp_log.push(arguments);
        }
    }
})();

기본적으로 대신 console.log사용 log. console.log존재하는 경우 정상적으로 작동하고, 그렇지 않으면 로그 항목을 배열에 저장하고 사용 가능한 다음 log위치 에 출력합니다 console.

console사용 가능한 즉시 데이터를 푸시하면 좋지만 사용자 정의 setInterval 리스너를 설정하는 것보다 비용이 저렴합니다.

업데이트 된 기능 (2012 년 10 월 1 일)

이 스크립트를 제 용도로 업데이트했으며 공유 할 것이라고 생각했습니다. 몇 가지 가치있는 개선 사항이 있습니다.

  • console.log()평소처럼 사용합니다 . 즉, 더 이상 비표준을 사용할 필요가 없습니다.log()
  • 여러 인수를 지원합니다. console.log('foo', 'bar')
  • console.error, console.warn사용할 수도 있습니다 console.info(하지만 console.log)
  • 스크립트는 console1000ms마다 네이티브를 확인하고 발견되면 버퍼를 출력합니다.

이러한 개선으로 IE9에서는 상당히 견고한 심이되었다고 생각합니다. 여기에서 GitHub 저장소를 확인하세요 .

if (!window.console) (function() {

    var __console, Console;

    Console = function() {
        var check = setInterval(function() {
            var f;
            if (window.console && console.log && !console.__buffer) {
                clearInterval(check);
                f = (Function.prototype.bind) ? Function.prototype.bind.call(console.log, console) : console.log;
                for (var i = 0; i < __console.__buffer.length; i++) f.apply(console, __console.__buffer[i]);
            }
        }, 1000); 

        function log() {
            this.__buffer.push(arguments);
        }

        this.log = log;
        this.error = log;
        this.warn = log;
        this.info = log;
        this.__buffer = [];
    };

    __console = window.console = new Console();
})();

콘솔 호출이 있습니다. IE에서는 개발 도구가 열려 있지 않으면 실패합니다. 간단한 수정은 모든 콘솔 호출을 다음과 같은 함수로 래핑하는 것입니다.

function log(msg) {
  if(console)
    console.log(msg);
}

나는 그것을 다음과 같은 방법으로 해킹했습니다.

<script type="text/javascript">
    (function () {
        if (typeof console == "undefined") {
            console = {
                log : function () {}
            }
        }
    })();
</script>

그리고 이것은.


대부분의 다른 솔루션은 훌륭하게 작동하지만 콘솔을 사용할 수없는 경우 로그 메시지를 포착하는 데 신경 쓰지 않는 경우 여기에 짧은 한 줄이 있습니다.

// Stub hack to prevent errors in IE
console = window.console || { log: function() {} };

This lets you still use the native console.log function directly still instead of wrapping it with anything or having a conditional each time.


I find it much more convenient to simply use console && console.log('foo', 'bar', 'baz') rather than use a wrapper function.

The code you provided:

function logError(msg){
  if (console) {
    console.log(msg);
  } else {
    throw new Error(msg);
  }
}

Will produce an error for IE when dev tools are closed because console will be undefined.


The console.log wrapper that I used was not sufficient to detect the console in IE9. Here's the wrapper that works from a related question on SE:

function logError(msg){
    try {
        console.log(msg);
    } catch (error) {
        throw new Error(msg);
    }
}

function log(msg){
    try {
        console.log(msg);
    } catch (error) { }
}

A proper test for the availability of the console object would be: if (typeof console === "undefined" || typeof console.log === "undefined")


If you have multiple parallel script files, maybe the files are being loaded/executed in a different order with developer tools on/off.


I have run into this issue many times. Basically with variables we do this to check if they are valid

var somevar;
if (somevar)
 //do code

this works because somevar will resolve to undefined. But if your checking a window property for example. window.console.

if (console) <---- this throws an exception

You cannot do the same check. The browser treats it differently. Basically only doing this

if (window.console) <---- will NOT throw an exception if undefined
//some code

this will work the same as the first example. So you need to change your code to

function log(msg){
 if (window.console){
     console.log(msg);
 }
}

참고URL : https://stackoverflow.com/questions/8095348/website-with-js-doesnt-work-in-ie9-until-the-developer-tools-is-activated

반응형