310 votes

Comment puis-je déboguer javascript sur Android?

Je travaille sur un projet impliquant Raphaeljs. Il s'avère que cela ne fonctionne pas sur Android. C'est le cas sur l'iPhone.

Comment diable je vais sur le débogage de quelque chose sur le navigateur Android? C'est WebKit, donc si je connais la version, le débogage sur cette version complète de WebKit produira les mêmes résultats?

259voto

Mise à jour 2

Auparavant, de journalisation de la console a été la meilleure option pour le débogage JavaScript sur Android. Ces jours-ci avec Chrome pour Android le débogage à distance, nous sommes en mesure de faire usage de tous les bienfaits de l'utilisation de google Chrome pour Bureau sur les Outils de développement Android. Découvrez https://developers.google.com/chrome-developer-tools/docs/remote-debugging pour plus d'informations.


Vous pouvez utiliser le construit en console JavaScript objet à imprimer des messages de journal que vous pouvez consulter avec adb logcat.

console.error('1');
console.info('2');
console.log('3');
console.warn('4');

Produit de cette sortie:


D/WebCore (  165): Console: 1 line: 0 source: http://...
D/WebCore (  165): Console: 2 line: 0 source: http://...
D/WebCore (  165): Console: 3 line: 0 source: http://...
D/WebCore (  165): Console: 4 line: 0 source: http://...

Mise à jour: Vous pouvez également naviguer dans about:debug dans la barre d'adresse pour activer le menu déboguer et la console d'erreur JavaScript avec les récents appareils Android. Vous devriez voir AFFICHER la CONSOLE JAVASCRIPT en haut du Navigateur.

Actuellement en Android 4.0.3 (Ice Cream Sandwich), le logcat sorties pour le navigateur canal. De sorte que vous pouvez filtrer à l'aide de adb logcat browser:* *:S.

Détermination de la version de WebKit:

Si vous tapez javascript:alert(navigator.userAgent) dans la barre d'adresse, vous verrez la version de WebKit répertoriés par exemple

Dans Google Chrome: Mozilla/5.0 (Windows; U; Windows NT 5.1; en-US) AppleWebKit/532.2 (KHTML, like Gecko) Chrome/4.0.221.6 Safari/532.2

Sur Émulateur Android Mozilla/5.0 (Linux; U; Android 1.6; en-us; sdk Build/DRC76) AppleWebKit/528.5+ (KHTML, like Gecko) Version/3.1.2 Mobile Safari/525.20.1

N. B.

Les Versions de WebKit qui ne font pas partie d'un Safari de presse ont un + après le numéro de version et le numéro de version est généralement plus élevé que la dernière version de WebKit. Ainsi, par exemple, 528+ est une officieux construire de WebKit qui est plus récent que le 525.x version livrée dans le cadre de Safari 3.1.2.

139voto

Mads Mobæk Points 9515

Essayez :

  1. Ouvrez la page que vous souhaitez déboguer
  2. alors que sur cette page, dans la barre d’adresse d’un navigateur Android stock, tapez :

(Notez rien ne se passe, mais quelques nouvelles options ont été activées).

Travaux sur les appareils que j’ai essayé. Lire la suite sur propos du navigateur Android : debug, ce qui font ces paramètres ?

55voto

tortexy Points 418

Le http://jsconsole.com ( http://jsconsole.com/remote-debugging.html ) fournit une belle façon, vous pouvez utiliser pour accéder au contenu de la page Web vous.

22voto

KajMagnus Points 2580

J'utilise Weinre, une partie de Apache Cordova.

Avec Weinre, je reçois de Google Chrome console de débogage dans mon navigateur de bureau, et peut se connecter Android pour que la console de débogage, et de débogage de code HTML et CSS. Je peux exécuter le code Javascript les commandes dans la console, et ils influent sur la page Web dans le navigateur Android. Les messages de journal à partir d'Android apparaissent dans le bureau, console de débogage.

Cependant, je pense qu'il n'est pas possible d'afficher ou de l'étape à travers le réel de code Javascript. J'ai donc combiner Weinre avec les messages du journal.

(Je ne sais pas beaucoup sur la JConsole , mais il me semble que le code HTML et CSS de l'inspection n'est pas possible avec JConsole, seulement des commandes Javascript et l'exploitation forestière (?).)

18voto

cyberflohr Points 487

Jetez un oeil à jsHybugger. Il va vous permettre de déboguer à distance votre code js:

  • Android applications hybrides (webview, phonegap, la lampe)
  • Les pages Web qui s'exécute dans le navigateur android par défaut (pas de Chrome, il prend en charge la BAD extension sans cet outil)

Comment cela fonctionne (pour plus de détails et des solutions de rechange sur les projets de site, c'est ce que j'ai trouvé pour être la meilleure façon).

  1. Installer le jsHybugger APK sur votre appareil
  2. Activer le débogage USB sur votre appareil.
  3. Branchez le périphérique Android à votre ordinateur de bureau via le port USB
  4. Exécuter l'application sur l'appareil Android ('jsHybugger')
  5. Entrez l'URL de la cible et de la page de l'app. Appuyez sur Start Service et, enfin, Ouvrir le Navigateur
    • Vous serez présenté avec une liste de navigateurs installés, sélectionnez-en un.
    • Le navigateur se lance.
  6. De retour sur votre ordinateur de bureau ouvrez google Chrome pour google chrome://inspecter/
  7. Un des inspecteurs de la fenêtre va apparaître avec le chrome des outils de débogage liés à la page sur l'appareil Android.
  8. débogage de suite!!!

Encore une fois, avec Chrome sur Android utiliser la BAD extension sans jsHybugger. Je pense que cela est déjà décrit dans la accepté de répondre à cette question.

Prograide.com

Prograide est une communauté de développeurs qui cherche à élargir la connaissance de la programmation au-delà de l'anglais.
Pour cela nous avons les plus grands doutes résolus en français et vous pouvez aussi poser vos propres questions ou résoudre celles des autres.

Powered by:

X