首页
所有分类
TAGS
文字工具 EMOJI BIBLE
编程 PHP

php+js实现的拖动滑块验证码验证表单操作示例【附源码下载】

Posted in PHP onMay 27, 2020

本文实例讲述了php+js实现的拖动滑块验证码验证表单操作。分享给大家供大家参考，具体如下：

现在很多网站，比如淘宝，京东等都改用使用极验拖动验证码实现登录，这种方式比传统的验证码方式有更好的体验，减少用户输入的错误，也同样能起到防盗刷的功能。现在很多极验都是第三方的，也很多都是收费的。今天在这里给大家分享自己用原生php实现的一个极验的代码。用原生php的好处就是以后你要嵌套到什么框架，可以直接用核心代码，改一改就好了。

极验拖动动画图

php+js实现的拖动滑块验证码验证表单操作示例【附源码下载】

代码文件截图

php+js实现的拖动滑块验证码验证表单操作示例【附源码下载】

代码实现

html文件

<!DOCTYPE html>
<html lang="">
<head>
  <meta charset="utf-8">
  <meta http-equiv="x-ua-compatible" content="ie=edge">
  <meta name="viewport" content="width=device-width, initial-scale=1">
  <title>极验滑块拖动验证码-码农社区-web视频分享网</title>
  <script type="text/javascript" src="tn_code.js?v=35"></script>
  <link rel="stylesheet" type="text/css" href="style.css?v=27" rel="external nofollow" />
<style type="text/css"></style>
</head>
<body style="text-align:center;">
<div class="tncode" style="text-align: center;margin: 100px auto;"></div>
<script type="text/javascript">
$TN.onsuccess(function(){
//验证通过
});
</script>

php文件：check.php

<?php
require_once dirname(__FILE__).'/TnCode.class.php';
$tn = new TnCode();
if($tn->check()){
    $_SESSION['tncode_check'] = 'ok';
  echo "ok";
}else{
    $_SESSION['tncode_check'] = 'error';
  echo "error";
}

?>

主要核心文件：TnCode.class.php

<?php
class TnCode
{
  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();
    }
  }
  function make(){
    $this->_init();
    $this->_createSlide();
    $this->_createBg();
    $this->_merge();
    $this->_imgout();
    $this->_destroy();
  }

  function check($offset=''){
    if(!$_SESSION['tncode_r']){
      return false;
    }
    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;
  }

  private function _init(){
    $bg = mt_rand(1,$this->bg_num);
    $file_bg = dirname(__FILE__).'/bg/'.$bg.'.png';
    $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);
  }

  private function _destroy(){
    imagedestroy($this->im);
    imagedestroy($this->im_fullbg);
    imagedestroy($this->im_bg);
    imagedestroy($this->im_slide);
  }
  private function _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);
  }
  private function _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
  }

  private function _createBg(){
    $file_mark = dirname(__FILE__).'/img/mark.png';
    $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);
  }

  private function _createSlide(){
    $file_mark = dirname(__FILE__).'/img/mark2.png';
    $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);
  }

}
?>

附：完整实例代码点击此处本站下载。

希望本文所述对大家PHP程序设计有所帮助。

php+js实现的拖动滑块验证码验证表单操作示例【附源码下载】

- Author -

下页、再停留

声明：登载此文出于传递更多信息之目的，并不意味着赞同其观点或证实其描述。

PHP 相关文章推荐
PHP扩展编写点滴 技巧收集
Mar 09 PHP
php预定义变量使用帮助（带实例）
Oct 30 PHP
带密匙的php加密解密示例分享
Jan 29 PHP
实现PHP+Mysql无限分类的方法汇总
Mar 02 PHP
codeigniter中view通过循环显示数组数据的方法
Mar 20 PHP
php简单实现屏蔽指定ip段用户的访问
Apr 29 PHP
CodeIgniter使用smtp服务发送html邮件的方法
Jun 10 PHP
php使用timthumb生成缩略图的方法
Jan 22 PHP
php中的常用魔术方法汇总
Feb 14 PHP
php获取文件后缀的9种方法
Mar 22 PHP
Yii多表联合查询操作详解
Jun 02 PHP
基于laravel where的高级使用方法
Oct 10 PHP
PHP code 验证码生成类定义和简单使用示例
May 27 #PHP
PHP 计算至少是其他数字两倍的最大数的实现代码
May 26 #PHP
tp5.1 框架数据库-数据集操作实例分析
May 26 #PHP
tp5.1 框架路由操作-URL生成实例分析
May 26 #PHP
tp5.1 框架join方法用法实例分析
May 26 #PHP
tp5.1框架数据库子查询操作实例分析
May 26 #PHP
tp5.1 框架数据库常见操作详解【添加、删除、更新、查询】
May 26 #PHP
reduce()(1) PIL(1) 裁剪图片(1) Flask(2) 生命周期(1) 进度条(1) 死锁(3) 鲲鹏(1) Python(3) 信号同步(1)
You might like
php cli 方式 在crotab中运行解决
2010/02/08 PHP
PHP基础陷阱题(变量赋值)
2012/09/12 PHP
PHP入门教程之PHP操作MySQL的方法分析
2016/09/11 PHP
PHP面向对象程序设计类的定义与用法简单示例
2016/12/27 PHP
PHP用PDO如何封装简单易用的DB类详解
2017/07/30 PHP
漂亮的thinkphp 跳转页封装示例
2019/10/16 PHP
[全兼容哦]--实用、简洁、炫酷的页面转入效果loing
2007/05/07 Javascript
精心挑选的12款优秀的基于jQuery的手风琴效果插件和教程
2012/08/22 Javascript
js 将json字符串转换为json对象的方法解析
2013/11/13 Javascript
不使用jquery实现js打字效果示例分享
2014/01/19 Javascript
ajax请求乱码的解决方法(中文乱码)
2014/04/10 Javascript
js匿名函数作为函数参数详解
2016/06/01 Javascript
Angular.JS学习之依赖注入$injector详析
2016/10/20 Javascript
详解从新建vue项目到引入组件Element的方法
2017/08/29 Javascript
详解JS构造函数中this和return
2017/09/16 Javascript
微信小程序数字滚动插件使用详解
2018/02/02 Javascript
vue中的数据绑定原理的实现
2018/07/02 Javascript
小程序云开发如何实现图片上传及发表文字
2019/05/17 Javascript
Python科学计算环境推荐——Anaconda
2014/06/30 Python
在Django中使用Sitemap的方法讲解
2015/07/22 Python
Python编码爬坑指南(必看)
2016/06/10 Python
Python环境变量设置方法
2016/08/28 Python
对python的输出和输出格式详解
2018/12/08 Python
python读取ini配置的类封装代码实例
2020/01/08 Python
python-docx文件定位读取过程(尝试替换)
2020/02/13 Python
基于Python实现全自动下载抖音视频
2020/11/06 Python
市场营销专科应届生求职信
2013/11/24 职场文书
最新党员思想汇报
2014/01/01 职场文书
幼儿园运动会入场词
2014/02/10 职场文书
班长竞选演讲稿
2014/04/24 职场文书
法定代表人授权委托书范文
2014/09/22 职场文书
晚自修旷课检讨书怎么写
2014/11/17 职场文书
总经理年会致辞
2015/07/29 职场文书
妇产科护理心得体会
2016/01/22 职场文书
2016年“我们的节日·端午节”活动总结
2016/04/01 职场文书
Python爬虫之爬取某文库文档数据
2021/04/21 Python