先简单介绍两款常用但需要一定条件或限制的工具


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网页的更多相关文章

  1. Android真机调试访问本地服务器(localhost)的解决方案

    Android系统把它自己作为了localhost!当连接localhost都是他自己啊.. 囧,在这里晕了好久才发现.. 网上介绍的都是模拟器连接本地服务器的,我试着把链接改为http://10.0 ...

  2. XE7 & IOS开发之开发账号(2):发布证书、发布授权profile的申请使用,附Ad hoc真机调试、生成ipa文件演示(XCode所有版本通用,有图有真相)

    网上能找到的关于Delphi XE系列的移动开发的相关文章甚少,本文尽量以详细的图文内容.傻瓜式的表达来告诉你想要的答案. 原创作品,请尊重作者劳动成果,转载请注明出处!!! 注意,以下讨论都是以&q ...

  3. XE7 & IOS开发之开发账号(1):开发证书、AppID、设备、开发授权profile的申请使用,附Debug真机调试演示(XCode所有版本通用,有图有真相)

    网上能找到的关于Delphi XE系列的移动开发的相关文章甚少,本文尽量以详细的图文内容.傻瓜式的表达来告诉你想要的答案. 原创作品,请尊重作者劳动成果,转载请注明出处!!! 注意,以下讨论都是以&q ...

  4. iPhone 真机调试应用程序

    原文:http://blog.sina.com.cn/s/blog_68e753f70100r3w5.html 真机调试iphone应用程序 1.真机调试流程概述 1)       真机调试应用程序, ...

  5. 开源项目在真机调试(Coding iOS 客户端为例)

    一.前言 iOS 13学习系列:如何在github下载开源项目到本地(Coding iOS 客户端为例)已经把 Coding iOS 客户端源码下载到本地. 但项目进行真机调试遇到很多问题. 二.问题 ...

  6. XE7 & IOS开发之开发账号(3):证书、AppID、设备、授权profile的申请使用,附Debug真机调试、Ad hoc下iPA文件生成演示(XCode5或以上版本推荐,有图有真相)

    网上能找到的关于Delphi XE系列的移动开发的相关文章甚少,本文尽量以详细的图文内容.傻瓜式的表达来告诉你想要的答案. 原创作品,请尊重作者劳动成果,转载请注明出处!!! 注意,以下讨论都是以&q ...

  7. XE6 & IOS开发之免证书真机调试(1):颁发属于自己的App签名证书(有图有真相)

    网上能找到的关于Delphi XE系列的移动开发的相关文章甚少,本文尽量以详细的图文内容.傻瓜式的表达来告诉你想要的答案. 原创作品,请尊重作者劳动成果,转载请注明出处!!! 1.自己给自己颁发证书, ...

  8. ios申请真机调试( xcode 5)详细解析

    已经有开发证书的直接跳过第一步 第一步:申请"开发证书" 进入苹果开发者99美元账号: 选择:Certificates, Identifiers & Profiles 关于 ...

  9. 移动前端页面与Chrome的远程真机调试

    一年不见,博客园都长草啦...... 前几日刚入手新手机小米5,系统真心流畅呀.为啥要买小米5呢,因为要提高生产力呀,好好玩移动前端开发呀哈哈哈 那么问题来了,要怎么调试手机上的前端页面呢? 很久很久 ...

随机推荐

  1. (转)微软借力.NET开源跨平台支持,布局物联网平台开发

    今天科技类最大的新闻,莫过于微软宣布.NET开发框架开源计划..NET 开源,集成 Clang 和 LLVM 并且自带 Android 模拟器,这意味着 Visual Studio 这个当下最好没有之 ...

  2. Spring异步事件

    1.发布事件 @Data public class CustomEvent extends ApplicationEvent implements Serializable { private Boo ...

  3. [LeetCode] Climbing Sairs

    You are climbing a stair case. It takes n steps to reach to the top. Each time you can either climb ...

  4. 如果使用引用方式引用了js后 则不能再本地写js 因为写了后不会有效果

    如果使用引用方式引用了js后 则不能再本地写js 因为写了后不会有效果

  5. uoj54-bzoj3434-时空穿梭

    题意 在一个 \(n\) 维空间中,求一个点可以用一个 \(n\) 维向量 \((x_1,x_2,\dots x_n)\) 表示.现在要选出 \(c\) 个点,有三个限制: 设 \(x_i\) 表示任 ...

  6. 我的bootstrap学习

    前端开发框架bootstrap Bootstrap 安装     <link ref="stylesheet" href="bs/css/bootstrap.css ...

  7. Intel WIDI (Wireless Display) 相关技术知识分析

    一. WIFI 1.如何查找WIFI设备 非p2p设备 Beacons 包(同步,SSID) 速率 1M/s 2.4G HZ 13个信道,1,6,11三个信道不重叠 2.P2P 认证 客户端在每个通道 ...

  8. 【BZOJ3771】Triple(生成函数,多项式运算)

    [BZOJ3771]Triple(生成函数,多项式运算) 题面 有\(n\)个价值\(w\)不同的物品 可以任意选择\(1,2,3\)个组合在一起 输出能够组成的所有价值以及方案数. \(n,w< ...

  9. linux(二) 基本使用命令

    一.常用命令归纳分类 课外网站  http://man.linuxde.net/               http://www.jb51.net/linux/               http ...

  10. ORACLE 中如何截取到时间的年月日中的年、月、日

    在Oracle中,要获得日期中的年份,例如把sysdate中的年份取出来,并不是一件难事.常用的方法是:Select to_number(to_char(sysdate,'yyyy')) from d ...