我想在Xcode中调试我的PhoneGap应用,但其控制台无法显示javascript错误。
答案 0 :(得分:81)
在Cordova / PhoneGap应用程序中查看和调试JavaScript错误的最优雅方法是将Web Inspector从Safari浏览器附加到iOS应用程序中的Web View(但是,如同已经提到过的Tom Clarkson,您需要在至少iOS 6)。
Apples documentation on setting this up
A thorough third party tutorial
或者,您可以在安装iOS WebKit Debug Proxy后将Chrome的Web Inspector连接到iOS设备。这也开启了从Linux或Windows进行检查的能力。
现在,您对iOS的HTML,CSS和JavaScript的远程访问变得更加灵活,因为您可以在上述调试代理之上安装RemoteDebug iOS WebKit Adapter。由于此适配器将 WebKit远程调试协议转换为 Chrome调试协议,因此这些(在其所有支持的平台上)可用作备用调试和检查工具:
顺便说一句,使用Safari Web Inspector进行远程调试甚至可以与iOS模拟器结合使用。
对于每个版本的iOS,您需要特定的Desktop Safari最低版本才能使用远程Web检查,请参阅下面的列表。
答案 1 :(得分:46)
将以下内容粘贴到文档开头附近,以便在任何其他JavaScript之前执行。
<script type="text/javascript">
window.onerror = function(message, url, lineNumber) {
console.log("Error: "+message+" in "+url+" at line "+lineNumber);
}
</script>
并享受在Xcode控制台窗口中查看Javascript错误的详细信息。
更新:上述技术将记录未定义变量等错误。但是语法错误(例如缺少逗号)仍会导致整个脚本在没有记录任何内容的情况下中断。
因此,您应该将以下内容添加到 onDeviceReady 函数的开头:
console.log('Javascript OK');
如果您在应用启动时未在日志窗口中看到“JavaScript OK”,则表示您在某处出现语法错误。
为了节省搜索丢失的逗号,最简单的方法是将代码粘贴到Javascript验证器中,例如:
http://www.javascriptlint.com/online_lint.php
让它为您找到错误。
希望这会带来一些调试的痛苦。
答案 2 :(得分:9)
请注意,使用0.9.2(今天发布),console.log已在各个平台上标准化以进行日志记录(不推荐使用debug.log)。
桌面WebView上有一个功能可以在iOS UIWebView中公开,它将捕获所有错误(我试图将该功能破解成插件,它使用私有API,但插件只会是为了开发),但是现在做Kris上面提到的并在代码上放置try catch块并使用console.log
为了快速捕捉可能的语法错误,在开发时我已经在桌面Safari中加载了页面并使用webkit错误控制台可以快速刷新它。
答案 3 :(得分:3)
debug.log会将消息发送到Phonegap中的XCode控制台(允许您记录异常的结果或进行一些调试),但是,你必须调试Safari中的其他javascript错误是正确的(或者是打开调试控制台的桌面或iphone)。我还没有找到一个Javascript错误,这是由于在iphone上运行引起的,并且在Safari中打开控制台进行调试时不存在(虽然我知道iphone上的WebView和Safari之间存在一些差异)。
答案 4 :(得分:3)
为了在Xcode中进行javascript调试工作,我将看看以下内容。
http://phonegap.com/2011/05/18/debugging-phonegap-javascript/
http://www.daveoncode.com/2010/01/12/debugging-phonegap-applications-using-xcode-console/
就其他故障排除而言...... 首先,你可以在你的电脑上运行safari中的应用程序并使用safari的调试器(或者chrome都运行类似的渲染引擎)。这不会遇到高级逻辑错误和许多api问题,但它至少应该有助于解决许多问题(基本的javascript,HTML5等......)。
答案 5 :(得分:3)
我刚遇到Weinre
这是一个用于phonegap的远程javascript调试器。您可以设置自己的Weinre服务器,也可以使用http://debug.phonegap.com/
上的服务器它似乎运作良好 - 到目前为止印象非常深刻。
答案 6 :(得分:3)
如果你使用的是iOS 6,你只需将safari web检查器(在桌面游戏的开发菜单上)附加到你的应用程序并获得完整的javascript调试。
有几个方面它有点受限 - 启动错误和插件调用 - 但它适用于其他任何东西。
答案 7 :(得分:2)
要在javascript控制台中查看所有错误,我同意使用此事件监听器
<script type="text/javascript">
window.onerror = function(err,fn,ln) {alert("ERROR:" + err + ", " + fn + ":" + ln );};
var errorVar = objectDoesntExists.properyDoesntExist;//this will simulate an error
</script>
但是,除非你安装了cordova插件,否则它不会在XCodes“console”上显示。转到项目文件夹并键入:
? cordova plugin add cordova-plugin-console
这将允许javascript命令'console.log('some string')显示在XCode上。
注意你需要git等...但如果你在xcode中编辑你的phonegap项目,你很可能会拥有它!
PS确保在使用console.log
之前放入cordova.js脚本插件<script type="text/javascript" src="/cordova.js"></script>
答案 8 :(得分:0)
将它放在index.html的开头
<script type="text/javascript">
window.onerror = function(err,fn,ln) {alert("ERROR:" + err + ", " + fn + ":" + ln);};
var errorVar = objectDoesntExists.properyDoesntExist;//this will simulate an error
</script>
答案 9 :(得分:-2)
这是一个对我有用的简单方法:
通过调用(我使用python 2.7)使用python启动http服务器:
python -m SimpleHTTPServer
通过在浏览器中输入HTTPServer的地址来查看safari中的页面,对我来说URL是:
http://0.0.0.0:8000/
打开开发人员工具:
在chrome中,这是alt + command + i。查看控制台选项卡,可能需要刷新页面。
在Safari中:Safari - &gt;偏好 - &gt;高级 - &gt;选中“显示开发菜单”。开发菜单 - &gt;显示错误控制台(或alt + command + c)。刷新页面。按CTRL + 5打开问题选项卡。