JavaScript: Jak wydrukować komunikat do konsoli błędów?


Odpowiedzi:


469

Zainstalować Firebug , a następnie można użyć console.log(...)i console.debug(...), itd. (Patrz dokumentację na więcej).


14
@Dan: WebKit Web Inspector obsługuje również interfejs API konsoli FireBug
olliej,

160
dlaczego jest to akceptowana odpowiedź? nie zapytał, jak napisać na konsoli Firebug, zapytał, jak napisać na konsoli błędów. nie bycie kutasem lub czymkolwiek, po prostu wskazanie tego.
matt lohkamp

127
+1. I z korzyścią dla każdego, kto teraz podejdzie do tego pytania, warto zauważyć, że odkąd pytanie zostało udzielone, wszystkie przeglądarki zaimplementowały teraz obiekt konsoli, więc console.log()itp. Powinny działać we wszystkich przeglądarkach, w tym IE. Jednak we wszystkich przypadkach musisz mieć otwarte okno debugera, w przeciwnym razie wywołania consolebędą generować błędy.
Spudley,

2
@andrewjackson, jak wspomniano wcześniej, console.log działa dobrze we wszystkich nowoczesnych przeglądarkach, w tym IE. Twój kod jest nadal w pełni poprawny i przydatny, jeśli zamierzasz obsługiwać starsze przeglądarki (a jeśli pracujesz na publicznej stronie internetowej, na pewno, jak powinieneś!), Jednak moja krytyka polega tylko na tym, że twój komentarz jest mylący / niedokładny.
BrainSlugs83

1
Z drugiej strony console.debug () nie istnieje w IE. Możemy obejść to za pomocą: if (! Console.debug) {console.debug = function (args) {console.log (args); }}
Rovanion

318
console.error(message); //gives you the red errormessage
console.log(message); //gives the default message
console.warn(message); //gives the warn message with the exclamation mark in front of it
console.info(message); //gives an info message with an 'i' in front of the message

Możesz także dodać CSS do swoich wiadomości logowania:

console.log('%c My message here', "background: blue; color: white; padding-left:10px;");


10
To jest poprawna odpowiedź. Słowo „błąd” nie jest nawet wspomniane w wybranej odpowiedzi, chociaż znajduje się w tytule pytania.
Ivan Durst,

3
Dodatkowy fragment związany z dodawaniem CSS jest całkiem fajny. +1!
sudo make install

@ORMapper Co tam nie działa? CSS, który zakładam?
Nicholas

2
W chwili, gdy to przeanalizujesz, przez te wszystkie lata używania console.logmożesz używać css wewnątrz konsoli: |
Red

86

Wyjątki są rejestrowane w konsoli JavaScript. Możesz go użyć, jeśli chcesz wyłączyć Firebug .

function log(msg) {
    setTimeout(function() {
        throw new Error(msg);
    }, 0);
}

Stosowanie:

log('Hello World');
log('another message');

8
W niektórych przeglądarkach, jeśli masz włączone debugowanie, spowoduje to wyświetlenie wyskakujących wiadomości.
BrainSlugs83

Czy mógłbyś wyjaśnić, dlaczego thrownależy je owinąć setTimeout?
Antony

55

Jeden dobry sposób, aby to zrobić, działający w różnych przeglądarkach, został opisany w Debugowaniu JavaScript: Odrzuć swoje alerty! .


7
throw () to świetna sugestia - taka powinna być wybrana odpowiedź.
matt lohkamp

17
Zgadzam się, jest to jedno podejście dla różnych przeglądarek. Ale .. Czy zgłoszenie wyjątku nie różni się zasadniczo od rejestrowania wiadomości?
Robin Maben,

14
Z drugiej strony zgłoszenie wyjątku zatrzyma wykonanie bieżącego „wątku” (jak zauważył Yuval A) i wznowi go w połowie, jeśli taki istnieje. Wątpię, żeby to było pożądane.
dlaliberte

