在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工具等

使用safari对webview进行调试的更多相关文章

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

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

  2. 【iOS】使用safari对webview进行调试

    [iOS]使用safari对webview进行调试 在web开发的过程中,抓包.调试页面样式.查看请求头是很常用的技巧.其实在iOS开发中,这些技巧也能用(无论是模拟器还是真机),不过我们需要用到ma ...

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

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

  4. android webview远程调试

    H5的调试的方式一般用chrome的emulator就好,可是遇到APP就拙计了.这时候还得用远程调试,远程调试很给力,不过目前网上还没有好的文章讲解,要好好的把其配置下来还是非常有难度的,今天折腾了 ...

  5. 机顶盒webview开发调试

    安装node的anywhere插件  启动本地服务器后 使用chrome的DevTool----->   chrome://inspect/#devices 点击inspect  第一次需要FQ ...

  6. WebView加载HTML图片大小自适应与文章自动换行

    http://www.brighttj.com/ios/ios-webview-load-html-image-adaptive.html 在很多App中都会使用到webview,尤其是在加载新闻内容 ...

  7. WKWebView的新特性与使用

    在WWDC2014中,苹果推出了最新的iOS8系统,其中也伴随着很多控件的更新与升级.其中全新的WebKit库让人很是兴奋.本文也将讲解到WebKit中更新的WKWebView控件的新特性与使用方法, ...

  8. Hybrid App 应用开发中 9 个必备知识点复习(WebView / 调试 等)

    前言 我们大前端团队内部 ?每周一练 的知识复习计划继续加油,本篇文章是 <Hybrid APP 混合应用专题> 主题的第二期和第三期的合集. 这一期共整理了 10 个问题,和相应的参考答 ...

  9. WebView 与PC机Chrome配合调试

    参考自http://www.cnblogs.com/terrylin/p/4606277.html 移动端WebView开发调试:Chrome远程调试 Chrome DevTools调试移动设备Bro ...

随机推荐

  1. 网络抓包工具-Wireshark学习资料

    wireshark一个非常牛逼的网络抓包工具.转载一系列博文 一站式学习Wireshark(一):Wireshark基本用法 一站式学习Wireshark(二):应用Wireshark观察基本网络协议 ...

  2. KAFKA一异常处理记录

    kafka-console-consumer.sh --topic TOPIC_KEYWORD --from-beginning --zookeeper localhost报异常,Exception ...

  3. SSTABLE简介

    SSTABLE数据组织:http://blog.csdn.net/tankles/article/details/7663905

  4. CH Round #72树洞[二分答案 DFS&&BFS]

    树洞 CH Round #72 - NOIP夏季划水赛 描述 在一片栖息地上有N棵树,每棵树下住着一只兔子,有M条路径连接这些树.更特殊地是,只有一棵树有3条或更多的路径与它相连,其它的树只有1条或2 ...

  5. 2.bootstrap练习笔记-轮播图

    bootstrap练习笔记-轮播图 1.要使用轮播图,首先要将其放在一个主div里面 设置id为myCaroysel class为carousel slide 设置id是标识这个div是轮播图,等到l ...

  6. kettle启动“Error: could not create the Java Virtual Machine”

    因为我的操作系统是32bit,而Ketttle的Spoon脚本中,默认是PENTAHO_DI_JAVA_OPTIONS="-Xms1024m" "-Xmx2048m&qu ...

  7. 嵌入式Linux驱动学习之路(十七)驱动程序分层分离概念-平台设备驱动

    平台设备驱动: 包含BUS(总线).DEVICE.DRIVER. DEVICE:硬件相关的代码 DRIVER:比较稳定的代码 BUS有一个driver链表和device链表. ①把device放入bu ...

  8. Ubuntu14.04下配置固定IP

    实验室需要构建静态网站作为个人知识管理工具,每个人要求都有属于自己的静态网站进行知识积累和交流.但是实验室的路由有时候会关闭,重启后给每台机器重新分配ip,因此为了方便访问每台主机,需要设置静态ip. ...

  9. Python 过算符和数据类型

    一.算术运算符 二.逻辑运算符

  10. Linux(CentOs6.4)安装Git

    安装之前我们先来了解下git,并且要反问下:我为什么要使用git?svn用的不是很好嘛,我干嘛要换?... 问1:为什么需要版本控制系统? 版本控制是一种记录若干文件内容变化,以便将来查阅特定版本修订 ...