Chrome Extension 的 webRequest模块的解读

Chrome Extension 的 webRequest模块的解读

 

文档在此：http://developer.chrome.com/trunk/extensions/webRequest.html

1，为了使用webRequest，首先需要在配置文件manifest.json中加入类似的内容：

{
    “name": "My extension",
    ...
    "permissions": {
        "webRequest", "*://*.google.com"
    },
    ....
}

这里的意思是说，只允许这个extension对*.google.com的域名使用webRequest，如果这个字符串替换为其它格式的，比如*://*，就可以支持所有的网站访问了。

2，webRequest的核心意思就是要伪造各种request，那么就不单单是写某个对象的数据这么简单，还需要选择合适的时机，在发送某种request之前伪造好它，或者在真实的request到来之后半路截获它，替换成假的然后再发出去。Life cycle of request就是描述这个事情的。

其中，onBeforeSendHeaders这个回调比较有用，文档中如此描述“这个事件将允许extensions添加、修改或删除request headers。简单的用法如下：

chrome.webRequest.onBeforeRequest.addListener(
    callback, filter, opt_extraInfoSpec);

a，callback被调用时将被赋予包含request信息的一个参数。

b，filter参数是一个object，有这些key可用：

URLs：类似这种格式的字符串：*://www.google.co/foo*bar

Types：像main_frame或sub_frame，image这样的类型

TabID：tab的标识符

WindowID：window的标识符

3，因为可能多个extension都要玩webRequest，所以需要一套冲突处理机制。如果设置了新的request，刷新页面后是否设置继续有效，设置了之后什么时候有效，这些都是关于cache的问题。另外就是使用timestamp属性的问题，凡从timestamp取得的属性值，相互之间可以比较，但是如果和new Date().getTime()这种方式取得的值比较就不一定对了，需要加以注意。

4，例子

a，阻止所有发往www.evile.com的request

chrome.webRequest.onBeforeRequest.addListener(
  function(details) {
    return {cancel: details.url.indexOf("://www.evil.com/") != -1};
  },
  {urls: ["<all_urls>"]},
  ["blocking"]);

另一种方法，使用filter：

chrome.webRequest.onBeforeRequest.addListener(
  function(details) { return {cancel: true}; },
  {urls: ["*://www.evil.com/*"]},
  ["blocking"])

符合filter的都被cancel掉了。

b，从所有的request中删除User-Agent的header

chrome.webRequest.onBeforeSendHeaders.addListener(
  function(details) {
    for (var i = 0; i < details.requestHeaders.length; ++i) {
      if (details.requestHeaders[i].name === 'User-Agent') {
        details.requestHeaders.splice(i, 1);
        break;
      }
    }
    return {requestHeaders: details.requestHeaders};
  },
  {urls: ["<all_urls>"]},
  ["blocking", "requestHeaders"]);

5，各种API文档

a，RequestFilter:

RequestFilter = {
    tabId: interger, //optional
    //URL的数组，或者是匹配URL的pattern
    urls: array_of_string,
    //可选的值有:"main_frame", "sub_frame", "stylesheet", "script", "image", "object", "xmlhttprequest", "other"
    types: array_of_enumerated_string, //optional
    windowId: integer //optional
};

// 设置了blocking关键字的就用这个object来作为block的规则了
BolockingResponse = {
    //为true的话request被cancel，在onBeforeRequest里面用哦
    cancel: boolean, //optional
    //只在onBeforeRequest事件中使用，用来掉包的关键属性！！！
    redirectUrl: string, //option
    //只用在onHeadersReceived事件里，在浏览器返给server时把header给掉包
    responseHeaders: HttpHeaders //optional
    //只在onBeforeSendHeaders事件中使用。是另一个用来掉包的关键属性！！！
    requestHeaders: HttpHeaders //optional
    //只在onAuthRequred事件中使用，当然也是用来掉包的
    authCredentials: object //optional
};

HttpHeaders：HTTP headers组成的数组，数组每个元素都有自己的键值对，就是object了。这个得实际打印出来才知道。

b，onBeforeSendHeaders，在TCP连接建立之后和HTTP数据发送之前被调用的事件。调用方法：

chrome.webRequest.onBeforeSendHeaders.addListener(function(object details) {...});

其中，传给callback的参数details结构如下：

details = {
    tabId: integer, //如果没有和tab关联则返回-1
    parentFrameId: integer,
    url: string,
    timeStamp: double,
    //0表示request是在main frame里发生的
    frameId: integer,
    requestId: string,
    requestHeaders: HttpHeaders， // optional
    type: enumerated_string, //value in:  ["main_frame", "sub_frame", "stylesheet", "script", "image", "object", "xmlhttprequest", "other"]
    method: string //标准HTTP方法
};

其它事件大同小异，调用callback时传入的参数也都是details这个结构，只是某些字段会有不同的值。

6，总结：webRequest的API非常容易使用，基本上就是第四部分里三个例子的样式。当然， 要想更好地使用，还需要Http Request的一些基础知识，想伪造的话起码要知道应该伪造成什么样子才合适。

转：http://www.zengguanglik.com.cn/2014/1/20/00080.html