【iOS】使用safari对webview进行调试
【iOS】使用safari对webview进行调试
在web开发的过程中,抓包、调试页面样式、查看请求头是很常用的技巧。其实在iOS开发中,这些技巧也能用(无论是模拟器还是真机),不过我们需要用到mac自带的浏览器Safari。所以,本文将讲解如何使用Safari对iOS程序中的webview进行调试。
环境信息:
Mac OS X 10.10.1
Xcode 6.1.1
iOS 8.1
正文:
1. 打开模拟器(真机)的开发者模式
【设置】->【Safari】->【高级】->【Web检查器】打开

打开iphone设备中的web检查器
2. 打开Mac上Safari的开发者模式
【Safari】->【偏好设置】->【高级】->【在菜单栏中显示“开发”菜单】勾选

打开Safari中的开发者模式
3. 写一个webview并加载一个网页
#import "ViewController.h"
@interfaceViewController ()
@property (strong, nonatomic) UIWebView *webView;
@end
@implementation ViewController
- (void)viewDidLoad {
[superviewDidLoad];
// Do any additional setup after loading the view, typically from a nib.
_webView = [[UIWebViewalloc] initWithFrame:self.view.bounds];
[_webView loadRequest:[NSURLRequest requestWithURL:[NSURL URLWithString:@"http://www.baidu.com"]]];
[self.view addSubview:_webView];
}
@end
4. 在模拟器(真机)中打开webview应用,并打开Safari查看网络信息
【开发】->【iOS Simulator】->【正在调试的网站】
注意:必须要webview在加载网页时,打开Safari才可以看到调试模式。

打开Safari中的调试
在弹出的调试窗口中,可以看到当前正在加载网页的各种信息,包括源码、请求头、图片、加载的资源与脚本、控制台输出等。并且它和web前端的调试方式相同,你可以直接修改网页的CSS样式,对网页布局等进行修改,而不用重新运行整个App。
5. 修改web样式
将光标选中到要修改的样式,进行修改后,可以直接在模拟器中看到修改后的效果。

直接修改webview中的样式
当然,webview的调试技巧还有很多,比如Charles工具等。感兴趣的小伙伴可以多研究下。
【iOS】使用safari对webview进行调试的更多相关文章
- iOS 开发之使用safari对webview进行调试
转自:http://www.tuicool.com/articles/ZBFnUbz 使用safari对webview进行调试 时间 2016-02-25 14:35:20 陈斌彬的技术博客 原文 ...
- 使用safari对webview进行调试
在web开发的过程中,抓包.调试页面样式.查看请求头是很常用的技巧.其实在iOS开发中,这些技巧也能用(无论是模拟器还是真机),不过我们需要用到mac自带的浏览器Safari.所以,本文将讲解如何使用 ...
- iOS逆向工程之Hopper+LLDB调试第三方App
LLDB是Low Level Debugger的简称,在iOS开发的调试中LLDB是经常使用的,LLDB是Xcode内置的动态调试工具.使用LLDB可以动态的调试你的应用程序,如果你不做其他的额外处理 ...
- iOS开发:创建真机调试证书及描述文件
iOS开发:创建真机调试证书及描述文件 关于苹果iOS开发,笔者也是从小白过来的,经历过各种困难和坑,其中就有关于开发证书,生产证书,in_house证书,add_Hoc证书申请过程中的问题,以及上架 ...
- ios下Safari无法触发click事件的处理
ios下的Safari真是傲娇啊,坑好多. 首先上代码 <!DOCTYPE html> <html> <head> <title>122</tit ...
- 将iOS中Safari 的默认搜索引擎由google.cn改为google.com的方法
众所周知虽然Google大部分的业务已经迁出中国大陆,访问Google的中国站点只会出现一个投影网站,但是很长一段时间里如果想要访问Google仍然能跳转到google.com.hk这个香港的节点,这 ...
- iOS中Safari浏览器select下拉列表文字太长被截断的处理方法
网页中的select下拉列表,文字太长的话在iOS的Safari浏览器里会被自动截断,显示成下面这种: 安卓版的浏览器则没有这个问题. 如何让下拉列表中的文字在iOS的Safari浏览器里显示完整呢? ...
- 利用iOS中Safari浏览器创建伪Web App
在safari浏览器里有一个“添加到主屏幕”选项,我们可以用来创建伪Web App,下面来了解一下iOS中Safari的私有属性 第一步设置Web App的主屏幕图标: 有两种属性值apple-tou ...
- 通过Chrome的inspect对手机webview进行调试
使用chrome的inspect可以对手机上的webview进行调试,因为真机没有什么比较好的调试工具,而chrome提供了这一个工具可以比较方便的查看真机上的元素,以及进行调试. 其实我对webvi ...
随机推荐
- JS Replace() 全部替换字符的用法
好久不写js了,今早遇到替换字符的,就浪费了点时间,由此,要记录下来.replace()方法:楼主有个字符串,需要替换掉其中的一些字母,如: var test='123helo123boy123hi' ...
- 十五个常用的jquery代码段【转】
好的文章顶一个 回到顶部按钮 通过使用 jQuery 中的 animate 和 scrollTop 方法,你无需插件便可创建一个简单地回到顶部动画: 1 // Back to top 2 $('a.t ...
- Struts2 源码分析——调结者(Dispatcher)之准备工作
章节简言 上一章笔者讲到关于struts2过滤器(Filter)的知识.让我们了解到StrutsPrepareFilter和StrutsExecuteFilter的作用.特别是StrutsPrepar ...
- WCF实现方法重载
一.服务契约(包括回调契约)通过指定不同的OperationContract.Name来实现重载方法,当然代码部份还是必需符合C#的重载要求,即相同方法名称,不同的参数个数或参数类型 namespac ...
- 八、RFCOMM
1. RFCOMM 先来看看RFCOMM在协议栈层次体系中的位置.从下图可以看出RFCOMM处于传输层.与AVCTP,TCS-BIN处于同一层次.处于其上层的会话层中的OBEX,SPP等大部 ...
- If WCF Service side and Client side config is different?!
from stackoverflow http://stackoverflow.com/questions/4879310/when-setting-up-a-wcf-client-and-serve ...
- win10 服务(系统默认服务)注册表
---恢复内容开始--- Windows Registry Editor Version 5.00 [HKEY_LOCAL_MACHINE\SYSTEM\ControlSet001\Services] ...
- 从C#到Objective-C,循序渐进学习苹果开发(4)--代码块(block)和错误异常处理的理解
本随笔系列主要介绍从一个Windows平台从事C#开发到Mac平台苹果开发的一系列感想和体验历程,本系列文章是在起步阶段逐步积累的,希望带给大家更好,更真实的转换历程体验.本文继续上一篇随笔<从 ...
- js或css文件合并的三种方式推荐
源文档 <http://www.jb51.net/article/32834.htm> 在Web项目的开发中,js,css文件会随着项目的开发变得越来越多,越来越大,这就给给性能方面带来一 ...
- myeclipse中的文件内容被覆盖如何恢复
今天无意中,运行文件把原先的文件给覆盖掉了,通过查阅资料发现可以通过这样去恢复 点击被覆盖后的文件------->右击--------->选择replace with------>p ...