自动填写登录个人信息的油猴脚本
——基于TGU教务处系统开发
功能:在教务系统登录界面实现自动输入学生账号密码,避免每次重复手动输入
个人信息在本地运行,明文存储密码。可同时起到备忘作用
(其实是不会加密解密)(请注意尽量不要让不信任的人接触你的电脑,防止个人信息泄露)。
油候脚本使用js代码实现。测试工作在TGU(天津工业大学)教务处实现。
油猴脚本头部注释文档部分:
// ==UserScript==
// @name TGU_教务系统自动输入信息 By Limonene0x
// @namespace limonene0x
// @version 0.1
// @description 在教务系统要求复杂密码后实现自动输入学生账号密码,避免每次重复手动输入,本地运行明文存储密码备忘(请注意尽量不要让不信任的人接触你的电脑,防止个人信息泄露)。
// @author Limonene0x
// @match http://jwxs.tjpu.edu.cn/login
// @icon http://jwxs.tjpu.edu.cn/img/icon/favicon.ico
// @homepage https://github.com/limonene0x
// @license MIT
// @grant none
// ==/UserScript==
- name是脚本的名称
- namespace尚不明确
- version是脚本的版本号
- description是脚本说明
- author是作者名
- match是脚本匹配的域名,可以使用
*
作为通配符 - icon是脚本的图标
- homepage是脚本的发布主页
- license是脚本遵循的开源协议
- grant尚不明确
- 注释文档部分前后使用
// ==UserScript==
与// ==/UserScript==
包围起来
匹配的网址可以自己设定到本校的教务系统。
开发过程
在目标网页打开开发者检查工具,(或直接)按Ctrl+Shift+C
开始选择元素,将鼠标移动到要自动填充的用户名框上单击,会自动跳转到目标代码处
这里因为元素的唯一编码是id
因此我们选择使用id
来定位元素。
js中使用document.querySelector()
来选择元素,使用#
来表示id
,因此查找本示例中的id="input_username"
的语句就是document.querySelector('#input_username')
同理密码输入框即可使用document.querySelector('#input_password')
来查找
程序设计的目的是把我们自己的信息自动填入对应文本框,因此预先设置两个变量存放要输入的学号信息和密码
var stu_num = '1234567890' // 学生学号(请在单引号内填写)
var stu_pwd = 'aBcD_1234.' // 学生密码(请在单引号内填写)
考虑到其他页面中脚本也可能会偶然被加载,因此判断当没有
input_username
元素时直接返回,不做操作if(document.querySelector('#input_username') == null) { return; }
在正确的页面中即可将变量中的我们的个人信息输入到对应文本框中
document.querySelector('#input_username').value = stu_num
document.querySelector('#input_password').value = stu_pwd
到此即可实现个人信息的自动填充。
还可以略加一个判断,提示是否弹出填充成功提示,并预先设置是否启用。
var over_notice = 0 // 填写完毕提示框:1为弹出提示;0为不弹出提示
if(over_notice != 0)
{
setTimeout(function()
{
alert("您的学号和密码已经输入完毕,请填写验证码登录");
}, 1000);
}