Cosa è successo a console.log in IE8?

Secondo questo post era in beta, ma non è in versione?

Ancora meglio per il fallback è questo:

   var alertFallback = true;
   if (typeof console === "undefined" || typeof console.log === "undefined") {
     console = {};
     if (alertFallback) {
         console.log = function(msg) {
              alert(msg);
         };
     } else {
         console.log = function() {};
     }
   }

console.log è disponibile solo dopo aver aperto gli Strumenti per sviluppatori (F12 per aprirlo e chiuderlo). La cosa divertente è che dopo averlo aperto, puoi chiuderlo, quindi inviarlo tramite chiamate console.log e questi verranno visualizzati quando lo riapri. Sto pensando che sia un tipo di errore, e potrebbe essere risolto, ma vedremo.

Probabilmente userò solo qualcosa del genere:

function trace(s) {
  if ('console' in self && 'log' in console) console.log(s)
  // the line below you might want to comment out, so it dies silent
  // but nice for seeing when the console is available or not.
  else alert(s)
}

e ancora più semplice:

function trace(s) {
  try { console.log(s) } catch (e) { alert(s) }
}

Questa è la mia opinione sulle varie risposte. Volevo davvero vedere i messaggi registrati, anche se non avevo la console IE aperta quando venivano licenziati, quindi li spingo in un console.messagesarray che creo. Ho anche aggiunto una funzione console.dump()per facilitare la visualizzazione dell'intero registro. console.clear()svuota la coda dei messaggi.

