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

之前介绍过使用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 定时签到签退内容请搜索我们以前的文章或继续浏览下面的相关文章希望大家以后多多支持我们!

(0)

相关推荐

  • JavaScript动态创建link标签到head里的方法

    本文实例讲述了JavaScript动态创建link标签到head里的方法.分享给大家供大家参考.具体分析如下: 相信有很多做前端的朋友碰到过需要用 JavaScript 动态创建样式表标签--link标签.这里我们就来说说如何在浏览器中动态创建link标签. 使用 jQuery 创建 link 标签 如果你开发中喜欢用jQuery,那么用jQuery在创建link标签应该是这样的: 复制代码 代码如下: var cssURL = '/style.css',     linkTag = $('<l

  • 基于JavaScript实现每日签到打卡轨迹功能

    本文实例为大家分享了js实现每日签到打卡轨迹功能的具体代码,供大家参考,具体内容如下 1. 核心文件 calendar.js var calUtil = { //当前日历显示的年份 showYear:2018, //当前日历显示的月份 showMonth:1, //当前日历显示的天数 showDays:1, eventName:"load", //初始化日历 init:function(signList){ calUtil.setMonthAndDay(); calUtil.draw(

  • 利用js-cookie实现前端设置缓存数据定时失效

    一.背景 业务需要在前端进行数据的缓存,到期就删除再进行获取新数据. 二.实现过程 前端设置数据定时失效的可以有下面2种方法: 1.当数据较大时,可以利用localstorage,存数据时候写入一个时间,获取的时候再与当前时间进行比较 2.如果数据不超过cookie的限制大小,可以利用cookie比较方便,直接设置有效期即可. 3.更多(请大神指点) 利用localstorage实现 localstorage实现思路: 1.存储数据时加上时间戳 在项目开发中,我们可以写一个公用的方法来进行存储的

  • 深入浅出理解JavaScript高级定时器原理与用法

    本文实例讲述了JavaScript高级定时器原理与用法.分享给大家供大家参考,具体如下: setTimeout()和setInterval()可以用来创建定时器,其基本的用法这里就不再做介绍了.这里主要介绍一下javascript的代码队列.在javascript中没有任何代码是立即执行的,一旦进程空闲则尽快执行.所以说定时器中设置的时间并不代表执行时间就一定相符,而是代表代码会在指定时间间隔后加入到队列中进行等待.如果在这个时间点上,队列中没有其他东西,那么这段代码就会被执行,表面上看上去好像

  • JavaScript学习笔记之基于定时器实现图片无缝滚动功能详解

    本文实例讲述了JavaScript学习笔记之基于定时器实现图片无缝滚动功能.分享给大家供大家参考,具体如下: 一.无缝滚动理论基础 基础知识 1.setInterval(function,time).clearInterval(timer) setInterval() 方法可按照指定的周期(以毫秒计)来调用函数或计算表达式. setInterval() 方法会不停地调用函数,直到 clearInterval() 被调用或窗口被关闭.由 setInterval() 返回的 ID 值可用作 clea

  • 轻松解决JavaScript定时器越走越快的问题

    解决JavaScript定时器越走越快的问题 之前在项目中写了定时器来做循环播放,但是总是会有越走越快的问题,开始是以为前后的HTML代码拼接的有问题,时间紧急的情况下反复改了很多也没什么效果,后来发现是js定时器的问题,在这里记录一下. (setinterval)多次初始化 使用js定时器(setinterval)首要的问题就是要记得清除,即调用(clearInterval)方法,由于没有使用定时器的经验,我一开始是没有清除定时器,程序每一次初始化的时候都调用一次定时器,之前的定时器实例没有被

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

    之前介绍过使用temperMonkey屏蔽CSDN广告的方法,主要就是要针对性地分析网站结构,然后用代码去改变或者操作DOM.今天也一样,我们需要观察网页结构,找到我们要操作的按钮,触发他的click事件就可以了.下面以公司打卡签到的网站为例,做一些坏坏的事情.本文读者最好有一定的HTML和JavaScript基础. 首先,想象一下你去签到需要做什么: 打开网站 登陆 点击"签到"按钮 然后每一步我们都可以让代码帮我们去做. 0. 如何定时 这段代码是核心,就是根据当前时间和设定的时间

  • 基于HTML5+js+Java实现单文件文件上传到服务器功能

    上传单文件到服务器       应公司要求,在HTML5页面上实现上传文件到服务器,对于一个还没毕业的实习生菜鸟来说,这可不得了-----不会,网上各种百度,找各种博客还是没解决,最后还是请教了公司的大神,人家给卸了一个例子,然后根据人家写的终于把这个上传文件搞定. 好了,开始上代码. HTML5代码: <form name="upform" action="" method="POST"> <input type ="

  • js HTML5 Ajax实现文件上传进度条功能

    本文实例介绍了js结合HTML5 Ajax实现文件上传进度条功能,分享给大家供大家参考,具体内容如下 1.  lib.js var Host = window.location.host; //--Cookie function setCookie(name,value) { var Days = 30; var exp = new Date(); exp.setTime(exp.getTime() + Days*24*60*60*1000); document.cookie = name +

  • 利用njs模块在nginx配置中引入js脚本

    目录 前言 一 安装 NJS 模块 方法一: 动态加载 NJS 模块 方法二: 编译时增加模块 二 NJS模块运行环境的特点 三 NJS 模块支持的指令及对应的处理阶段 四 NJS 的简单用法示例 五 NJS 支持的指令 参考资料 总结 前言 由于许多 web 开发并不熟悉 lua 语言. 因此 nginx 推出了 njs 模块, 可以在 nginx 的配置中引入 js 脚本, 从而实现一些更复杂的 nginx 配置功能. 以下介绍 njs 模块的特性和用法 一 安装 NJS 模块 要求 ngi

  • JS脚本根据手机浏览器类型跳转WAP手机网站(两种方式)

    随着移动互联网的不断普及,企业的网络宣传不仅只局限在PC端,还要在移动端发展.我们在自己的网站做了WAP手机完整之后,如果有用户通过手机访问我们的企业顶级域名网站,就要判断跳转到专为的WAP网站,下面小编通过两种方式介绍根据手机浏览器类型跳转WAP手机网站,具体内容如下. 第一种方式:直接JS脚本 <script type="text/javascript"> try { var urlhash = window.location.hash; if (!urlhash.ma

  • 两款JS脚本判断手机浏览器类型跳转WAP手机网站

    随着移动设备的普及,企业的网络宣传已经不能局限在PC端,而需要同时在移动端有所建树.对于公司网站来说,以前都是做的PC端的,当然手机等移动端也可以访问,但是用户体验肯定不如完全适合的手机端来的方便.我们在给自己的网站做了WAP手机网站之后,如果有用户通过手机访问我们的企业顶级域名网站,那就判断跳转到专为的WAP网站. 这里老左整理到目前自己在使用的2种JS脚本,因为之前一直有朋友跟我要,所以这里分享出来. 第一种:直接JS脚本 <script type="text/javascript&q

  • 通过js脚本复制网页上的一个表格的不错实现方法

    今天有人问我一个问题:如何通过js脚本复制网页上的一个表格?看起来似乎比较有难度,不过还是搞定了,顺便把解决这个问题的过程记录下来,希望能对写脚本的兄弟们有所帮助. 以前没有写过这种脚本,不过想起来前不久刚看到一个脚本可以实现全选HTML编辑器的内容,于是想到一个方案:使用脚本将该表格插入HTML编辑器中,然后全选HTML编辑器内容,执行HTML编辑器的复制命令,即可实现复制表格功能,很快搞定: 测试 测试表格 测试表格 测试表格 测试表格 文字 "); // 初始化编辑器 editor.doc

  • node脚本实现自动化签到和抽奖功能

    目录 一.前言 二.准备 三.脚本工程搭建 四.代码编写&运行 五.总结以及想说的话 六.相关源码和借鉴的博客 一.前言   掘金自从推出签到活动后,就不断的完善这个功能,现在矿石能抽奖还能兑换物品(简直不要太爽!✧*。٩(ˊᗜˋ*)و✧*。),楼主本人很早之前就在用掘金了(掘金签到功能出来之前),但是本人很懒导致打卡签到断断续续的,所以只能眼睁睁看着别人兑换奖品(羡慕.嫉妒٩(๑`^´๑)۶),现在矿石也没有过w(主要碰运气去了( • ̀ω•́ )✧),而正好前不久看过一些掘金的博主发了自动签

  • JS实现表单多文件上传样式美化支持选中文件后删除相关项

    开发中会经常涉及到文件上传的需求,根据业务不同的需求,有不同的文件上传情况. 有简单的单文件上传,有多文件上传,因浏览器原生的文件上传样式及功能的支持度不算太高,很多时候我们会对样式进行美化,对功能进行完善. 本文根据一个例子,对多文件的上传样式做了一些简单的美化(其实也没怎么美化..),同时支持选择文件后自定义删除相关的文件,最后再上传 文章篇幅较长,先简单看看图示: 一.文件上传基础 1. 单文件上传 最简单的文件上传,是单文件上传,form标签中加入enctype="multipart/f

  • 浏览器调试动态js脚本的方法(图解)

    前两天拉取公司前端代码修改,发现在开发者工具的sources选项里边,居然没有列出来我要调试的js脚本,后来观察了一下,脚本是动态在页面里引入的,可能是因为这样所以不显示出来,但是如果不能断点调试,只靠打印日志真要把人累死了,效率太低,网络搜索试验了一下,有两种方式可以解决: 1.在脚本里边增加 //# sourceURL=xxxxxxxxx.js,名称自己命名,可以直接使用文件名,如下图: 然后在网页里打开包含这个js的页面,这样就在开发者工具里能够看到了,可以像普通js一样正常打断点并进行调

随机推荐

其他