studio - remote debug android




我怎樣才能在Android上調試JavaScript? (12)

我正在參與一個涉及Raphaeljs的項目。 事實證明,它不適用於Android。 它在iPhone上。

我怎麼去調試Android瀏覽器上的東西? 它是WebKit,所以如果我知道該版本,那麼將在完整版WebKit上調試它會產生相同的結果?




更新:遠程調試

以前,控制台日誌記錄是在Android上調試JavaScript的最佳選擇。 現在,通過Chrome進行Android遠程調試,我們可以充分利用Android上Chrome for Desktop開發人員工具的所有優點。 查看https://developers.google.com/chrome-developer-tools/docs/remote-debugging了解更多信息。

更新:JavaScript控制台

您還可以在URL欄中導航到about:debug以激活調試菜單和帶有最新Android設備的JavaScript錯誤控制台。 您應該在瀏覽器頂部看到SHOW JAVASCRIPT CONSOLE。

目前在Android 4.0.3(Ice Cream Sandwich)中,logcat輸出到瀏覽器頻道。 所以你可以使用adb logcat browser:* *:S進行過濾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

NB

不屬於Safari發行版的WebKit版本在版本號後有+,版本號通常比最新發布的WebKit版本更高。 因此,例如,528+是WebKit的非官方版本,比作為Safari 3.1.2一部分發布的525.x版本更新。


你可以試試YConsole一個js嵌入式控制台。 它重量輕,使用簡單。

  • 捕獲日誌和錯誤。
  • 對象編輯器。

如何使用 :

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

嘗試:

  1. 打開你想調試的頁面
  2. 而在該頁面上,在股票Android瀏覽器的地址欄中,鍵入:

    about:debug 
    

    (注意什麼都沒有發生,但啟用了一些新選項。)

適用於我嘗試過的設備。 有關Android瀏覽器的更多信息,請參閱:debug,這些設置的作用是什麼?

編輯:還有助於檢索更多信息(如行號)是將此代碼添加到您的腳本中:

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

在3.0之前的Android瀏覽器中不支持Raphael,這就是你的問題所在。 他們不支持SVG圖形。 它確實支持canvas。 如果你不需要動畫,你可以用canvg渲染圖形:

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

這就是我們如何解決這個問題,以在默認Android瀏覽器中呈現SVG圖標的方式。


在Chrome或Opera上使用Android KitKat 4.4.2在Samsung Tab上進行嘗試時, about:debug (或chrome:\\debug兩者均表示無法找到頁面,但在設置中啟用“調試”菜單)

如果您的設備具有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)

如果您正在尋找非遠程選項:

在較早的和非根源的Jellybean發行版中,如果android.permission.READL_LOGS通過adb授予一次,則可以使用logcat查看器。

在Firefox上,有一個控制台插件可以讀取並顯示所有應用程序日誌,並且還有螢火蟲Lite


我使用WeinreApache Cordova的一部分。

通過Weinre,我可以在我的桌面瀏覽器中獲得Google Chrome的調試控制台,並且可以將Android連接到該調試控制台,並調試HTML和CSS。 我可以在控制台中執行Javascript命令,並且它們影響Android瀏覽器中的網頁。 來自Android的日誌消息顯示在桌面調試控制台中。

不過,我認為不可能查看或逐步瀏覽實際的Javascript代碼。 所以我將Weinre與日誌消息結合在一起。

(我對http://jsconsole.com/remote-debugging.html了解不多,但在我看來,使用JConsole,只有JavaScript命令和日誌記錄(?)才能實現HTML和CSS檢查。)


我的解決方案是(用於股票瀏覽器):

  • 股票瀏覽器
  • “consolo.log”放入JS源代碼中
  • 調試USB啟用
  • Android SDK
  • 從Android SDK:monitor.bat
  • 監視過濾器作為附加圖像

根據這個link ,javascript調試可以通過下載link提到的firebug.js文件並將下載的文件加載到HTML頁面中來完成,這樣您就可以在不使用Internet的情況下進行調試。


看看jsHybugger 。 它可以讓你遠程調試你的js代碼:

  • Android混合應用程序 (webview,phonegap,worklight)
  • 默認的Android瀏覽器中運行的網頁 (不是Chrome,它不支持使用此工具的ADB擴展)

這是如何工作的(項目網站上有更多的細節和備選方案,這是我發現的最好的方法)。

  1. 在您的設備上安裝jsHybugger APK
  2. 在您的設備上啟用USB調試。
  3. 通過USB將Android設備插入台式電腦
  4. 在Android設備上運行應用('jsHybugger')
  5. 在應用中輸入目標網址和頁面。 按開始服務,最後打開瀏覽器
    • 您將看到已安裝的瀏覽器列表,請選擇一個。
    • 瀏覽器啟動。
  6. 回到台式電腦上打開Chrome瀏覽器chrome:// inspect /
  7. 將出現一個檢查器窗口,其中chrome調試工具鏈接到Android設備上的頁面。
  8. 調試了!

再次,Android上的Chrome使用不帶jsHybugger的ADB擴展。 我想這已經在接受的這個問題的答案中描述過了。





webkit