使用Safari远程调试iOS设备网页
最近在做HTML 5游戏时,发布到手机上访问网页总是莫名其妙出现问题,苦于没有remote debug功能一直没有查找到问题。
这边博客详细介绍了iOS, Android, 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设备网页的更多相关文章
- mac的safari浏览器调试ios手机网页
iOS 6给Safari带来了远程的Web检查器工具. 一.参考链接 ios开发者文档 safari开发者工具 remote debugging safari 二.设置iphone 设置 -> ...
- 如何通过Chrome远程调试android设备上的Web网站
网上的帖子很多,但很多都是老版本的,试过了,根本不管用,花了一天时间,终于在本机试验通过了,特记录下来,以备用.有需要的朋友也可以参考.先上一张图,看看PC端chrome上调试的效果: 左边是手机的模 ...
- 远程调试 Android 设备使用入门(谷歌翻译版)
移动前端调试方案(Android + Chrome 实现远程调试) 目录 要求 第 1 步:发现您的 Android 设备 第 2 步:从您的开发计算机调试 Android 设备上的内容. 更多操作: ...
- 真机远程调试 ( IOS Android 以及微信,weex)
1.以前cordova远程调试,Android的直接连接USB后,用chrome打开chrome://inspect网址 IOS的打开Safari的developer下. 这是因为cordova的we ...
- PC远程调试移动设备
我们在移动端进行前端开发时,会遇到一个让人头痛但不得不面对的问题——调试. 在 PC 机器上,我们有功能强大的 Chrome DevTools.Firebug,即便是老版本的 IE ,我们也可以安装微 ...
- PC远程调试移动设备(转载)
我们在移动端进行前端开发时,会遇到一个让人头痛但不得不面对的问题--调试. 在 PC 机器上,我们有功能强大的 Chrome DevTools.Firebug,即便是老版本的 IE ,我们也可以安装微 ...
- 使用charles远程调试iOS移动应用
做iOS移动应用很多开发者会喜欢抓网络发包.回包来联调服务端借口以及定位其他网络问 题.如果在Windows系统可以使用fiddler来做iOS的远程代理,只要fiddler所在系统与iOS设备同时连 ...
- Windows下利用Chrome调试IOS设备页面
本文介绍如何在 Windows 系统中连接 iOS设备 并对 Web 页面进行真机调试 必须前提 iOS设备.数据线 Node.js 环境 Chrome 浏览器 环境准备 安装Node环境 参考Nod ...
- 通过lldb远程调试iOS App
苹果从Xcode5开始弃用了gcc及gdb, 只能使用llvm用lldb. 在越狱机上虽然仍然可以使用gdb进行调试,但lldb是趋势.下面就介绍一种通过Wifi或者USB,在Mac上使用lldb对i ...
随机推荐
- 8.15 CSS知识点6
自定义动画 1.animation-name(动画名称) 元素所应用的动画名称,必须与规则@keyframes配合使用,因为动画名称由@keyframes定义. 语法: animation-name ...
- 记一次项目中的css样式复用
本文同步至微信公众号:http://mp.weixin.qq.com/s?__biz=MzAxMzgwNDU3Mg==&mid=401616238&idx=1&sn=3c6e9 ...
- ubuntu用apt安装apache2时,出现E:未发现软件包 apache2
解决方法:使用sudo apt-get update更新软件包 更新软件包失败,多半使用因为源文件不干净,在/etc/apt下重新自己新写一份源文件 然后执行 sudo apt-get update
- win7 双屏双任务栏
扩展屏幕下都显示任务栏!!! 第一步:Dual Monitor Taskbar 下载 下载链接:链接: http://pan.baidu.com/s/1pKxYUFL 密码: gu5c 第二步:安装完 ...
- eclipse color theme 选择一款适合你的代码样式
1 点击eclipse菜单栏上的Help ->Install New Softwave , 点击add按钮 随便写个名字 ,添加 地址 http://eclipse-color-theme ...
- Python os模块之文件操作
基本概念:C:\\haoguo.txt 路径: C:\\ 文件名: haoguo 后缀名:.txt 1. 文件名与后缀分离 2. 路径与文件分离 3. 获取当前路径 4. 文件名与后缀合并 5. 路径 ...
- JQuery easyui 笔记
1.控件启用,禁用 $form.find("input[type!='button']").removeAttr("readonly"); $form.find ...
- SQL Server中 ldf 文件过大的解决方法
在SQL Server中经常遇到事务日志变大的情况,除了将数据库设置为"自动收缩"外,还可以使用下面的SQL命令进行快速清除数据库中的事务日志,命令如下: - 第一步:清空日志 ...
- SQL Server 2008 通用分页存储过程
1.alert USE [数据库名称] GO /****** Object: StoredProcedure [dbo].[dbTab_PagerHelper] Script Date: 08/22/ ...
- myeclipse部署web项目到server : deploy location 为 INVALID,并且不能更改
首先查看项目路径下有没有 .mymetadata文件,没有就从其它地方挪一个,但是文件中的id必须是唯一的. 如果还不行就去下面这位大哥写的博客看下,进行下一步就可以解决了 生如夏花