JS脚本实现定时到网站上签到/签退功能


Posted in Javascript onApril 22, 2020

之前介绍过使用temperMonkey屏蔽CSDN广告的方法,主要就是要针对性地分析网站结构,然后用代码去改变或者操作DOM。今天也一样,我们需要观察网页结构,找到我们要操作的按钮,触发他的click事件就可以了。下面以公司打卡签到的网站为例,做一些坏坏的事情。本文读者最好有一定的HTML和JavaScript基础。

首先,想象一下你去签到需要做什么:

  • 打开网站
  • 登陆
  • 点击“签到”按钮

然后每一步我们都可以让代码帮我们去做。

0. 如何定时

这段代码是核心,就是根据当前时间和设定的时间做差值,来确定定时器的值
看懂这段代码,后面的就都容易了。都是在利用定时器触发callback。

// user setting
const SIGN_IN_TIME = "09:30:00"; // 签到时间
const SIGN_OUT_TIME = "20:00:00"; // 签退时间

// code implementation
logTime("code start running");
const now = new Date();
const today = now.getFullYear() + "-" + (now.getMonth() + 1) + "-" + now.getDate();
var signInTime = +new Date(`${today} ${SIGN_IN_TIME}`);
logTime("signInTime", new Date(signInTime));
var signOutTime = +new Date(`${today} ${SIGN_OUT_TIME}`);
logTime("signOutTime", new Date(signOutTime));
// diff in or out
if (now > signInTime && now < signOutTime) {
 // ready to sign out for today
 console.log("Seconds to sign out for today: " + (signOutTime - now) / 1000);
 setTimeout(callback, signOutTime - now);
} else {
 // ready to sign in for tomorrow
 signInTime = +signInTime + 60 * 60 * 24 * 1000;
 console.log("Seconds to sign in for tomorrow: " + (signInTime - now) / 1000);
 setTimeout(callback, signInTime - now);
}

function logTime(str, time = new Date()) {
 console.log(`${str} -> ${time.getHours()}:${time.getMinutes()}:${time.getSeconds()}`);
}

1. 定时自动打开网站

因为大多数网站都有,“长时间未操作-自动退出”的设置。所以我们要在需要打卡的时候再打开网站。
在电脑本地跑一个程序,使用定时器。这里跑一个node程序:

const open = require('open');
logTime("Start Runing");

// user setting
const SIGN_IN_TIME = "09:30:00";
const SIGN_OUT_TIME = "20:20:00";

// code implementation
const openBrowser = async () => {
 await open('http://172.10.80.42');
};
logTime("code start running");
const now = new Date();
const today = now.getFullYear() + "-" + (now.getMonth() + 1) + "-" + now.getDate();
var signInTime = +new Date(`${today} ${SIGN_IN_TIME}`);
logTime("signInTime", new Date(signInTime));
var signOutTime = +new Date(`${today} ${SIGN_OUT_TIME}`);
logTime("signOutTime", new Date(signOutTime));
// diff in or out
if (now > signInTime && now < signOutTime) {
 // ready to sign out for today
 console.log("Seconds to sign out for today: " + (signOutTime - now) / 1000);
 setTimeout(openBrowser, signOutTime - now);
} else {
 // ready to sign in for tomorrow
 signInTime = +signInTime + 60 * 60 * 24 * 1000;
 console.log("Seconds to sign in for tomorrow: " + (signInTime - now) / 1000);
 setTimeout(openBrowser, signInTime - now);
}

function logTime(str, time = new Date()) {
 console.log(`${str} -> ${time.getHours()}:${time.getMinutes()}:${time.getSeconds()}`);
}

2. 自动登录

这个重点还是在于找到需要填入内容的DOM元素

(function() {
 'use strict';
 // login
 document.querySelector("#loginid").value = "用户名";
 document.querySelector("#userpassword").value = "密码";
 document.querySelector("#login").click();
})();

3. 定时点击按钮

这一步最重要的是要准确找到按钮,检查元素慢慢查找吧。
其次,设定好签到和签退的时间,只有固定时间才会自动签到,防止每次登陆进来自动签到或签退,这样太频繁被发现。

(function() {
 'use strict';

 // user setting
 const SIGN_IN_TIME = "09:00:00";
 const SIGN_OUT_TIME = "21:00:00";

 // code implementation
 logTime("code start running");
 const now = new Date();
 const today = now.getFullYear()+"-"+(now.getMonth()+1)+"-"+now.getDate();
 var signInTime = +new Date(`${today} ${SIGN_IN_TIME}`);
 logTime("signInTime", new Date(signInTime));
 var signOutTime = +new Date(`${today} ${SIGN_OUT_TIME}`);
 logTime("signOutTime", new Date(signOutTime));
 // diff in or out
 if(now > signInTime && now < signOutTime) {
 // ready to sign out for today
 console.log("Seconds to sign out for today: " + (signOutTime - now)/1000);
 setTimeout(signInorSignOut, signOutTime - now);
 } else {
 // ready to sign in for tomorrow
 signInTime = +signInTime + 60 * 60 * 24 * 1000;
 console.log("Seconds to sign in for tomorrow: " + (signInTime - now)/1000);
 setTimeout(signInorSignOut, signInTime - now);
 }

 // signInorSignOut
 function signInorSignOut(){
 logTime(`signInButton clicked!`);
 // 重点就在这儿了,找到网站的签到按钮#signInButton,并触发他的点击事件
 document.querySelector("#signInButton").click();
 }

 function logTime(str, time=new Date()){
 console.log(`${str} -> ${time.getHours()}:${time.getMinutes()}:${time.getSeconds()}`);
 }
})();

