chrome插件 注入js以及发送ajax(message/request)

注入js来源:http://www.2cto.com/article/201307/225986.html

发送ajax来源:http://www.cnblogs.com/onlyfu/p/4458025.html

manifest.json 内容

知识点包含:
* content_scripts注入js,background.scripts用来发送请求(content_scripts禁止发送ajax)
* Message 和 Request 区别

manifest

{
  "name":"Catch your Data",
  "description":"Catch every data what you need",
  "version":"1.0",
  "permissions": [
    "tabs", "http://*/*", "https://*/*","http://service.miniice.cn/"
  ],
  "browser_action": {
      "default_title": "Get this page's Data.",
      "default_icon": "icon.png",
      "default_popup": "popup.html"
  },
  "manifest_version":2,
  "content_scripts": [
    {
      "js":["jquery-2.2.0.min.js","content_script.js"],
      "matches":["https://sycm.taobao.com/portal/*"]
    }
  ],
  "background": {
        "scripts": ["jquery-2.2.0.min.js","background.js"]
    }
}

标签脚本(content_script)和背景页(background)交互可以有多种方式
其中我使用过 Message 和 Request
Message用于立即响应消息,多用于读取早已缓存的信息,不适合异步
Request多用于异步请求服务器

Message 要这么写

content_script.js?内容

var jsonarr={
  'name':'abc'
}
chrome.extension.sendMessage(jsonarr, function(ret){
        console.log(ret);
      });

background.js 内容

chrome.extension.onMessage.addListener(function(objRequest, _, sendResponse){
  var send={
        "data":objRequest,
        "info":"以上是您输入的信息",
        "status":1,
    }
    sendResponse(send);
});

Request 要这么写

content_script.js?内容

var jsonarr={
  'version':'abc123'
}
chrome.extension.sendRequest(jsonarr, function(ret){
        console.log(ret);
      });

background.js 内容

chrome.extension.onRequest.addListener(function(objRequest, _, sendResponse){
    $.post("deal.php",objRequest,function(ret){
        sendResponse(ret);
    })
});