Questa soluzione "gestisce" anche gli altri metodi della console (che credo provengano tutti dall'API della console Firebug )

Infine, questa soluzione è sotto forma di IIFE , quindi non inquina l'ambito globale. L'argomento della funzione di fallback è definito nella parte inferiore del codice.

Lo lascio cadere nel mio file JS principale che è incluso in ogni pagina e me ne dimentico.

(function (fallback) {    

    fallback = fallback || function () { };

    // function to trap most of the console functions from the FireBug Console API. 
    var trap = function () {
        // create an Array from the arguments Object           
        var args = Array.prototype.slice.call(arguments);
        // console.raw captures the raw args, without converting toString
        console.raw.push(args);
        var message = args.join(' ');
        console.messages.push(message);
        fallback(message);
    };

    // redefine console
    if (typeof console === 'undefined') {
        console = {
            messages: [],
            raw: [],
            dump: function() { return console.messages.join('\n'); },
            log: trap,
            debug: trap,
            info: trap,
            warn: trap,
            error: trap,
            assert: trap,
            clear: function() { 
                  console.messages.length = 0; 
                  console.raw.length = 0 ;
            },
            dir: trap,
            dirxml: trap,
            trace: trap,
            group: trap,
            groupCollapsed: trap,
            groupEnd: trap,
            time: trap,
            timeEnd: trap,
            timeStamp: trap,
            profile: trap,
            profileEnd: trap,
            count: trap,
            exception: trap,
            table: trap
        };
    }

})(null); // to define a fallback function, replace null with the name of the function (ex: alert)

Alcune informazioni extra

La linea var args = Array.prototype.slice.call(arguments);crea una matrice dall'oggetto arguments. Ciò è necessario perché gli argomenti non sono realmente una matrice .

trap()è un gestore predefinito per una qualsiasi delle funzioni API. Passo gli argomenti in messagemodo da ottenere un registro degli argomenti che sono stati passati a qualsiasi chiamata API (non solo console.log).

modificare

Ho aggiunto un array extra console.rawche cattura gli argomenti esattamente come passati trap(). Mi sono reso conto che args.join(' ')stava convertendo oggetti nella stringa "[object Object]"che a volte potrebbe essere indesiderabile. Grazie bfontaine per il suggerimento .

Vale la pena notare che console.login IE8 non è una vera funzione Javascript. Non supporta i metodi applyo call.

Supponendo che non ti interessi un fallback per avvisare, ecco un modo ancora più conciso per ovviare alle carenze di Internet Explorer:

var console=console||{"log":function(){}};

Mi piace molto l'approccio pubblicato da "orange80". È elegante perché puoi impostarlo una volta e dimenticarlo.

Gli altri approcci richiedono che tu faccia qualcosa di diverso (chiama console.log()ogni volta qualcosa di diverso dal semplice ), che è solo per chiedere problemi ... So che alla fine dimenticherei.

Ho fatto un ulteriore passo avanti, avvolgendo il codice in una funzione di utilità che puoi chiamare una volta all'inizio del tuo javascript, ovunque fintanto che è prima di qualsiasi registrazione. (Lo sto installando nel prodotto del router di dati degli eventi della mia azienda. Aiuterà a semplificare la progettazione cross-browser della sua nuova interfaccia di amministrazione.)

/**
 * Call once at beginning to ensure your app can safely call console.log() and
 * console.dir(), even on browsers that don't support it.  You may not get useful
 * logging on those browers, but at least you won't generate errors.
 * 
 * @param  alertFallback - if 'true', all logs become alerts, if necessary. 
 *   (not usually suitable for production)
 */
function fixConsole(alertFallback)
{    
    if (typeof console === "undefined")
    {
        console = {}; // define it if it doesn't exist already
    }
    if (typeof console.log === "undefined") 
    {
        if (alertFallback) { console.log = function(msg) { alert(msg); }; } 
        else { console.log = function() {}; }
    }
    if (typeof console.dir === "undefined") 
    {
        if (alertFallback) 
        { 
            // THIS COULD BE IMPROVED… maybe list all the object properties?
            console.dir = function(obj) { alert("DIR: "+obj); }; 
        }
        else { console.dir = function() {}; }
    }
}

Se ottieni "undefined" per tutte le tue chiamate console.log, probabilmente significa che hai ancora un vecchio firebuglite caricato (firebug.js). Sostituirà tutte le funzioni valide di console.log di IE8 anche se esistono. Questo è quello che mi è successo comunque.

Verificare la presenza di altro codice che sovrascrive l'oggetto console.

La migliore soluzione per qualsiasi browser privo di console è:

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

Ci sono così tante risposte. La mia soluzione per questo era:

globalNamespace.globalArray = new Array();
if (typeof console === "undefined" || typeof console.log === "undefined") {
    console = {};
    console.log = function(message) {globalNamespace.globalArray.push(message)};   
}

In breve, se console.log non esiste (o in questo caso non è aperto), archiviare il registro in una matrice di spazi dei nomi globale. In questo modo, non sei infastidito da milioni di avvisi e puoi comunque visualizzare i tuoi registri con la console per sviluppatori aperta o chiusa.

if (window.console && 'function' === typeof window.console.log) {
    window.console.log (o);
}

Ecco il mio "IE, per favore, non andare in crash"

typeof console=="undefined"&&(console={});typeof console.log=="undefined"&&(console.log=function(){});

Ho trovato questo su Github :

// usage: log('inside coolFunc', this, arguments);
// paulirish.com/2009/log-a-lightweight-wrapper-for-consolelog/
window.log = function f() {
    log.history = log.history || [];
    log.history.push(arguments);
    if (this.console) {
        var args = arguments,
            newarr;
        args.callee = args.callee.caller;
        newarr = [].slice.call(args);
        if (typeof console.log === 'object') log.apply.call(console.log, console, newarr);
        else console.log.apply(console, newarr);
    }
};

// make it safe to use console.log always
(function(a) {
    function b() {}
    for (var c = "assert,count,debug,dir,dirxml,error,exception,group,groupCollapsed,groupEnd,info,log,markTimeline,profile,profileEnd,time,timeEnd,trace,warn".split(","), d; !! (d = c.pop());) {
        a[d] = a[d] || b;
    }
})(function() {
    try {
        console.log();
        return window.console;
    } catch(a) {
        return (window.console = {});
    }
} ());

Sto usando l'approccio di Walter dall'alto (vedi: https://stackoverflow.com/a/14246240/3076102 )

Mescolo una soluzione che ho trovato qui https://stackoverflow.com/a/7967670 per mostrare correttamente gli oggetti.

Ciò significa che la funzione trap diventa:

function trap(){
    if(debugging){
        // create an Array from the arguments Object           
        var args = Array.prototype.slice.call(arguments);
        // console.raw captures the raw args, without converting toString
        console.raw.push(args);
        var index;
        for (index = 0; index < args.length; ++index) {
            //fix for objects
            if(typeof args[index] === 'object'){ 
                args[index] = JSON.stringify(args[index],null,'\t').replace(/\n/g,'<br>').replace(/\t/g,'&nbsp;&nbsp;&nbsp;');
            }
        }
        var message = args.join(' ');
        console.messages.push(message);
        // instead of a fallback function we use the next few lines to output logs
        // at the bottom of the page with jQuery
        if($){
            if($('#_console_log').length == 0) $('body').append($('<div />').attr('id', '_console_log'));
            $('#_console_log').append(message).append($('<br />'));
        }
    }
} 

Spero che questo sia utile:-)

Funziona in IE8. Apri gli strumenti di sviluppo di IE8 premendo F12.

>>console.log('test')
LOG: test

Mi piace questo metodo (usando pronto il documento di jquery) ... ti permette di usare la console anche in ie ... l'unico problema è che devi ricaricare la pagina se apri gli strumenti di sviluppo di ie dopo il caricamento della pagina ...

potrebbe essere più semplice tenendo conto di tutte le funzioni, ma utilizzo solo il registro, quindi è quello che faccio.

//one last double check against stray console.logs
$(document).ready(function (){
    try {
        console.log('testing for console in itcutils');
    } catch (e) {
        window.console = new (function (){ this.log = function (val) {
            //do nothing
        }})();
    }
});

Ecco una versione che accederà alla console quando gli strumenti di sviluppo sono aperti e non quando sono chiusi.

(function(window) {

   var console = {};
   console.log = function() {
      if (window.console && (typeof window.console.log === 'function' || typeof window.console.log === 'object')) {
         window.console.log.apply(window, arguments);
      }
   }

   // Rest of your application here

})(window)

Crea la tua console in html .... ;-) Questo può essere impresso ma puoi iniziare con:

if (typeof console == "undefined" || typeof console.log === "undefined") {
    var oDiv=document.createElement("div");
    var attr = document.createAttribute('id'); attr.value = 'html-console';
    oDiv.setAttributeNode(attr);


    var style= document.createAttribute('style');
    style.value = "overflow: auto; color: red; position: fixed; bottom:0; background-color: black; height: 200px; width: 100%; filter: alpha(opacity=80);";
    oDiv.setAttributeNode(style);

    var t = document.createElement("h3");
    var tcontent = document.createTextNode('console');
    t.appendChild(tcontent);
    oDiv.appendChild(t);

    document.body.appendChild(oDiv);
    var htmlConsole = document.getElementById('html-console');
    window.console = {
        log: function(message) {
            var p = document.createElement("p");
            var content = document.createTextNode(message.toString());
            p.appendChild(content);
            htmlConsole.appendChild(p);
        }
    };
}