4. 结束

一套操作,打完收工。每天下班的时候,不管是提前溜还是晚点到。记得本地开一下程序:

node timer.js

到此这篇关于JS脚本实现定时到网站上签到/签退功能的文章就介绍到这了,更多相关js 定时签到签退内容请搜索三水点靠木以前的文章或继续浏览下面的相关文章希望大家以后多多支持三水点靠木!

Javascript 相关文章推荐
jQuery创建自己的插件(自定义插件)的方法
Jun 10 Javascript
jQuery ajax应用总结
Jun 02 Javascript
BootStrap实现带有增删改查功能的表格(DEMO详解)
Oct 26 Javascript
javascript中对象的定义、使用以及对象和原型链操作小结
Dec 14 Javascript
JavaScript中日常收集常见的10种错误(推荐)
Jan 08 Javascript
Javascript基础回顾之(二) js作用域
Jan 31 Javascript
JavaScript输入分钟、秒倒计时技巧总结(附代码)
Aug 17 Javascript
基于Vue2x实现响应式自适应轮播组件插件VueSliderShow功能
May 16 Javascript
微信小程序实现tab左右切换效果
Nov 15 Javascript
JavaScript使用Math.random()生成简单的验证码
Jan 21 Javascript
vue移动端城市三级联动组件使用详解
Jul 26 Javascript
在Vue中使用CSS3实现内容无缝滚动的示例代码
Nov 27 Vue.js
微信小程序实现手指拖动选项排序
Apr 22 #Javascript
javascript设计模式 ? 观察者模式原理与用法实例分析
Apr 22 #Javascript
javascript设计模式 ? 状态模式原理与用法实例分析
Apr 22 #Javascript
Vue computed 计算属性代码实例
Apr 22 #Javascript
js 解析 JSON 数据简单示例
Apr 21 #Javascript
react 原生实现头像滚动播放的示例
Apr 21 #Javascript
解决angular 使用原生拖拽页面卡顿及表单控件输入延迟问题
Apr 21 #Javascript
You might like
国产动画《伍六七》原声大碟大卖,啊哈娱乐引领音乐赋能IP的新尝试
2020/03/08 国漫
PHP数组实例总结与说明
2011/08/23 PHP
PHP图片处理类 phpThumb参数用法介绍
2012/03/11 PHP
基于Zend的Captcha机制的应用
2013/05/02 PHP
php中session与cookie的比较
2015/01/27 PHP
PHP 接入微信扫码支付总结(总结篇)
2016/11/03 PHP
JS中自定义定时器让它在某一时刻执行
2014/09/02 Javascript
JavaScript实现替换字符串中最后一个字符的方法
2017/03/07 Javascript
Angular在模板驱动表单中自定义校验器的方法
2017/08/09 Javascript
基于webpack.config.js 参数详解
2018/03/20 Javascript
node版本管理工具n包使用教程详解
2018/11/09 Javascript
vuex的module模块用法示例
2018/11/12 Javascript
vue实现分页组件
2020/06/16 Javascript
用Fundebug插件记录网络请求异常的方法
2019/02/21 Javascript
js实现随机点名程序
2020/09/17 Javascript
如何使用vue slot创建一个模态框的实例代码
2020/05/24 Javascript
vue 自定指令生成uuid滚动监听达到tab表格吸顶效果的代码
2020/09/16 Javascript
Python基于checksum计算文件是否相同的方法
2015/07/09 Python
利用python实现xml与数据库读取转换的方法
2017/06/17 Python
python 编写简单网页服务器的实例
2018/06/01 Python
将tensorflow的ckpt模型存储为npy的实例
2018/07/09 Python
python使用celery实现异步任务执行的例子
2019/08/28 Python
python GUI库图形界面开发之PyQt5信号与槽的高级使用技巧装饰器信号与槽详细使用方法与实例
2020/03/06 Python
Python使用Chrome插件实现爬虫过程图解
2020/06/09 Python
详解Django中views数据查询使用locals()函数进行优化
2020/08/24 Python
HTML5本地数据库基础操作详解
2016/04/26 HTML / CSS
澳大利亚购买太阳镜和眼镜网站:Glamoureyes
2020/09/22 全球购物
幼儿园教师奖惩制度
2014/02/01 职场文书
租房合同协议书
2014/04/09 职场文书
2014年城市管理工作总结
2014/12/02 职场文书
爱护环境建议书
2015/09/14 职场文书
外出考察学习心得体会
2016/01/18 职场文书
python urllib库的使用详解
2021/04/13 Python
Python趣味挑战之教你用pygame画进度条
2021/05/31 Python
SQL实现LeetCode(175.联合两表)
2021/08/04 MySQL
如何通过简单的代码描述Angular父组件、子组件传值
2022/04/07 Javascript