浏览器插件－自动登陆淘宝（－）

发布升级版：

Mainfest工程配置文件：mainfest.json，最基础的文件，也是最重要的文件。

从后缀可以看出它是JSON格式的文件realplayer插件，JSON格式的介绍：

JSON   (JavaScript Object Notation) 是一种轻量级的数据交换格式。它基于ECMAScript的一个子集。 
　　　　JSON采用完全独立于语言的文本格式，但是也使用了类似于C语言家族的习惯（包括C、C++、C#、Java、JavaScript、Perl、Python等）。
　　　　这些特性使JSON成为理想的数据交换语言。 易于人阅读和编写，同时也易于机器解析和生成(一般用于提升网络传输速率)。

［来自百度百科］

案例如下：

manifest_version

manifest文件内容格式的版本，目前格式为2，本次介绍的格式都是基于该版本的.

version

该浏览器插件的版本。

name

该浏览器插件的名称。

description

该浏览器插件的表述信息。

browser_action

浏览器插件的工具栏图标。

permissions

浏览器插件必须的权限，支持正则匹配。google针对安全性是非常注重，该配置也有重要的环节！

background

浏览器插件后端程序，大部分浏览器插件api，以及https网页都应该后端程序来完成。如：获取浏览器插件的版本号。

content_scripts

页面注入配置。例如：向域名为xx的注入一串输出hello world的脚本，就应该该配置realplayer插件，同时也必须配置拥有该域名xx的权限。

了解怎么注入scripts文件，我们先借助一个实例来认识。

本次案例是怎样在淘宝登陆页面上手动键入用户名和密钥。

1.manifest.json permissions配置

"permissions":[
"https://login.taobao.com/*"
]

＊正则匹配符

2.manifest.json content_scripts配置

"content_scripts":[
　　{
　　　　"matches":["https://login.taobao.com/*"],
　　　　"js":["taobao_login.js"],
　　　　"run_at":"document_end",
　　　　"all_frames":true
　　}
]

matches: 需要注入的类库页面的URL，支持正则表达式。

js: 注入的脚本文件，相对模式。

run_at: 注入的位置，document_start文档的开始，document_idel文档的后面 , document_end文档的末尾。

all_frames: 是否全frame注入，比如页面使用了iframe或者frame。

3.编写taobao_login.js

语法为javascript，当然你也可以采用jquery。引入的配置为：

本次案例为纯javascript，先查看淘宝的注册页面。

通过页面DOM树的查看，我们获知用户名和密码键入的Dom标识。

相应的taobao_login.js代码为：

setTimeout(function(){
    var username = document.getElementById(‘TPL_username_1‘);
    username.focus();
    username.value = "oShine";
    var password =   document.getElementById(‘TPL_password_1‘);
    password.focus();
    password.value = "oShine";
    var submitStatic = document.getElementById("J_SubmitStatic");
    submitStatic.focus();
    setTimeout(function(){
        //检测是否需要安全验证
        var noCaptcha = document.getElementById("nocaptcha");
        if(noCaptcha && noCaptcha.className == "nc-container tb-login"
            && noCaptcha.style.display !="block") {
            var submitStatic = document.getElementById("J_SubmitStatic");
            if(submitStatic) submitStatic.click();
        }
    },2000);
},3000);

manifest.json:

{
  "manifest_version": 2,
  "version": "1.0.1",
  "name": "淘宝自动登录助手",
  "description": "淘宝自动登录助手",
  "browser_action": {
  },
  "permissions": [
    "https://login.taobao.com/*"
  ],
  "background": {
  },
  "content_scripts": [
    {
      "matches": ["https://login.taobao.com/*"],
      "js": ["taobao_login.js"],
      "run_at": "document_end",
      "all_frames": true
    }
  ]
}

案例结束！！

下一章节、介绍backgroup的应用

本文来自电脑杂谈，转载请注明本文网址：
https://www.pc-fly.com/a/bofangqi/article-120649-1.html