javascript - ¿Qué pasó con console.log en IE8?
logging internet-explorer-8 (17)
De acuerdo con este post , estaba en la versión beta, pero no está en el lanzamiento?
Aún mejor para el respaldo es esto:
var alertFallback = true;
if (typeof console === "undefined" || typeof console.log === "undefined") {
console = {};
if (alertFallback) {
console.log = function(msg) {
alert(msg);
};
} else {
console.log = function() {};
}
}
Aquí está mi "IE por favor, no se bloquee"
typeof console=="undefined"&&(console={});typeof console.log=="undefined"&&(console.log=function(){});
Aquí hay una versión que iniciará sesión en la consola cuando las herramientas del desarrollador estén abiertas y no cuando estén cerradas.
(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)
Encontré esto en 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 = {});
}
} ());
Esta es mi opinión sobre las diversas respuestas. Quería ver realmente los mensajes registrados, incluso si no tenía la consola de IE abierta cuando fueron disparados, por lo que los empujo en una matriz de mensajes de console.messages
que creo. También agregué una función console.dump()
para facilitar la visualización de todo el registro. console.clear()
la cola de mensajes.
Estas soluciones también "manejan" los otros métodos de la Consola (que creo que todos se originan en la API de la Consola Firebug )
Finalmente, esta solución tiene la forma de un IIFE , por lo que no contamina el alcance global. El argumento de la función de respaldo se define en la parte inferior del código.
Simplemente lo coloco en mi archivo maestro JS que se incluye en cada página y me olvido.
(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)
Alguna información extra
La línea var args = Array.prototype.slice.call(arguments);
crea una matriz a partir de los arguments
objeto. Esto es necesario porque los argumentos no son realmente una matriz .
trap()
es un controlador predeterminado para cualquiera de las funciones de la API. Paso los argumentos al message
para que obtenga un registro de los argumentos que se pasaron a cualquier llamada de API (no solo console.log
).
Editar
console.raw
una console.raw
matriz adicional. console.raw
que capture los argumentos exactamente como se pasaron a trap()
. Me di cuenta de que args.join('' '')
estaba convirtiendo objetos a la cadena "[object Object]"
que a veces puede ser indeseable. Gracias bfontaine por la suggestion .
Estoy utilizando el enfoque de Walter desde arriba (consulte: https://.com/a/14246240/3076102 )
Mezclo en una solución que encontré aquí https://.com/a/7967670 para mostrar objetos correctamente.
Esto significa que la función de trampa se convierte en:
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,'' '');
}
}
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 />''));
}
}
}
Espero que esto sea útil:-)
Funciona en IE8. Abre las herramientas de desarrollo de IE8 presionando F12.
>>console.log(''test'')
LOG: test
Haga su propia consola en html .... ;-) Esto se puede imprimir pero puede comenzar 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);
}
};
}
Hay tantas respuestas. Mi solución para esto fue:
globalNamespace.globalArray = new Array();
if (typeof console === "undefined" || typeof console.log === "undefined") {
console = {};
console.log = function(message) {globalNamespace.globalArray.push(message)};
}
En resumen, si console.log no existe (o, en este caso, no está abierto), almacene el registro en una matriz de espacio de nombres global. De esta manera, no está molesto con millones de alertas y aún puede ver sus registros con la consola de desarrollador abierta o cerrada.
La mejor solución para cualquier navegador que carezca de consola es:
// 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;
}
}
}());
Me gusta este método (usando la documentación de jquery preparada) ... te permite usar la consola incluso en ie ... solo se detecta que necesitas volver a cargar la página si abres las herramientas dev de ie después de que se cargue la página ...
podría ser más pulido al tener en cuenta todas las funciones, pero solo uso log, así que esto es lo que hago.
//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
}})();
}
});
Me gusta mucho el enfoque publicado por "orange80". Es elegante porque puedes configurarlo una vez y olvidarlo.
Los otros enfoques requieren que hagas algo diferente (llama a algo que no sea plain console.log()
cada vez), lo cual es solo pedir problemas ... Sé que eventualmente lo olvidaré.
He dado un paso más allá, envolviendo el código en una función de utilidad a la que puede llamar una vez al comienzo de su javascript, en cualquier lugar siempre que esté antes de cualquier registro. (Estoy instalando esto en el producto enrutador de datos de eventos de mi compañía. Esto ayudará a simplificar el diseño de su nueva interfaz de administrador en todos los navegadores).
/**
* 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() {}; }
}
}
Si obtiene "undefined" para todas sus llamadas de console.log, eso probablemente significa que todavía tiene un viejo firebuglite cargado (firebug.js). Anulará todas las funciones válidas de la consola.log de IE8 aunque existan. Esto es lo que me pasó a mí de todos modos.
Compruebe si hay otro código que anule el objeto de la consola.
Suponiendo que no le interese una alerta alternativa, aquí hay una manera aún más concisa de solucionar las deficiencias de Internet Explorer:
var console=console||{"log":function(){}};
Vale la pena señalar que console.log
en IE8 no es una verdadera función de Javascript. No es compatible con los métodos de apply
o call
.
console.log solo está disponible después de haber abierto las Herramientas de desarrollo (F12 para abrirlo y cerrarlo). Lo curioso es que después de haberlo abierto, puede cerrarlo y luego publicarlo a través de las llamadas de console.log, que se verán cuando lo vuelva a abrir. Estoy pensando que es una especie de error, y puede ser arreglado, pero ya veremos.
Probablemente solo use algo como esto:
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 incluso más simple:
function trace(s) {
try { console.log(s) } catch (e) { alert(s) }
}
if (window.console && ''function'' === typeof window.console.log) { window.console.log(o); }