本地调试H5页面方案总结

http://www.jianshu.com/p/a43417b28280

Fiddler 手机抓包

http://blog.csdn.net/gld824125233/article/details/52588275

1、安装证书

2、重启wifi

安卓篇:

需要道具

1、安卓手机

2、usb数据线或充电线

3、一个测试用的安卓安装包apk包。里面必须包含webview页面。不然你远程调试个屁!

4、豌豆荚 、 91手机助手等第三方安卓助手平台

5、fq用的vpn工具

6、chrome 浏览器

具体实施步骤:

1、安卓手机开始【开发者模式】和【USB调试】并且允许手机访问

2、【连接类型】默认是【充电】,改为【媒体设备(MTP)】

3、使用第三方安卓助手平台,安装具有webview页面的安卓测试包.apk

4、打开具有webview页面的安卓APP。

4、电脑fq(你懂得) ,为了确保正常fq,请访问www.google.com看看是否正常

5、打开chrome浏览器,输入url: 【chrome://inspect/#devices】,在【Remote Target】中查看是否有自己的手机型号,如果没有请立即中止,检查上面的步骤

6、点击inspect即可看到下面的效果图

效果展示1:

效果展示2:

IOS篇

需要道具:

charles(跨域使用): https://www.charlesproxy.com/download/

Iphone手机

I苹果:http://rj.baidu.com/search/index/?kw=i苹果

准备事项:

让IOS开发人员,将webview的地址指向你本地资源。如10.110.1.27:8080/index.html

由于我本地使用了webpack,所以能开启热更新的服务器。每次保存时,APP中的webview就会自动更新。非常方便调试。

但还存在跨域的问题,这时候就要charles登场了,原理通过修改代理为本地来实现跨域

0、将项目中ajax的请求地址ip,改为本地Ip。其他不变,比如原本请求地址为:

   http://10.110.1.17:8081/bmapi/api/project/DoOld

修改本地IP:

  http://10.110.1.26:8081/bmapi/api/project/DoOld

1、首先电脑和手机要使用同一个局域网(无线网络)内

2、修改手机的无线网络配置,以我的Iphone手机为例:

3、打开charles->Tools->remote Map->Add

这样一来就可以跨域了。

IOS与安卓的远程调试的更多相关文章

  1. 安卓打开远程调试(免root)

    首先用数据线连接adb,在pc端执行: adb tcpip 5555 然后就能拔掉数据线了. pc执行这个: adb connect 172.19.208.2 就能连接上

  2. 通过Mac远程调试iPhone/iPad上的网页(转)

    我们知道在 Mac/PC 上的浏览器都有 Web 检查器这类的工具(如最著名的 Firebug)对前端开发进行调试,而在 iPhone/iPad 由于限于屏幕的大小和触摸屏的使用习惯,直接对网页调试非 ...

  3. 远程调试weinre的使用

    一.用途 *鉴于在浏览器调试移动端页面无法准确反映移动端实际情况并无法高效调试,故常常使用远程调试工具通过电脑连接手机进行调试,常用远程调试方式: 1.chrome连接安卓机远程调试 2.Mac连接苹 ...

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

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

  5. 安卓手机移动端Web开发调试之Chrome远程调试(Remote Debugging)

    一.让安卓打debug模式的apk包 二.将电脑中的chrome升级到最新版本,在chrome浏览器地址栏中输入chrome://inspect/#devices: 在智能手机还未普及时,移动设备的调 ...

  6. 使用Safari远程调试iOS设备网页

    最近在做HTML 5游戏时,发布到手机上访问网页总是莫名其妙出现问题,苦于没有remote debug功能一直没有查找到问题. 这边博客详细介绍了iOS, Android, Windows Phone ...

  7. iOS逆向开发(3):锁定APP的目标类与函数 | reveal | lldb | debugserver | 远程调试

    之前介绍了怎么获取APP的所有类的结构信息,这个有什么用呢?用处大了,比如以这一步为基础,下一步通过注入来做更多研究工作. 注入的最小单位是函数,实际上,编译执行的程序在编译后,类就不复存在了,留下来 ...

  8. [转] 在安卓设备上使用 Chrome 远程调试功能

    你的网页内容在移动设备上的体验可能和电脑上完全不同.Chrome DevTools 提供了远程调试功能,这让你可以在安卓设备上实时调试开发的内容. 安卓远程调试支持: 在浏览器选项卡中调试网站. 在原 ...

  9. 移动应用调试之Inspect远程调试

    移动应用调试之Inspect远程调试 一.准备工作 chrome浏览器,建议最新版本 如果你点击inspect打开的DevTools窗口一片空白,且刷新无效时,那极有可能是由于被墙的缘故. 二.Ins ...

随机推荐

  1. hdu 1162(最小生成树)

    Eddy's picture Time Limit: 2000/1000 MS (Java/Others)    Memory Limit: 65536/32768 K (Java/Others)To ...

  2. 使用Android Studio开发调用.NET Webservice 之初体验

    本人是.NET出身 但苦于领导要让研究Android 外壳然后准备套html5  ,当试验兵真坑啊 但也没办法 咱还得研究啊,索性 不辜负领导的期望(也研究好两三天了)总算弄明白了 app本地存储 和 ...

  3. 使用after伪类,配合IE的zoom或者overflow清除浮动

    用after伪类实现,兼容多种浏览器:.clearfix:after {content:"."; display:block; height:0; clear:both; visi ...

  4. 磁盘镜像工具Guymager

    磁盘镜像工具Guymager   在数字取证中,经常需要对磁盘制作镜像,以便于后期分析.Kali Linux提供一款轻量级的磁盘镜像工具Guymager.该工具采用图形界面化方式,提供磁盘镜像和磁盘克 ...

  5. exports 与 module.exports 的区别

    exports与module.exports的作用就是将方法或者是变量暴露出去,以便给其他模块调用,再直接点,就是给其他模块通过require()的方式引用. 那么require()一个模块时,到底做 ...

  6. CENTOS设置MYSQL字符集

    CENTOS设置MYSQL字符集 show variables like 'character_set%'; vim etc/my.cnf 修改成如下: [client] port=3306 sock ...

  7. 【linux】linux上 查看tomcat日志文件

    1.查看实时日志文件 tail -f catalina.out 2.实时查看日志文件 最后n行 tail -n -f catalina.out 3.退出tail命令 ctrl + C 4.翻页查看 日 ...

  8. 【Linux】CentOS7上安装JDK 和卸载 JDK 【rpm命令的使用】

    之前有过一篇在CentOS7上安装JDK的文章:http://www.cnblogs.com/sxdcgaq8080/p/7492426.html 在这里又说一次,是要使用rpm命令安装JDK的rpm ...

  9. Android background tint颜色渲染

    该篇文章主要是讲Android颜色渲染,首先先来看看PorterDuff,对绘图非常重要. PorterDuff的由来: 相信大多数人看到这个ProterDuff单词很奇怪了吧,这肿么个意思呢,然后就 ...

  10. C++STL中的向量vector

    #include<iostream>#include<vector>#include<algorithm>using namespace std;typedef v ...