【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进行调试的更多相关文章

  1. iOS 开发之使用safari对webview进行调试

    转自:http://www.tuicool.com/articles/ZBFnUbz 使用safari对webview进行调试 时间 2016-02-25 14:35:20  陈斌彬的技术博客 原文  ...

  2. 使用safari对webview进行调试

    在web开发的过程中,抓包.调试页面样式.查看请求头是很常用的技巧.其实在iOS开发中,这些技巧也能用(无论是模拟器还是真机),不过我们需要用到mac自带的浏览器Safari.所以,本文将讲解如何使用 ...

  3. iOS逆向工程之Hopper+LLDB调试第三方App

    LLDB是Low Level Debugger的简称,在iOS开发的调试中LLDB是经常使用的,LLDB是Xcode内置的动态调试工具.使用LLDB可以动态的调试你的应用程序,如果你不做其他的额外处理 ...

  4. iOS开发:创建真机调试证书及描述文件

    iOS开发:创建真机调试证书及描述文件 关于苹果iOS开发,笔者也是从小白过来的,经历过各种困难和坑,其中就有关于开发证书,生产证书,in_house证书,add_Hoc证书申请过程中的问题,以及上架 ...

  5. ios下Safari无法触发click事件的处理

    ios下的Safari真是傲娇啊,坑好多. 首先上代码 <!DOCTYPE html> <html> <head> <title>122</tit ...

  6. 将iOS中Safari 的默认搜索引擎由google.cn改为google.com的方法

    众所周知虽然Google大部分的业务已经迁出中国大陆,访问Google的中国站点只会出现一个投影网站,但是很长一段时间里如果想要访问Google仍然能跳转到google.com.hk这个香港的节点,这 ...

  7. iOS中Safari浏览器select下拉列表文字太长被截断的处理方法

    网页中的select下拉列表,文字太长的话在iOS的Safari浏览器里会被自动截断,显示成下面这种: 安卓版的浏览器则没有这个问题. 如何让下拉列表中的文字在iOS的Safari浏览器里显示完整呢? ...

  8. 利用iOS中Safari浏览器创建伪Web App

    在safari浏览器里有一个“添加到主屏幕”选项,我们可以用来创建伪Web App,下面来了解一下iOS中Safari的私有属性 第一步设置Web App的主屏幕图标: 有两种属性值apple-tou ...

  9. 通过Chrome的inspect对手机webview进行调试

    使用chrome的inspect可以对手机上的webview进行调试,因为真机没有什么比较好的调试工具,而chrome提供了这一个工具可以比较方便的查看真机上的元素,以及进行调试. 其实我对webvi ...

随机推荐

  1. Java中多态的一些简单理解

    什么是多态 .面向对象的三大特性:封装.继承.多态.从一定角度来看,封装和继承几乎都是为多态而准备的.这是我们最后一个概念,也是最重要的知识点. .多态的定义:指允许不同类的对象对同一消息做出响应.即 ...

  2. C语言学习014:结构化数据类型

    struct的基本使用 #include <stdio.h> //定义数据结构 struct fish{ const char *name; const char *species; in ...

  3. WPF系列:画图

    Line 在两个坐标点之间画一条直线,通过四个属性设置它的起始和结束 <Line Stroke="Blue" StrokeThickness="3" X1 ...

  4. PHP访问MySql数据库介绍

    在网站后台,经常要与数据库打交道.本文介绍如何使用XAMPP来管理MySql数据库及如何用PHP来访问MySql数据库. 一.使用XAMPP来管理MySql数据库 首先使用XAMPP打开MySql的管 ...

  5. ASPose导出excel简单操作

    string file = FileDialogHelper.SaveExcel(string.Format("{0}.xls", excelName)); if (!string ...

  6. css3飞机起飞进度条

    效果:http://hovertree.com/texiao/css3/27/ 源码下载:http://hovertree.com/h/bjaf/pgwql1x2.htm 本效果使用Font Awes ...

  7. jquery简单原则器(匹配第一个元素)

    <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/ ...

  8. Tomcat Server Timeouts属性的设置

    在启动Tomcat Server时,经常会出现启动时间过长的错误,如下图所示(为了方便截图,Start Timeout被设置为5秒钟,一般为45秒钟). 双击Tomcat v7.0 Server at ...

  9. Google Go Programming In Eclipse

    http://www.tutorialsavvy.com/2013/04/google-go-programming-in-eclipse.html/ Google Go Programming In ...

  10. form表单及其中元素

    <form method=get/post action="提交路径"> 单行文本域:<input type="text" name=&quo ...