如何用chrome浏览器 开发插件 自动答题 自动抢票 自动选课
chrome开发插件网上有也有很多文章,本文的目的是记述一下自己开发一个插件的过程,知道浏览器插件开发的基本步骤。
需求:在播放过程中会弹出来一些选让用户选择,理论上这些都是有助于学习的,应该认真学完,但是有时候有的小伙伴比较忙又不得不学完视频,这个时候你就可以写一个脚本,来自动选择,这样视频就继续播放。至于抢票 选课 原理类似,复杂点的发起API就行,好了 背景交代结束。
原理和方法:原理就是实时捕获界面上边是否有弹窗提问,如果有,那就针对弹窗模拟点击,然后模拟提交,如果答错了换个答案(更高级的可以用自动化脚本来在网络上搜索答案,以达到更高的命中率)。 方法,我相信写过js的小伙伴都知道 浏览器都有个开发者 功能,在“开发者”---->console 这里边可以打印,也可以写脚本。 如果将上述步骤用js写出来,然后运行势必能达到良好效果。
插件: 如果脚本在console里边运行,不方便停止脚本和启动脚本,界面一刷新,脚本就没了。为了解决这一问题,并且做的稍微优雅一点,就采用插件。
chrome插件:好了,插件组成,一个文件夹,文件夹包括 manifest.json ,icon.png, popup.html,popup.js,content.js,background.html,background,js ,其中可以在manifest中指定插件在浏览器上边的图标icon
,就跟右边这个。manifest 定义了插件的构成。popup 定义了点击icon后的样式和行为,你可以在这里加选项 来控制插件的行为,比如启动,停止。 content是负责注入倒页面的脚本,自动选择的逻辑就在着里边实现,至于他是如何注入的,表面上看就是在manifest里边定义.background不做介绍。
这里交代一下,交互方面的,比如你需要在popup里边点击一个按钮,来禁止注入的脚本运行,那么,需要在popup里边定义两个按钮,引入popup.js ,在popupjs里边做发送消息,在content里边做接收并做处理逻辑:
<!DOCTYPE html>
<html lang="en">
<head><meta charset="UTF-8"><meta http-equiv="Content-Security-Policy" style-src 'self' 'unsafe-inline'; media-src *; img-src 'self' data: content:; connect-src *;"><meta name="viewport" content="width=device-width, initial-scale=1.0"><meta http-equiv="X-UA-Compatible" content="ie=edge"><title>Document</title><style type="text/css">.container{width: 200px;height: 100px;background: #fff;text-align: center;padding: 20px;}</style>
</head>
<body><script src = "popup.js"></script><div class="container"><button type="button" id="startButton" >Start</button><button type="button" id="stopButton" >Stop</button></div></body>
</html>
发送:
function Send(parma) {
chrome.tabs.query({active: true, currentWindow: true}, function(tabs){
chrome.tabs.sendMessage(tabs[0].id, {message:parma}, function(response) {
var result = document.createElement("div")
result.textContent=response.result
document.body.appendChild(result)
});
});
}
接收:
chrome.extension.onMessage.addListener(
function(request, sender, sendResponse) {
if (request.message == "start"){
console.log("get start")
//实现你的逻辑
sendResponse({result: "Start OK"})
}else{
console.log("get stop")
//实现你的逻辑
sendResponse({result: "Stop OK"})
}
});
下边是一个manifest例子,实际还有更复杂的配置:
{"name": "auto-answer","version": "0.0.1","manifest_version": 2,"description": "chrome auto-answer plugin","browser_action": {"default_icon": "icon.png","default_title": "public lesson auto answer","default_popup": "popup.html"},// 需要直接注入页面的JS"content_scripts": [{//要注入的页面"matches": ["*"],// "<all_urls>" 表示匹配所有地址"matches": ["<all_urls>"],// 多个JS按顺序注入"js": ["content.js"],// JS的注入可以随便一点,但是CSS的注意就要千万小心了,因为一不小心就可能影响全局样式//"css": ["css/custom.css"],// 代码注入的时间,可选值: "document_start", "document_end", or "document_idle",最后一个表示页面空闲时,默认document_idle"run_at": "document_idle"}]
}
插件文件组织形势: 没有特殊要求,可以全部放在一个目录
打包:看网上教程
注意事项:
1、popup.html里边如果又按钮控制,执行js动作,这个脚本要单独写在popup.js里边并且,逻辑都在这里边,不能再popup.html里边写,否则会报错,就是chrome考虑到安全,不支持内联函数。比如你又一个button,这里边一定要用onclick,不能用addEventListener(会导致弹出就执行一次,以后不会执行),原因不详,反正是耽搁我好几个小时。
function Send(param)
{console.log(param)
} var start ;
var stop;
window.onload = function(){
// 点击启动和停止
start = document.getElementById("startButton");
//start.addEventListener('click',Send("start"))
start.onclick=function(){Send("start")
}stop = document.getElementById("stopButton");
stop.onclick=function(){Send("stop")
}}
2。关于页面捕获的问题 class用选择器来选择,这里边只是一个例子,具体要自己分析自己的HTML类容,主要是选择器使用,如果是id,用getElementByid吧,效率高点:
//获取问题类型 单选/多选
var askType = document.querySelector('.ask-right span').innerText
console.log(askType)
//获取问题列表
var selectItems = document.querySelectorAll('.ask-form input')
console.log(selectItems[0].type);
var ItemLables = document.querySelectorAll('.ask-form label')
console.log(ItemLables[ItemLables.length-1].innerText);
var lastlabel = ItemLables[ItemLables.length-1].innerText
//选择
selectItems[0].click()
3、关于打包,打包的时候如果打过一次了,再次打 他会提示你说大报错误,说什么密钥已经存在,你可以去删除,文件位置就是你插件组织目录的同级目录。
4、Chrome开发的插件可以在360浏览器运行,火狐不行。
如何用chrome浏览器 开发插件 自动答题 自动抢票 自动选课相关推荐
- 谷歌chrome浏览器 - 关于插件,这一篇就够了
这次是干货,有多干? 正文共:5879字87图 完了,怕你们看不下去,我特意整理了PDF给大家,传送地址: https://github.com/ithuangqing/Chrome-take-off ...
- 百度云网盘不限速下载之Google Chrome浏览器+SwitchyOmega插件
众所周知,百度云的用户量越来越多啦,那么随之而来的问题也来了,刚开始用户量不是特别多的时候下载速度是100多kb/s,然而,现在呢???10几Kb/s!!!慢如蜗牛的速度啊. pandownload已 ...
- Chrome浏览器高效插件/外挂总结
Chrome浏览器高效插件/外挂总结 1.AdBlock 最受欢迎的Chrome扩展,拥有超过4000万用户!屏蔽整个互联网上的广告. 2.Deluminate 对于经常熬夜的童鞋来说,这个插件可以根 ...
- Chrome浏览器扩展插件指南:从MV2迁移到Manifest V3
Chrome Web Store于2021年1月已经开始接受Manifest V3扩展的提交.如果你还在使用MV2版本,那么一定要在官方弃用之前,尽快更新到MV3版本. Chrome浏览器从88版本开 ...
- chrome浏览器安装插件,提示程序包无效
chrome浏览器安装插件的时候,如果提示 程序包无效:"CRX_HEADER_INVALID",导致插件安装不上去,这个时候该怎么办呢?通常,这种错误在chrome浏览器版本73 ...
- chrome浏览器安装插件显示程序包无效
chrome浏览器安装插件显示程序包无效 当给谷歌浏览器安装插件时显示出如下程序包无效的情况 解决办法: 1.将要安装的.crx文件的后缀名改为.rar 2.将改过后生成的.rar文件进行解压生成下图 ...
- chrome浏览器截图插件有哪些
chrome浏览器截图插件工具分享,当我们需要使用电脑或手机截图时,就可以使用电脑上的快捷键"Shift+Win+S"来进行截图操作,当然QQ和微信也自带截图功能对于PC端来说太过 ...
- Chrome 浏览器翻译插件划词翻译
Chrome 浏览器翻译插件划词翻译 截图 下载:划词翻译__chrome扩展插件下载_极简插件 (zzzmh.cn) 简介: 一个简便但强大的划词翻译类插件.支持谷歌.百度.有道三大翻译和朗读引擎, ...
- Chrome浏览器免插件更改Ua模拟iOS和Android等教程,附QQ和微信
Chrome浏览器免插件更改Ua模拟iOS和Android等教程,附QQ和微信 .. http://www.zuanke8.com/thread-1798313-1-1.html (出处: 赚客吧) ...
- 【Chrome浏览器开发工具笔记】
Chrome浏览器开发工具笔记 前言 一.打开浏览器开发者工具 二.浏览器开发者工具界面介绍 2.1 Element(元素) 2.2 network(网络) 2.3 Sources(资源面板) 2.4 ...
最新文章
- eclipse(或者myeclipse)常用配置方法
- 计算机无法正常更新,无法完成更新正在撤销更改请不要关闭你的计算机如何修复...
- uva 550——Multiplying by Rotation
- 437. 路径总和 III
- matlab的diray在哪,matlab笔记
- 小米笔记本写代码真香,包邮送一台!
- 182. 查找重复的电子邮箱
- Docker学习笔记五 在测试中使用Docker
- jquery获取元素颜色css('color')的值返回RGB
- RxJava在Android中的简单应用
- 角度与弧度之间的换算
- Java基础之CAS算法
- centos7下安装airflow
- webrtc音频处理源码概述
- OSChina 周二乱弹 —— 仙女抚我顶,脱发不长生
- 计算机网络有哪几种拓补结构,常见的五种计算机网络拓扑结构分析
- Arduino Uno + PAJ7620U2 实现手势识别控制LED灯工作
- twitter下载网络教程_糟糕的主意:喜p Twitter广告网络
- python 自动记录时间_python记录程序运行时间的几种方法
- 好东西下载Download
热门文章
- STM32 触摸屏触摸功能
- 企业全面移动化实践指南
- .NET Core剪裁器背后的技术
- 华师大的计算机专业属于提前批吗,关于华师大、上师大提前批的问题
- HFSS求解类型和求解设置
- cefsharp启动优化
- linux解压带密码zip,linux下解压有密码的rar压缩包的方法
- cdr转换成html格式,cdr生成对象
- 2021-03-02 Windows远程桌面简易教程
- 打开应用商店显示服务器出错了,Win10应用商店提示“我们这边出错了”的三种解决方法...