最近在做HTML 5游戏时,发布到手机上访问网页总是莫名其妙出现问题,苦于没有remote debug功能一直没有查找到问题。

这边博客详细介绍了iOS, Android, Windows Phone的调试方法:

http://developer.telerik.com/featured/a-concise-guide-to-remote-debugging-on-ios-android-and-windows-phone/

1. 使用方法

在Mac下连接iPhone试了一下确实不错,

环境:

Mac OS 10.9 Mavericks, iOS 8.1

步骤:

1. iPhone上,设置-》Safari-》高级-》打开网页侦测器

2. Mac上,Safari偏好设置-》高级-》在菜单栏中显示开发菜单

3. 连接手机,在手机Safari上打开网页,然后添加到主屏幕(无法远程调试Sarafi直接打开的网页,只能测试添加到主屏幕的),从主屏幕上的快捷图标打开网页

4. Mac上Safari的开发菜单栏,下拉可以看到连接的设备,悬停可以看到打开的网页,点击打开Web检查器

2. 备忘

Web检查器功能跟firefox的调试功能差不多,可以设置断点,查看变量,不过没发现Watch变量功能。

console的log查看也挺不方便的,为了方便查看log,我改写了一下log函数,绑定在console上,将日志push到一个Array,这样在Web检查器可以很快找到所以log;release项目时使用uglifyjs的drop_console可以直接去除所有log调用。

重写一下window.onerror方法,可以更方便的抓取报错,只要在重写的函数打个断点,报错都会进来,能看到报错的堆栈信息。

window.onerror = function(errorMessage, scriptURI, lineNumber, columnNumber, error) {
  // your handler
}

对于加载游戏就报错可以先设置断点,然后在Web检查器点刷新,如果在iOS设备上直接按Home键会直接结束Web检查器,无法查找。

使用Safari远程调试iOS设备网页的更多相关文章

  1. mac的safari浏览器调试ios手机网页

    iOS 6给Safari带来了远程的Web检查器工具. 一.参考链接 ios开发者文档 safari开发者工具 remote debugging safari 二.设置iphone 设置 -> ...

  2. 如何通过Chrome远程调试android设备上的Web网站

    网上的帖子很多,但很多都是老版本的,试过了,根本不管用,花了一天时间,终于在本机试验通过了,特记录下来,以备用.有需要的朋友也可以参考.先上一张图,看看PC端chrome上调试的效果: 左边是手机的模 ...

  3. 远程调试 Android 设备使用入门(谷歌翻译版)

    移动前端调试方案(Android + Chrome 实现远程调试) 目录 要求 第 1 步:发现您的 Android 设备 第 2 步:从您的开发计算机调试 Android 设备上的内容. 更多操作: ...

  4. 真机远程调试 ( IOS Android 以及微信,weex)

    1.以前cordova远程调试,Android的直接连接USB后,用chrome打开chrome://inspect网址 IOS的打开Safari的developer下. 这是因为cordova的we ...

  5. PC远程调试移动设备

    我们在移动端进行前端开发时,会遇到一个让人头痛但不得不面对的问题——调试. 在 PC 机器上,我们有功能强大的 Chrome DevTools.Firebug,即便是老版本的 IE ,我们也可以安装微 ...

  6. PC远程调试移动设备(转载)

    我们在移动端进行前端开发时,会遇到一个让人头痛但不得不面对的问题--调试. 在 PC 机器上,我们有功能强大的 Chrome DevTools.Firebug,即便是老版本的 IE ,我们也可以安装微 ...

  7. 使用charles远程调试iOS移动应用

    做iOS移动应用很多开发者会喜欢抓网络发包.回包来联调服务端借口以及定位其他网络问 题.如果在Windows系统可以使用fiddler来做iOS的远程代理,只要fiddler所在系统与iOS设备同时连 ...

  8. Windows下利用Chrome调试IOS设备页面

    本文介绍如何在 Windows 系统中连接 iOS设备 并对 Web 页面进行真机调试 必须前提 iOS设备.数据线 Node.js 环境 Chrome 浏览器 环境准备 安装Node环境 参考Nod ...

  9. 通过lldb远程调试iOS App

    苹果从Xcode5开始弃用了gcc及gdb, 只能使用llvm用lldb. 在越狱机上虽然仍然可以使用gdb进行调试,但lldb是趋势.下面就介绍一种通过Wifi或者USB,在Mac上使用lldb对i ...

随机推荐

  1. Solving “Dynamic Web Module 3.0 requires Java 1.6 or newer” in Maven Projects

    不一定是在Maven Projects里才有这种情况,但解决方法是一样的. 转自:http://qussay.com/2013/09/13/solving-dynamic-web-module-3-0 ...

  2. 常用JS效果 需要时更新。。。

    1.手风琴效果 JS: $(function() {     var aMenuOneLi = $(".menu-one > li");     var aMenuTwo = ...

  3. 删除win7远程桌面历史记录

    开始-运行-“regedit”注册表中找到HKEY_CURRENT_USER\Software\Microsoft\Terminal Server Client\Default 删除不需要的即可

  4. CentOS6.5源码安装python3.5.2

    前提: 1.实现自动补全需要安装模块 readline-devel (yum install -y readline-devel) 2.实现支持SSL协议需安装模块 openssl-devel (yu ...

  5. .Net“/”应用程序中的服务器错误 超过了最大请求长度 错误解决办法

    错误如下: 错误提示: 说明: 执行当前 Web 请求期间,出现未处理的异常.请检查堆栈跟踪信息,以了解有关该错误以及代码中导致错误的出处的详细信息. 异常详细信息: System.Web.HttpE ...

  6. Apache伪静态在网站目录没有反斜杠后自动添加反斜杠

    第一步:确认网站开启REWRITE规则 一般有两种情况: i.apache安装的时候已经包含rewrite功能 ii.后续配置的时候新添加mod_rewrite.so.这种情况需要在httpd.con ...

  7. java 基本语法

    标识符 标识符就是给变量.类或方法起的名字. 标识符由26个英文字符大小写(a~zA~Z).数字(0~9).下划线(_)和美元符号($)组成 不能以数字开头,不能是关键字 严格区分大小写 标识符的可以 ...

  8. PowerDesigner使用教程

    PowerDesigner是一款功能非常强大的建模工具软件,足以与Rose比肩,同样是当今最著名的建模软件之一.Rose是专攻UML对象模型的建模工具,之后才向数据库建模发展,而PowerDesign ...

  9. 新博客地址: kuangbin.org

    RT. 买了新域名,原来的kuangbin.net已经废了,数据已经移动到了kuangbin.org

  10. CentOS6.5 vsftpd 配置

    CentOS6.5vsftpd 配置文件为/etc/vsftpd/vsftpd.conf 安装完软件后:1.默认匿名用户能够登陆,且限制在/pub目录内,2.本地用户可以登陆但因SElinux而无法登 ...