最近从3月份开始做了三个移动端的app，主要采取的是hybird的开发方式。
开发工具用：android studio。android studio是一款很强大的开发工具和webstorm同属idea公司，开发界面和快捷方式都非常类似。很适合web工程师开发hybird的app。
前端框架用：cordova和angular，做的单页面应用。因为公司这块要保持接口的纯净性和统一性，前端拿到数据都需要进行一系列操作，做成符合自己的数据再去渲染页面。所以我采用angular框架。
以后我会陆续跟大家分享一些hybird开发需要注意的问题已经工具。
今天先整理了下远程调控方法。
用web去开发移动app的时候，对于刚接触hybird开发的web人员最困惑的就是调试了。特别是js断点跟代码的问题。移动端不能像pc端浏览器按下f12就弹出控制台进行调试。因为现在web代码运行的环境变成了webview里面内嵌的浏览器（不同系统不同厂商会对内嵌的浏览进行一些篡改，特别是4.4系统下低版本的Android移动设备，会出现一些js，css的兼容性的问题）
目前我总结了两种远程调控的方式：
一，FQ通过chrome远程模拟调试方法。
具体操作：
1，需要先在MainActivity这个java类中进行一个设置
public void onCreate(Bundle savedInstanceState)
{
super.onCreate(savedInstanceState);
// Set by <content src="index.html" /> in config.xml
getDatas();
if (SDK_INT>= Build.VERSION_CODES.KITKAT) {//允许进行远程调控
WebView.setWebContentsDebuggingEnabled(true);
}
}
2，在chrome浏览器地址栏输入chrome://inspect/#devices显示如下界面
点击后显示的调试界面
进入远程调试控制台的时候就可以很正常的pc端web调试一样使用了。
好处：
1，调试非常方便基本和pc的chrome调试是一样的。随时断点，改样式！爽歪歪啊！
2，不需要对服务器进行操作，只需要在客户端进行设置就能调试。不会遗留残留的调试代码，影响项目代码的提交。
劣势：
1，只能用数据线连着电脑上调试（其实这个不算远程调试，第二种调试方法才叫真正的远程调试）。
2，不能同时查看调试多台运行app的设备（这个不是很需要）
3，Android4.4系统以下的webview不支持这种调试方式。尼玛，坑爹啊。不过现在的手机基本都是4.4以上的系统了，我手机两年前买的酷派都是4.4系统的。在开发手机移动端的童靴不必担心这个问题了。那么如果你的开发设备是pad 的话就坑了啊，我们公司的pad基本都是4.2系统的（应该是4年前，2012年出来的）这块的不支持chrome的远程调试。
二，如果你的开发设备是4.4以下系统的，你就可以用weinre进行调试了。
weinre 我所知道的有两个版本的一个是java开发的java版（之前用了，感觉开启的时候不是很方便后来改成nodejs版的了），另一版本是nodejs版本的。
先大概介绍下weinre
Weinre(WebInspector Remote)是一款基于Web Inspector(Webkit)的远程调试工具，借助于网络，可以在PC上直接调试运行在移动设备上的远程页面，中文意思是远程Web检查器，有了Weinre，在PC上可以即时修改目标网页的HTML/CSS/JavaScript，调试过程可实时显示移动设备上页面的预览效果，并同步显示设备页面的错误和警告信息，可以查看网络资源的信息，不过weinre不支持断点调试。该项目目前是 Apache Cordova 的一部分。
weinre工作原理
两张图读懂Weinre的工作机制：
上述三层结构示意图的含义：
Debug客户端（client）：本地的WebInspector，远程调试客户端。
Debug服务端（agent）：本地的HTTPServer，为Debug目标页面与Debug客户端建立通信。
Debug目标页面（target）：被调试的页面，页面已嵌入weinre的远程js。
客户端、目标页面与Debug服务端之间使用XMLHttpRequest (XHR)进行HTTP通信，你通常的使用情形是将Debug客户端与服务端搭建在桌面开发环境，Debug目标页面放在移动设备。
由于Weinre的debug客户端是基于Web Inspector开发，而Web Inspector只兼容WebKit核心的浏览器，所以只能在Chrome/Safari浏览器打开Weinre客户端进行调试。
我在Chrome 38/39版本测试时打开Debug客户端出现页面白板，原因未知，了解原因的欢迎留言给我。换为Safari浏览器打开则正常。
Weinre系统支持性
iOS 3.1.3或更低版本不支持
webOS 1.45或更早版本不支持
Debug客户端支持的平台
weinre的Mac程序（自带客户端） - Mac OSX 10.6 64-bit
Google Chrome 8及以上版本浏览器
Apple Safari 5及以上版本浏览器
Debug目标页面支持的平台
Android 2.2+系统浏览器
Android 2.2+ 中的phonegap
iOS 4+ 的safari浏览器
BlackBerry v6.x 模拟器
webOS
chrome8+
safari5+
关于Weinre的Java版本下载地址无法访问的问题，是由于weinre被PhoneGap收购，PhoneGap又被Adobe收购，Adobe收购PhoneGap后，把PhoneGap捐给了Apache，Apache把PhoneGap放在Cordova的项目中。Weinre也从最初的Java移植到了当前的JavaScript。在GitHub上搜索weinre的结果中前两个就是官方的Weinre项目。
3，开启自己的服务器，我用的tomact。
4，启动weinre 示例：weinre --boundHost 192.168.1.100 --httpPort 8081
5，服务开启后，在你的chrome浏览器的地址栏输入http://172.16.1.145:8081/
6，将<script src="http://172.16.1.145:8081/target/target-script-min.js#anonymous"></script>插入到你需要调试的页面中
进入到调试页面了
需要说明的几点：
1，你的app连接的服务器必须和你weinre 启动的服务器一致。
2，weinre 的远程调控不能进行js断点，网络请求等功能可以实现。
3，我在用angular的时候写应用的时候，发现weinre 调试不能去很好的看样式表，会有冲突。
4，不需要设备通过数据线连着设备，可以同时查看调试多个远程的设备。