7
throw()zdecydowanie nie jest na to sposobem. wcześniej czy później wpadniesz w kłopoty. dla mnie było to wcześniej :(
Hugo Mota

4
@Ian_Oxley: w pewnym momencie był wyłączony, teraz jest z powrotem archiwizowany, ale opublikowanie kodu tutaj jest jeszcze lepsze i zalecane przez najlepsze praktyki stackoverflow.
woohoo,

15

Oto rozwiązanie dosłownego pytania o to, jak wydrukować komunikat na konsoli błędów przeglądarki, a nie konsoli debuggera. (Mogą istnieć dobre powody, aby ominąć debugger).

Jak zauważyłem w komentarzach dotyczących sugestii, aby zgłosić błąd, aby uzyskać komunikat w konsoli błędów, jednym problemem jest to, że przerwie to wątek wykonania. Jeśli nie chcesz przerywać wątku, możesz wrzucić błąd do osobnego wątku, utworzonego przy użyciu setTimeout. Stąd moje rozwiązanie (które okazuje się być opracowaniem Ivo Danihelki):

var startTime = (new Date()).getTime();
function logError(msg)
{
  var milliseconds = (new Date()).getTime() - startTime;
  window.setTimeout(function () {
    throw( new Error(milliseconds + ': ' + msg, "") );
  });
}
logError('testing');

Uwzględniam czas w milisekundach od czasu rozpoczęcia, ponieważ limit czasu może zniekształcić kolejność wyświetlania komunikatów.

Drugi argument metody Error dotyczy nazwy pliku, która jest tutaj pustym ciągiem, aby zapobiec wyświetlaniu niepotrzebnej nazwy pliku i numeru wiersza. Możliwe jest uzyskanie funkcji dzwoniącego, ale nie w prosty, niezależny od przeglądarki sposób.

Byłoby miło, gdybyśmy mogli wyświetlić wiadomość z ikoną ostrzeżenia lub wiadomości zamiast ikony błędu, ale nie mogę znaleźć sposobu, aby to zrobić.

Innym problemem związanym z użyciem rzutu jest to, że może zostać złapany i wyrzucony przez otaczający try-catch, a umieszczenie rzutu w oddzielnym wątku pozwala również uniknąć tej przeszkody. Istnieje jednak jeszcze inny sposób na wychwycenie błędu, czyli zastąpienie modułu obsługi window.onerror programem, który robi coś innego. Nie mogę ci tam pomóc.


15

Jeśli korzystasz z Safari , możesz pisać

console.log("your message here");

i pojawia się bezpośrednio na konsoli przeglądarki.


11
Obsługa wszystkich nowoczesnych przeglądarek console.log().
JJJ,

2
Wszystkie nowoczesne przeglądarki TERAZ obsługują console.log(). Do niedawna tak nie było.
Bryce

9

Aby odpowiedzieć na pytanie:

console.error('An error occurred!');
console.error('An error occurred! ', 'My variable = ', myVar);
console.error('An error occurred! ' + 'My variable = ' + myVar);

Zamiast błędu możesz także użyć informacji, zalogować się lub ostrzec.


Twoja odpowiedź wydaje się najlepsza, ale strona MDN Mozilli mówi, że console.error(..)jest to niestandardowa funkcja i nie należy jej używać w produkcji. Jakie jest twoje zdanie? Czy masz jakieś sugestie dotyczące początkującego programisty używającego console.errorvs console.log?
modulitos

To jest interesujące. Nie powinniśmy wtedy tego używać. Dzięki za informację, Lucas.
Yster

2
MDN uważa również za console.log(...)„niestandardowe”. Pod tym względem console.errorjest tak stabilny jak console.log.
Mike Rapadas

1
@Lucas Kogo to obchodzi, czy to standard? Kto będzie korzystał z rejestrowania konsoli do produkcji?
Andrew

Console.error działa teraz we wszystkich głównych przeglądarkach. Nawet IE8. Zobacz developer.mozilla.org/en-US/docs/Web/API/Console/error
Red



5

Uwaga na temat wspomnianego wyżej „throw ()”. Wygląda na to, że całkowicie zatrzymuje wykonywanie strony (sprawdziłem w IE8), więc nie jest to bardzo przydatne do rejestrowania „trwających procesów” (np. Do śledzenia pewnej zmiennej ...)

Moją sugestią jest być może dodanie elementu textarea gdzieś w twoim dokumencie i zmiana (lub dołączenie) jego wartości (która zmieniłaby jego tekst) do rejestrowania informacji w razie potrzeby ...


Zgaduję, że to dlatego, że nie odpowiedziałeś na pytanie OP. Aby drukować na konsoli JS, musisz użyć wbudowanej metody, takiej jak console.log(), throw()itp. Ponadto nie ma nic złego w zachowaniu, throw()jak się wydaje, że sugerujesz - fakt, że zatrzymuje on wykonywanie jest celowe i udokumentowane ( programista. mozilla.org/en-US/docs/Web/JavaScript/Reference/… ) i jest zgodny z tym, jak wyjątki są zgłaszane / wychwytywane w innych językach programowania. (Jeśli chcesz zalogować zawartość zmiennej bez zatrzymywania wykonywania, to jest to po co console.log().)
Sean the Bean

@SeantheBean, pierwotnie była dyskusja o tym, że IE nie wspierało console.log- więc ludzie dawali alternatywy. O throw()zatrzymaniu egzekucji, oczywiście jest to celowe, nikt nie powiedział, że nie. Dlatego zazwyczaj nie jest to dobry sposób na rejestrowanie informacji debugowania w środowisku wykonawczym, czego chciał PO
Yuval A.,

5

Jak zawsze, Internet Explorer jest wielkim słoniem w rolkach, który po prostu Cię zatrzymuje console.log().

Dziennik jQuery można dość łatwo dostosować, ale trzeba go wszędzie dodawać. Jednym z rozwiązań, jeśli używasz jQuery, jest umieszczenie go w pliku jQuery na końcu, najpierw:

function log()
{
    if (arguments.length > 0)
    {
        // Join for graceful degregation
        var args = (arguments.length > 1) ? Array.prototype.join.call(arguments, " ") : arguments[0];

        // This is the standard; Firebug and newer WebKit browsers support this.
        try {
            console.log(args);
            return true;
        } catch(e) {
            // Newer Opera browsers support posting erros to their consoles.
            try {
                opera.postError(args);
                return true;
            } 
            catch(e) 
            {
            }
        }

        // Catch all; a good old alert box.
        alert(args);
        return false;
    }
}

Jest teraz akceptowane jako rozszerzenia jQuery, ale czy nie byłoby skuteczniej sprawdzić, czy istnieją obiekty „konsoli” i „opery” przed wyłapaniem wyjątku?
Danubian Sailor

@lechlukasz Myślę, że możesz zaoszczędzić na nakładach związanych z rozszerzeniem i po prostu użyj console.log oraz tego testu IE: stackoverflow.com/questions/1215392/...
Chris S


3

function foo() {
  function bar() {
    console.trace("Tracing is Done here");
  }
  bar();
}

foo();

console.log(console); //to print console object
console.clear('console.clear'); //to clear console
console.log('console.log'); //to print log message
console.info('console.info'); //to print log message 
console.debug('console.debug'); //to debug message
console.warn('console.warn'); //to print Warning
console.error('console.error'); //to print Error
console.table(["car", "fruits", "color"]);//to print data in table structure
console.assert('console.assert'); //to print Error
console.dir({"name":"test"});//to print object
console.dirxml({"name":"test"});//to print object as xml formate

To Print Error:- console.error('x=%d', x);

console.log("This is the outer level");
console.group();
console.log("Level 2");
console.group();
console.log("Level 3");
console.warn("More of level 3");
console.groupEnd();
console.log("Back to level 2");
console.groupEnd();
console.log("Back to the outer level");


1
console.log("your message here");

pracuje dla mnie .. szukam tego .. korzystałem z Firefoksa. oto mój skrypt.

 $('document').ready(function() {
console.log('all images are loaded');
});

działa w Firefox i Chrome.



1

Aby odpowiedzieć na twoje pytanie, możesz użyć funkcji ES6,

var var=10;
console.log(`var=${var}`);

0

To nie jest drukowane w konsoli, ale otworzy Ci się wyskakujące okienko z komunikatem, które może być przydatne w przypadku niektórych debugowania:

po prostu zrób:

alert("message");

To nie ma nic wspólnego z pytaniem OP
Zefir Zdravkov

Korzystając z naszej strony potwierdzasz, że przeczytałeś(-aś) i rozumiesz nasze zasady używania plików cookie i zasady ochrony prywatności.
Licensed under cc by-sa 3.0 with attribution required.