#响应式实践(1)-移动端Web开发环境的搭建(更新ADB plugin调试)
本文主要总结一下移动端进行前端开发时需要用到的一些工具，以及他们之间互相的组合，同时也包括本人使用的组合。
PC机上安装该chrome插件；在手机端安装chrome浏览器，登录chrome帐号， 启用“Chrome 转发至移动设备服务”； 在PC端上输入对应要调试的网址，然后点击发送到手机， 则会将该网址发送到手机端。免去了移动端上输入网址困难的烦恼。
注：ios chrome 与android chrome 都支持该功能
##2-1. 调试—有线
###Android chrome + Wndows/Mac OS
####Android SDK
(1) 安装Android SDK
***下载>解压>设置PATH为
(2) 手机启用USB调试模式
设置>开发者>开启USB调试模式
(3) chrome启用USB网页调试
设置> 开发者工具 > 启用USB网页调试
(4)用USB线连接移动设备
(5)开启adb服务器
命令行进入sdk/platform-tools目录>输入
adb forwrad tcp:
(6)访问localhost:
注：启动服务遇到错误的情况, 运行adb kill-server。 iOS Chrome不支持这种方式调试
####ADB Plugin + MAC(2013-6-24更新)
今天偶然发现了这个方案, 有MAC的同学可以完全取代上面的使用SDK调试方法, 毕竟每次启动命令行挺麻烦的. 步骤如下: (1)下载 Chrome Canary
(2)下载 ADB Plugin 并安装在Chrome Canary上
(3) 开启手机 “USB调试模式”
注: 若手机已经开启过, 可以先关闭再开启, 避免手机没有记录下你机器的物理地址.
(4) 开启手机chrome USB网页调试
(5)点击ADB插件, 有惊喜.
###iOS Safari + MAC
该方法只适用safari6.0+的版本。
(1) 手机进入偏好设置，点击safari，开启web检查器；
(2) Mac下进入safari的偏好设置，显示“开发”菜单；
(3) 手机链接Mac， 查看MAC Safari “开发”菜单，会有你的ios设备名的一行选项，这下面的子菜单就是你的ios safari上打开的网页
###weinre
该方案我这不介绍了，有兴趣的读者可以网上搜之。 因为我很讨厌这种调试方式， 一个是要引入额外通信脚本，IP一边，脚本地址又要变； 一个是速度慢得要死。 用过一次后， 就被我抛弃了。
###MIHTool
该方法只适用于iOS系统， 具体用法就不多说了，直接点击标题链接吧， 方便，强大，易上手，移动端有Iphone和Ipad的， 我推荐直接用这个工具了。因为没有那么多繁琐的安装步骤。
##3. HOST绑定
###(1) PC和MAC开启代理服务器
####Fiddler
Fiddler只有windows版，所以该方法只适合windows系统。
Fiddler>Tools>Fiddler Options>Connections
####Nproxy
node编写；
安装简单： npm install nproxy -g
使用方便： nproxy
默认运行在8989端口， 加-p选项和端口号可以设置运行的端口
适用于win和mac， 同时也具备了fiddler的文件替换功能， 具体可以点击标题链接查看更详细的功能。
注： 该工具目前暂时无法代理手机端下的https请求， 已经反馈给作者，期待修复。
###(2) 手机端设置代理
进入wifi设置， 选择手动输入代理服务器， 输入PC和MAC的IP及相关端口即可。 此时，手机使用的就是你桌面机器的hosts。
PS: Android上有个设置代理的应用，叫DroidProxy， 可以帮你保存设置过的代理地址，这样你就不用每次都再去输入代理地址了。 iOS大家可以补充下。
##我的心得和总结
我自己使用的方案如下：
Chrome To Mobile（必备了，没什么选择）
###调试上：
iOS设备上使用 MIHTOOL， 实在是方便。
Android机上只选择usb调试， weinre太恶心了，太恶心了= =！
###hosts绑定上：
我选择的是nproxy， 一行命令就开启了代理， 且资源消耗小，另一方面，撸主有MAC- -!