如何实用便捷的在本地真机调试WEB端HTML5网页
先简单介绍两款常用但需要一定条件或限制的工具
1、如果你能FQ
chrome在32版本后就自带了移动端调度工具,可以在Android直接联调,但唯一遗憾的是,在我大天朝要FQ后才能行的通,我自己试了后公司好几个机器联不上…
2、如果你有苹果电脑和iphone
苹果电脑上的safari 6.0版本后就可以直接连接iphone手机调试手机版上safari正在浏览的web页面,前提是你得有个苹果电脑和iphone手机,但如果你是Android的话,就没办法了
符合前端B格的“小苹果”
自己在公司里也是开发Mobile端的HTML5页面的,也深受调试页面之苦,移动端的WEB页面坑又多,所以用node-webkit技术做了一个客户端,专门用来调试,现在每天工作之前都先打开“小苹果”
小苹果用的是node-webkit技术打包成客户端,其实内部实现都是web 页面与nodejs技术,所以特别符合前端B格。而且由于用了node-webkit技术,客户端可以跑在windows和mac电脑上,齐活儿了

里边有下载及安装和使用的方法
有图有真像


小苹果的好处
1、自带本地服务器
无需复杂的配置,不像apache或tomcat,一大堆设置,咱要的就是简单,小苹果本地服务其实就是用nodejs来写的
2、打开就用
将weinre移动端远程调试工具集成到了里边,打开就用,可以调试iphone,android上的web页面,webview中的页面一样可以远程真机调试
再也不需要自己到官网下载nodejs,再下载weinre, 再通过配置,再运行 ..
结束语
小苹果自己在公司的几个移动端项目中一直用,觉得很简单实用,所以推荐给大家用用看,当然了,现在只是alpha版本,存在很多不足,请见谅,希望我有时间慢慢把功能与体验做的更好吧;
本人书读的不多,技术有限,做的不好请喷,欢迎技术交流..
特别感谢:盛大文学
========================================================
相关技术资源
weinre: http://people.apache.org/~pmuellr/weinre-docs/latest/
node-webkit: https://github.com/rogerwang/node-webkit
nodejs: http://www.nodejs.org/
========================================================
转载处请注明:博客园(王二狗)willian12345@126.com
如何实用便捷的在本地真机调试WEB端HTML5网页的更多相关文章
- Android真机调试访问本地服务器(localhost)的解决方案
Android系统把它自己作为了localhost!当连接localhost都是他自己啊.. 囧,在这里晕了好久才发现.. 网上介绍的都是模拟器连接本地服务器的,我试着把链接改为http://10.0 ...
- XE7 & IOS开发之开发账号(2):发布证书、发布授权profile的申请使用,附Ad hoc真机调试、生成ipa文件演示(XCode所有版本通用,有图有真相)
网上能找到的关于Delphi XE系列的移动开发的相关文章甚少,本文尽量以详细的图文内容.傻瓜式的表达来告诉你想要的答案. 原创作品,请尊重作者劳动成果,转载请注明出处!!! 注意,以下讨论都是以&q ...
- XE7 & IOS开发之开发账号(1):开发证书、AppID、设备、开发授权profile的申请使用,附Debug真机调试演示(XCode所有版本通用,有图有真相)
网上能找到的关于Delphi XE系列的移动开发的相关文章甚少,本文尽量以详细的图文内容.傻瓜式的表达来告诉你想要的答案. 原创作品,请尊重作者劳动成果,转载请注明出处!!! 注意,以下讨论都是以&q ...
- iPhone 真机调试应用程序
原文:http://blog.sina.com.cn/s/blog_68e753f70100r3w5.html 真机调试iphone应用程序 1.真机调试流程概述 1) 真机调试应用程序, ...
- 开源项目在真机调试(Coding iOS 客户端为例)
一.前言 iOS 13学习系列:如何在github下载开源项目到本地(Coding iOS 客户端为例)已经把 Coding iOS 客户端源码下载到本地. 但项目进行真机调试遇到很多问题. 二.问题 ...
- XE7 & IOS开发之开发账号(3):证书、AppID、设备、授权profile的申请使用,附Debug真机调试、Ad hoc下iPA文件生成演示(XCode5或以上版本推荐,有图有真相)
网上能找到的关于Delphi XE系列的移动开发的相关文章甚少,本文尽量以详细的图文内容.傻瓜式的表达来告诉你想要的答案. 原创作品,请尊重作者劳动成果,转载请注明出处!!! 注意,以下讨论都是以&q ...
- XE6 & IOS开发之免证书真机调试(1):颁发属于自己的App签名证书(有图有真相)
网上能找到的关于Delphi XE系列的移动开发的相关文章甚少,本文尽量以详细的图文内容.傻瓜式的表达来告诉你想要的答案. 原创作品,请尊重作者劳动成果,转载请注明出处!!! 1.自己给自己颁发证书, ...
- ios申请真机调试( xcode 5)详细解析
已经有开发证书的直接跳过第一步 第一步:申请"开发证书" 进入苹果开发者99美元账号: 选择:Certificates, Identifiers & Profiles 关于 ...
- 移动前端页面与Chrome的远程真机调试
一年不见,博客园都长草啦...... 前几日刚入手新手机小米5,系统真心流畅呀.为啥要买小米5呢,因为要提高生产力呀,好好玩移动前端开发呀哈哈哈 那么问题来了,要怎么调试手机上的前端页面呢? 很久很久 ...
随机推荐
- (九) 使用Jmeter 做分布式压测 ;
在使用Jmeter进行性能测试时,如果并发数比较大(比如最近项目需要支持1000并发),单台电脑的配置(CPU和内存)可能无法支持,这时可以使用Jmeter提供的分布式测试的功能. 一.Jmeter分 ...
- UserAgent 设置 php 抓取网页
转载:http://www.webkaka.com/tutorial/php/2013/111846/ hp抓取网页,可谓轻而易举,几行代码就可以搞定.不过,如果你有所疏忽,程序写得不够严密,就会出现 ...
- wpf下使用NotifyIcon
以前在winForm下使用过NotifyIcon,到wpf找不到了,在wpf下还是直接用WinForm里的那个NotifyIcon实现最小到系统托盘 定义一个NotifyIcon成员 : Notify ...
- Codeforces 748D Santa Claus and a Palindrome
雅礼集训期间我好像考完试就开始划水了啊 给出k个长度相同的字符串,每个串有一个权值,选出一些串连成一个回文串.使得选中的串的总权值最大. 如果选一个串,必须同时选一个对称的串.还有一个特殊情况是可以在 ...
- BZOJ4898/5367 Apio2017商旅(分数规划+floyd)
如果要在某点买入某物品并在另一点卖出,肯定是走其间最短路径.于是预处理任意两点间的收益和最短路径,连完边二分答案判负环即可,可以全程floyd.注意inf大小. #include<iostrea ...
- 创建 cachingConfiguration 的配置节处理程序时出错: 未能加载文件或
C:\Users\xxx\Documents\IISExpress\config\applicationhost.config 将这里面带的项目路径替换成你当前路径 {"创建 caching ...
- XML 增加属性
var resultDoc = new XmlDocument(); resultDoc.LoadXml("<root></root>"); resultD ...
- 【MVVM 原生】原生MVVM的使用
一.前言 前些天需要完成一个任务,该任务属于公司的一些核心代码,为了避免不必要的麻烦,任务要求不能使用第三方的MVVM框架,必须用原生的. 平时习惯了Dev与MVVMLight,遇上原生的 ...
- Unity3D for VR 学习(7): 360°全景照片
在VR应用中,有一个相对简单的虚拟现实体验,那就是360°全景照片浏览器, 他可以使得手机拍照的”全景”照片, 得以”恢复”当时拍照的场景全貌, 这个创意的确比单纯的2d图片更有震撼力一些,故本文 ...
- Linux集群--指定各个机器名字
centOS7设置主机名:命令hostname可以查看当前主机名 虚招(临时的):重启机器后失效: hostname XXX 实招(永久的): 招式一: 将/etc/sysconfig/networ ...