JerryQu的小站

今天Miller兄分享了一个很好的工具Weinre(WEb INspector REmote)，可以在一个Webkit下远程调试另一个Webkit里的网页，典型应用就是在桌面浏览器里调试iPhone、iPad等移动设备上的Safari。刚好之前小强有类似需求，这里就简单介绍下它的基本用法。

首先，去这里下载Weinre的最新版。这个目录有两个zip包，下载那个weinre-jar-x.x.x.zip就好了，解压得到weinre.jar，随便找个目录放。那个mac包可以忽略，它只是把jar打包成一个图标巨难看的app，还不如直接用jar方便。

然后打开终端，进到weinre目录，运行下列命令，以指定端口和要绑定的ip启动weinre服务（假设java环境变量已经配好）：

java -jar weinre.jar  --httpPort 1070 --boundHost -all-

接着打开基于webkit的浏览器，输入http://<your-ip>:1070，应该会看到这样的画面：

Read the rest of this entry »

调试代码是每个程序开发者必须熟练掌握的技能，前端开发也不例外。只要你的浏览器不是太陈旧，按下F12就能看到各种调试控制台。这里不打算讲具体项目中如何调试代码，而是介绍下如何在Opera桌面版里远程调试Opera Mobile中的页面。

先下载最新的Opera Mobile Emulator，装好运行，再打开Opera桌面版（版本不要太低），通过热键（Ctrl+Shift+I）或右键点击“检查元素”，激活Opera调试工具Dragonfly。接下来分别在Dragonfly和Opera Mobile（在地址栏输opera:debug敲回车）配置远程调试。

Read the rest of this entry »

在测试或者优化web应用时，经常需要替换一些静态资源，如css/image/js等。当然，这些工作是在开发环境来做，直接ftp替换也没什么问题。但有的时候仅仅是想调研一下而不想影响环境的稳定，或者想方便的对比两段代码效果，就可以利用一个小工具来完成工作——Fiddler。

先来简单的介绍下Fiddler(官网|需要.NET Framework v2.0|MicroSoft出品)：一个集web性能分析、数据监测、自动响应、创建请求四大功能于一身，自带众多实用小工具，支持插件扩展的HTTP调试工具。通过简单的配置代理(IE中全自动、FF中需如下图手动配置)，就可以开始使用Fiddler了。

这篇文章讲的只是利用fiddler来替换静态资源，利用的是它的自动响应功能。选择软件右侧的AutoResponder这个tab，点“Add”按钮来添加一条规则，在Rule Editor里的文本框填上要被替换资源的url，后面的文本框选择源文件就OK了。如下图：

搞定，就这么简单，现在只要请求被命中，就会被转发到指定的源文件了。修改代码后保存一下F5就能生效，既方便又不会影响到他人。这个功能挖掘下还可以干一些其它有意思的事情：配置Rule时，选择转发404之类的错误码，就可以用来测试Ajax的onError事件；把类似于Http://www.***.com/1.html这样的url转发到本地页面，就可以在本地代码里用Ajax请求www.***.com的内容。由于本地页面是通过Http://www.***.com/1.html来访问，不再有跨域问题了。这在做一个获取数据程序的时候很有用。虽说最后还是要用后端程序来解决跨域问题，但开发前期利用Fiiddler做转发，非常的高效！

本文链接：http://www.imququ.com/post/45.html

--EOF--