移动开发必备的浏览器插件--user agent switcher

userAgent

相关资料

浏览器信息大全：http://techpatterns.com/forums/about304.html

User Agent Switcher是什么

在知道User Agent Switcher是什么之前，我们先了解了解HTTP_USER_AGENT。
HTTP_USER_AGENT是用来检查浏览页面的访问者在用什么操作系统（包括版本号）浏览器（包括版本号）和用户个人偏好的代码。在浏览器中，通过javascript获取这个参数的方法是：

var HTTP_USER_AGENT = navigator.userAgent ;
//通过不同的浏览器和系统你可能得到不同的信息，
//如果："Mozilla/5.0 (Windows NT 6.1; WOW64) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/35.0.1883.0 Safari/537.36" 

为什么我们需要这样一个插件从上面我们就可以大概知道，User Agent Switcher就是一个模拟不同浏览器和设备下HTTP_USER_AGENT信息的插件了。

既然了解了User Agent Switcher是什么的话，我们也就自然了解了他是用来干什么了。

在做web移动端或者说需要对指定系统版本和浏览器等进行相关特殊处理、开发的时候，我们就需要判断系统和浏览器相关的信息，而这样的开发工作意味着我们需要很多的设备去调试，从而判断在该版本下的应用是否已经达到了我们的开发需求。而事实却是明摆的，在真正的开发工作中，我们是不可能有如此多的设备提供我们进行开发调试的，所以User Agent Switcher插件的存在为我们提供了需要的任意设备类型浏览器版本的HTTP_USER_AGENT模拟数据。让我们可以在web中并得到了相关设备浏览器的真实环境的效果。（ps:该插件模拟的是HTTP_USER_AGENT数据，如果在配上相关的响应式调试工具使用，效果更佳。）

使用方法
1. 配置User-Agent-Swithcer
插件安装后已经默认配置了部分浏览器和设备的USER_AGENT信息了，对于新的信息，我们可以通过Add按钮来添加，这里我们可以去相关资料中提供的USER_AGENT列表查找相关的内容。这里要注意的是Group是指我们将对自己新定义的这个USER_AGENT信息存放到下面的那个分组中，而Append则指明，你的这个USER_AGENT信息对于当前系统原有的该信息是要进行在此之后添加或者是直接替换。

1. 启用插件
   我们只需要点击插件选择相关的标识名称就可以启动插件了。

2. 在开发中使用调试
   一开始你可能会发现，我启用了插件，但是不能正常的模仿选择的设备信息，原因很简单，你需要在代码一开始的地方打一个断点。原因和简单，在你刷新页面的时候，页面代码和这个插件是异步处理的，我们如果在插件没有完成修改USER_AGENT之前并获取了当前浏览器中原始的USER_GAENT信息，那必然插件的效果就失效了。

备注：其实在各个浏览器中，像这样的插件很多，而使用的方式方法大同小异，所以这里主要针对User Agent Switcher for Chrome的这个插件来说的（插件图标见文章标题下）