首页 / 知识

php+js实现极验，拖动滑块验证码验证表单

2023-04-11 15:21:00

php+js实现极验，拖动滑块验证码验证表单
　　现在很多网站，比如淘宝，京东等都改用使用极验拖动验证码实现登录，这种方式比传统的验证码方式有更好的体验，减少用户输入的错误，也同样能起到防盗刷的功能。现在很多极验都是第三方的，也很多都是收费的。今天在这里给大家分享自己用原生php实现的一个极验的代码。用原生php的好处就是以后你要嵌套到什么框架，可以直接用核心代码，改一改就好了。
 
　　极验拖动动画图
 
　　代码文件截图
 
　　代码实现
 
　　html文件
 
　　<!DOCTYPEhtml>
 
　　<htmllang="">
 
　　<head>
 
　　<metacharset="utf-8">
 
　　<metahttp-equiv="x-ua-compatible"content="ie=edge">
 
　　<metaname="viewport"content="width=device-width,initial-scale=1">
 
　　<title>极验滑块拖动验证码-码农社区-web视频分享网</title>
 
　　<scripttype="text/javascript"src="tn_code.js?v=35"></script>
 
　　<linkrel="stylesheet"type="text/css"href="style.css?v=27"/>
 
　　<styletype="text/css"></style>
 
　　</head>
 
　　<bodystyle="text-align:center;">
 
　　<divclass="tncode"style="text-align:center;margin:100pxauto;"></div>
 
　　<scripttype="text/javascript">
 
　　$TN.onsuccess(function(){
 
　　//验证通过
 
　　});
 
　　</script>
 
　　php文件：check.php
 
　　<?php
 
　　require_oncedirname(__FILE__).'/TnCode.class.php';
 
　　$tn=newTnCode();
 
　　if($tn->check()){
 
　　$_SESSION['tncode_check']='ok';
 
　　echo"ok";
 
　　}else{
 
　　$_SESSION['tncode_check']='error';
 
　　echo"error";
 
　　}
 
　　?>
 
　　主要核心文件：TnCode.class.php
 
　　<?php
 
　　classTnCode
 
　　{
 
　　var$im=null;
 
　　var$im_fullbg=null;
 
　　var$im_bg=null;
 
　　var$im_slide=null;
 
　　var$bg_width=240;
 
　　var$bg_height=150;
 
　　var$mark_width=50;
 
　　var$mark_height=50;
 
　　var$bg_num=6;
 
　　var$_x=0;
 
　　var$_y=0;
 
　　//容错象素越大体验越好，越小破解难道越高
 
　　var$_fault=3;
 
　　function__construct(){
 
　　//ini_set('display_errors','On');
 
　　//
 
　　error_reporting(0);
 
　　if(!isset($_SESSION)){
 
　　session_start();
 
　　}
 
　　}
 
　　functionmake(){
 
　　$this->_init();
 
　　$this->_createSlide();
 
　　$this->_createBg();
 
　　$this->_merge();
 
　　$this->_imgout();
 
　　$this->_destroy();
 
　　}
 
　　functioncheck($offset=''){
 
　　if(!$_SESSION['tncode_r']){
 
　　returnfalse;
 
　　}
 
　　if(!$offset){
 
　　$offset=$_REQUEST['tn_r'];
 
　　}
 
　　$ret=abs($_SESSION['tncode_r']-$offset)<=$this->_fault;
 
　　if($ret){
 
　　unset($_SESSION['tncode_r']);
 
　　}else{
 
　　$_SESSION['tncode_err']++;
 
　　if($_SESSION['tncode_err']>10){//错误10次必须刷新
 
　　unset($_SESSION['tncode_r']);
 
　　}
 
　　}
 
　　return$ret;
 
　　}
 
　　privatefunction_init(){
 
　　$bg=mt_rand(1,$this->bg_num);
 
　　$file_bg=dirname(__FILE__).'/bg/'.$bg.'.webp';
 
　　$this->im_fullbg=imagecreatefrompng($file_bg);
 
　　$this->im_bg=imagecreatetruecolor($this->bg_width,$this->bg_height);
 
　　imagecopy($this->im_bg,$this->im_fullbg,0,0,0,0,$this->bg_width,$this->bg_height);
 
　　$this->im_slide=imagecreatetruecolor($this->mark_width,$this->bg_height);
 
　　$_SESSION['tncode_r']=$this->_x=mt_rand(50,$this->bg_width-$this->mark_width-1);
 
　　$_SESSION['tncode_err']=0;
 
　　$this->_y=mt_rand(0,$this->bg_height-$this->mark_height-1);
 
　　}
 
　　privatefunction_destroy(){
 
　　imagedestroy($this->im);
 
　　imagedestroy($this->im_fullbg);
 
　　imagedestroy($this->im_bg);
 
　　imagedestroy($this->im_slide);
 
　　}
 
　　privatefunction_imgout(){
 
　　if(!$_GET['nowebp']&&function_exists('imagewebp')){//优先webp格式，超高压缩率
 
　　$type='webp';
 
　　$quality=40;//图片质量0-100
 
　　}else{
 
　　$type='png';
 
　　$quality=7;//图片质量0-9
 
　　}
 
　　header('Content-Type:image/'.$type);
 
　　$func="image".$type;
 
　　$func($this->im,null,$quality);
 
　　}
 
　　privatefunction_merge(){
 
　　$this->im=imagecreatetruecolor($this->bg_width,$this->bg_height*3);
 
　　imagecopy($this->im,$this->im_bg,0,0,0,0,$this->bg_width,$this->bg_height);
 
　　imagecopy($this->im,$this->im_slide,0,$this->bg_height,0,0,$this->mark_width,$this->bg_height);
 
　　imagecopy($this->im,$this->im_fullbg,0,$this->bg_height*2,0,0,$this->bg_width,$this->bg_height);
 
　　imagecolortransparent($this->im,0);//16777215
 
　　}
 
　　privatefunction_createBg(){
 
　　$file_mark=dirname(__FILE__).'/img/mark.webp';
 
　　$im=imagecreatefrompng($file_mark);
 
　　header('Content-Type:image/png');
 
　　//imagealphablending($im,true);
 
　　imagecolortransparent($im,0);//16777215
 
　　//imagepng($im);exit;
 
　　imagecopy($this->im_bg,$im,$this->_x,$this->_y,0,0,$this->mark_width,$this->mark_height);
 
　　imagedestroy($im);
 
　　}
 
　　privatefunction_createSlide(){
 
　　$file_mark=dirname(__FILE__).'/img/mark2.webp';
 
　　$img_mark=imagecreatefrompng($file_mark);
 
　　imagecopy($this->im_slide,$this->im_fullbg,0,$this->_y,$this->_x,$this->_y,$this->mark_width,$this->mark_height);
 
　　imagecopy($this->im_slide,$img_mark,0,$this->_y,0,0,$this->mark_width,$this->mark_height);
 
　　imagecolortransparent($this->im_slide,0);//16777215
 
　　//header('Content-Type:image/png');
 
　　//imagepng($this->im_slide);exit;
 
　　imagedestroy($img_mark);
 
　　}

拖动滑块验证表单验证码原生

最新内容

相关内容

热门文章

推荐文章

标签云

猜你喜欢