Как я могу отлаживать javascript на Android?

Ответ 1

Обновление: удаленная отладка

Раньше консольное ведение журнала было лучшим вариантом для отладки JavaScript на Android. В наши дни с удаленной отладкой Chrome для Android мы можем использовать все преимущества Chrome для настольных инструментов для разработчиков на Android. Подробнее см. https://developers.google.com/chrome-developer-tools/docs/remote-debugging.

Обновление: Консоль JavaScript

Вы также можете перейти к about: debug в строке URL, чтобы активировать меню отладки и консоль ошибок JavaScript с последними устройствами Android. Вы должны увидеть SHOW JAVASCRIPT CONSOLE в верхней части браузера.

В настоящее время в Android 4.0.3 (Ice Cream Sandwich), logcat выводит на канал браузера. Таким образом, вы можете фильтровать с помощью adb logcat browser:* *:S.

Оригинальный ответ

Вы можете использовать встроенный объект console JavaScript для печати сообщений журнала, которые вы можете просмотреть с помощью adb logcat.

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

Производит этот вывод:

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://...

Определение версии WebKit

Если вы наберете javascript:alert(navigator.userAgent) в строке местоположения, вы увидите версию WebKit, указанную, например,

В 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

В 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.

Версии WebKit, которые не являются частью релиза Safari, имеют номер + после номера версии, а их номер версии обычно выше, чем последняя выпущенная версия WebKit. Так, например, 528+ является неофициальной сборкой WebKit, которая является более новой, чем версия 525.x, которая поставляется как часть Safari 3.1.2.

Ответ 2

Попробуйте:

• откройте страницу, которую вы хотите отладить

• находясь на этой странице в адресной строке Android-браузера, введите:

  about:debug 
  

  (Примечание ничего не происходит, но некоторые новые параметры были включены.)

Работает на устройствах, которые я пробовал. Подробнее о Android-браузер о: debug, что делают эти настройки?

Edit: То, что также помогает получить дополнительную информацию, например номер строки, - это добавить этот код к вашему script:

window.onerror = function (message, url, lineNo){
    console.log('Error: ' + message + '\n' + 'Line Number: ' + lineNo);
    return true;
}

Ответ 3

http://jsconsole.com (http://jsconsole.com/remote-debugging.html) обеспечивает хороший способ, который вы можете использовать для доступа к содержимому вашей веб-страницы.

Ответ 4

Я использую Weinre, часть Apache Cordova.

С Weinre я получаю консоль отладки Google Chrome в своем браузере на рабочем столе и могу подключить Android к этой консоли отладки и отлаживать HTML и CSS. Я могу выполнять команды Javascript в консоли, и они влияют на веб-страницу в браузере Android. Сообщения журнала с Android отображаются в консоли отладки на рабочем столе.

Однако я думаю, что невозможно просмотреть или пройти через фактический код Javascript. Поэтому я объединяю Weinre с сообщениями журнала.

(Я не знаю много о JConsole, но мне кажется, что проверка HTML и CSS невозможна с JConsole, только команды Javascript и ведение журнала (?).)

Ответ 5

Взгляните на jsHybugger. Это позволит вам удаленно отлаживать ваш js-код для:

• Android-приложения для Android (веб-просмотр, телефонная раскладка, ярлык)
• Веб-страницы, которые запускаются в браузере по умолчанию в Android (а не в Chrome, он поддерживает расширение ADB без этого инструмента)

Как это работает (более подробная информация и альтернативы на сайте проектов, это было то, что я нашел лучшим способом).

• Установите APK jsHybugger на свое устройство.
• Включить отладку USB на вашем устройстве.
• Подключите Android-устройство к компьютеру с помощью USB
• Запустите приложение на Android-устройстве ('jsHybugger')
• Введите целевой URL и страницу в приложении. Нажмите "Начать сервис" и, наконец, "Открыть браузер"
  • Вам будет представлен список установленных браузеров, выберите один из них.
  • Браузер запускается.
• Вернуться на свой настольный компьютер откройте Chrome для Chrome://проверяем/
• Появится окно инспекторов с инструментами отладки хрома, связанными со страницей на устройстве Android.
• отладить прочь!

Опять же, с Chrome на Android используйте расширение ADB без jsHybugger. Я думаю, что это уже описано в принятом ответе на этот вопрос.

Ответ 6

FYI, причина, по которой RaphaelJS не работает на Android, заключается в том, что андроид webkit (в отличие от iPhone webkit) не поддерживает SVG в это время. Google только недавно пришел к выводу, что SVG поддерживает андроид, это хорошая идея, поэтому он не будет доступен еще некоторое время.

Ответ 7

Полная удаленная отладка Chrome на родном браузере Android на Galaxy S6 на Android 5.1.1:

• Включить USB-отладку на телефоне (настройки, о, быстро нажать номер сборки, настройки разработчика, отладка USB)
• Откройте "Интернет"
• Перейдите к 'about: debug' (вы увидите сообщение об ошибке)
• Меню MORE > Настройки > Отладкa > Удаленная отладка
• Подключите телефон к компьютеру с помощью USB-кабеля
• В телефоне в интернет-браузере Интернета откройте сайт, который вы хотите отлаживать
• Откройте Chrome на компьютере.
• Перейдите к 'chrome://inspect'
• Нажмите кнопку проверки на вкладке браузера, которую вы хотите проверить.

Устройства Galaxy S5 отображаются в Chrome, но вкладки отображаются только после перезапуска. После перезагрузки и попыток подключения мобильный браузер выйдет из строя.

Ответ 8

Raphael не поддерживается в браузерах Android до версии 3.0, вот в чем ваша проблема. У них нет поддержки SVG графики. Он имеет поддержку холста, хотя. Если вам не нужно анимировать его, вы можете визуализировать графику с помощью canvg:

http://code.google.com/p/canvg/

Вот как мы обошли эту проблему для рендеринга SVG-иконок в браузере Android по умолчанию.

Ответ 9

Поместите в строку адреса chrome://about. Вы увидите ссылки на все возможные dev-страницы.

Ответ 10

about:debug (или chrome:\\debug, обе из которых говорят, что страница не может быть найдена, но включить меню Debug в настройках) при попытке Chrome или Opera на Android KitKat 4.4.2 на вкладке Samsung

Если у вас есть разрешения ROOT на вашем устройстве, вы можете просматривать консольные сообщения непосредственно на устройстве. Используйте приложение, подобное CatLog, для просмотра выходных данных журнала. https://play.google.com/store/apps/details?id=com.nolanlawson.logcat&hl=en Это позволит вам просмотреть всю активность logcat.

В Android KitKat/4.4.2 консоль браузера выводится на канал Chromium. Вы можете фильтровать "Chromium", чтобы получить всю активность браузера (включая внутреннюю активность браузера) или просто фильтровать "Консоль", чтобы просматривать только журнал консоли браузера.

chromium [INFO:CONSOLE(3)]  "The key "x-minimal-ui" is not recognized and ignored.", source http://mywebsite.com/ (3)

Ответ 11

Вы можете попробовать YConsole встроенную консоль js. Он легкий и простой в использовании.

• Ломать журналы и ошибки.
• Редактор объектов.

Как использовать:

<script type="text/javascript" src="js/YConsole-compiled.js"></script>
<script type="text/javascript" >YConsole.show();</script>

Ответ 12

При запуске эмулятора Android откройте браузер Google Chrome и в поле "Адрес" введите:

chrome://inspect/#devices

Вы увидите список удаленных целей. Найдите свою цель и нажмите ссылку "проверить".

Ответ 13

Мое решение (для броузера):

• Браузер товаров
• "consolo.log" в исходный код JS
• Отладка USB включена
• Android SDK
• Из Android SDK: monitor.bat
• Фильтр монитора в качестве прикрепленного изображения

Ответ 14

В соответствии с этим ссылка, то Javascript отладки может быть сделано путем загрузки T20 > файл <упомянутый в и загружать загруженный файл на вашу HTML-страницу, чтобы вы могли отлаживать, не обращаясь к Интернету.

Ответ 15

Если вы создаете "гибридное" приложение (кордова), плагин CrossWalk использует веб-просмотр google chromes вместо стандартного интернет-просмотра, который поставляется с Android. Когда я установил плагин, он пришел с возможностью отладки.

CrossWalk

Ответ 16

Студия Android предлагает все, что вам нужно, чтобы увидеть console.log и другие. В logcat просто отфильтруйте "/Веб-консоль", и вы увидите свои журналы js...

Если у вас возникнут какие-либо проблемы, вы можете добавить этот плагин: https://github.com/apache/cordova-plugin-console

Ответ 17

Если вы ищете не удаленные опции:

В более ранних версиях Jellybean и без корневого просмотра средство просмотра logcat может использоваться, если андроид .permission.READL_LOGS предоставляется через adb один раз.

В firefox существует консольный аддон, который читает и показывает все журналы приложений, а также firebug lite.

Ответ 18

mobile-console-log позволяет отображать любой console.log в Chrome Devtools с любого устройства.

Ответ 19

Вы можете попробовать "javascript-compiler-deva" из библиотеки npm, выполнив команду "npm install javascript-compiler-deva", а затем запустив compiler.is с помощью "node compiler.js".

Он создает сервер с портом 8888. Затем вы можете нажать " http://localhost: 8888 ", ввести свой код JavaScript и увидеть результат любого кода JavaScript, включая "console.log", в самом браузере телефона.

Это также размещено в " https://javascript-compiler-deva.herokuapp.com/ "

Ответ 20

В Chrome есть замечательная функция, которая просто выводит фактическое содержимое Android Chrome (включая проверку и т.д.) На экран ПК...

• Включите отладку по USB на устройстве, возможно, вам также необходимо подключиться один раз через adb devices, чтобы вызвать диалог "разрешить связь с..." на мобильном устройстве,
• подключите устройство Android к ПК,
• запустить Chrome на обоих, и
• затем перейдите к chrome://inspect/#devices на ПК.
• Здесь перечислены вкладки мобильного телефона Chrome, и их можно просмотреть.

Там также подробное руководство в сети: https://www.till.net/technologie/html-javascript/remote-web-debugging-unter-android-und-chrome

(обнаружил, что после adb logcat ничего не показывалось из браузера)