php click captcha 验证码类

需求:

现在常用的表单验证码大部分都是要用户输入为主,但这样对手机用户会不方便。

如果手机用户访问,可以不用输入,而是click某一位置便可确认验证码,这样就会方便很多。


原理:

1.使用PHP imagecreate创建PNG图象,在图中画N个圆弧,其中一个是完整的圆(验证用),将圆心坐标及半径记录入session。

2.在浏览器,当用户在验证码图片上点击时,记录点击的位置。

3.将用户点击的坐标与session记录的圆心坐标、半径比较,判断是否在圆中,如是则验证通过。



ClickCaptcha.class.php

<?php
/** Click Captcha 验证码类
*   Date:   2013-05-04
*   Author: fdipzone
*   Ver:    1.0
*/class ClickCaptcha { // class startpublic $sess_name = 'm_captcha';public $width = 500;public $height = 200;public $icon = 5;public $iconColor = array(255, 255, 0);public $backgroundColor = array(0, 0, 0);public $iconSize = 56;private $_img_res = null;public function __construct($sess_name=''){if(session_id() == ''){session_start();}if($sess_name!=''){$this->sess_name = $sess_name; // 设置session name}}/** 创建验证码 */public function create(){// 创建图象$this->_img_res = imagecreate($this->width, $this->height);// 填充背景ImageColorAllocate($this->_img_res, $this->backgroundColor[0], $this->backgroundColor[1], $this->backgroundColor[2]);// 分配颜色$col_ellipse = imagecolorallocate($this->_img_res, $this->iconColor[0], $this->iconColor[1], $this->iconColor[2]);$minArea = $this->iconSize/2+3;// 混淆用图象,不完整的圆for($i=0; $i<$this->icon; $i++){$x = mt_rand($minArea, $this->width-$minArea);$y = mt_rand($minArea, $this->height-$minArea);$s = mt_rand(0, 360);$e = $s + 330;imagearc($this->_img_res, $x, $y, $this->iconSize, $this->iconSize, $s, $e, $col_ellipse);            }// 验证用图象,完整的圆$x = mt_rand($minArea, $this->width-$minArea);$y = mt_rand($minArea, $this->height-$minArea);$r = $this->iconSize/2;imagearc($this->_img_res, $x, $y, $this->iconSize, $this->iconSize, 0, 360, $col_ellipse);        // 记录圆心坐标及半径$this->captcha_session($this->sess_name, array($x, $y, $r));// 生成图象Header("Content-type: image/PNG");ImagePNG($this->_img_res);ImageDestroy($this->_img_res);exit();}/** 检查验证码* @param String $captcha  验证码* @param int    $flag     验证成功后 0:不清除session 1:清除session* @return boolean*/public function check($captcha, $flag=1){if(trim($captcha)==''){return false;}if(!is_array($this->captcha_session($this->sess_name))){return false;}list($px, $py) = explode(',', $captcha);list($cx, $cy, $cr) = $this->captcha_session($this->sess_name);if(isset($px) && is_numeric($px) && isset($py) && is_numeric($py) && isset($cx) && is_numeric($cx) && isset($cy) && is_numeric($cy) && isset($cr) && is_numeric($cr)){if($this->pointInArea($px,$py,$cx,$cy,$cr)){if($flag==1){$this->captcha_session($this->sess_name,'');}return true;}}return false;}/** 判断点是否在圆中* @param int $px  点x* @param int $py  点y* @param int $cx  圆心x* @param int $cy  圆心y* @param int $cr  圆半径* sqrt(x^2+y^2)<r*/private function pointInArea($px, $py, $cx, $cy, $cr){$x = $cx-$px;$y = $cy-$py;return round(sqrt($x*$x + $y*$y))<$cr;}/** 验证码session处理方法* @param   String   $name    captcha session name* @param   String   $value* @return  String*/private function captcha_session($name,$value=null){if(isset($value)){if($value!==''){$_SESSION[$name] = $value;}else{unset($_SESSION[$name]);}}else{return isset($_SESSION[$name])? $_SESSION[$name] : '';}}} // class end?>

demo.php
<?php
session_start();
require('ClickCaptcha.class.php');if(isset($_GET['get_captcha'])){ // get captcha$obj = new ClickCaptcha();$obj->create();exit();
}if(isset($_POST['send']) && $_POST['send']=='true'){ // submit$name = isset($_POST['name'])? trim($_POST['name']) : '';$captcha = isset($_POST['captcha'])? trim($_POST['captcha']) : '';$obj = new ClickCaptcha();if($obj->check($captcha)){echo 'your name is:'.$name;}else{echo 'captcha not match';}echo ' <a href="demo.php">back</a>';}else{ // html
?>
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
<html><head><meta http-equiv="content-type" content="text/html; charset=utf-8"><title> Click Captcha Demo </title><script type="text/javascript" src="jquery-1.6.2.min.js"></script><script type="text/javascript">$(function(){$('#captcha_img').click(function(e){var x = e.pageX - $(this).offset().left;var y = e.pageY - $(this).offset().top;$('#captcha').val(x+','+y);})$('#btn').click(function(e){if($.trim($('#name').val())==''){alert('Please input name!');return false;}if($.trim($('#captcha').val())==''){alert('Please click captcha!');return false;}$('#form1')[0].submit();})})</script></head><body><form name="form1" id="form1" method="post" action="demo.php" οnsubmit="return false"><p>name:<input type="text" name="name" id="name"></p><p>Captcha:Please click full circle<br><img id="captcha_img" src="demo.php?get_captcha=1&t=<?=time() ?>" style="cursor:pointer"></p><p><input type="submit" id="btn" value="submit"></p><input type="hidden" name="send" value="true"><input type="hidden" name="captcha" id="captcha"></form></body>
</html>
<?php } ?>

源码下载:点击下载

本文来自互联网用户投稿,该文观点仅代表作者本人,不代表本站立场。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如若转载,请注明出处:http://www.rhkb.cn/news/56479.html

如若内容造成侵权/违法违规/事实不符,请联系长河编程网进行投诉反馈email:809451989@qq.com,一经查实,立即删除!

相关文章

登录图形验证码验证

1.页面添加 一个验证码输入框 一个img标签用来存放验证码图 写一个imgCode()点击事件&#xff0c;用来刷新验证码 将获得的验证码放入redis缓存当中&#xff0c;登录的时候用来验证 验证图形验证码是否正确 代码如下: controller层: RequestMapping("toLogin")pu…

登录实现图片验证码

登录实现图片验证码 背景 登录基本是很多前端网站都需要的功能了吧&#xff0c;验证码防止“注册机”也是比较常见的了。这里用vue来实实现下登录的图片验证码功能&#xff0c;当然普通的H5项目也是可以实现&#xff0c;原理是相通的。 Vue实现图片验证码 封装自定义的图片…

登陆页面实现验证码

1.创建工具类&#xff0c;用于生成图片 package com.bishe.utli;import javax.imageio.ImageIO; import java.awt.*; import java.awt.image.BufferedImage; import java.io.IOException; import java.io.OutputStream; import java.util.Random;public class ImageVerificatio…

登录和注册页面 - 验证码功能的实现

目录 1. 生成验证码 2. 将本地验证码发布成 URL 3. 后端返回验证码的 URL 给前端 4. 前端将用户输入的验证码传给后端 5. 后端验证验证码 1. 生成验证码 使用hutool 工具生成验证码. 1.1 添加 hutool 验证码依赖 <!-- 验证码 --> <dependency><groupId…

topthink/think-captcha 3.* thinkphp6 验证码前后端分离Api登录

在我写 TP5 前后端分离验证码之后不久&#xff0c; 要在TP6上去搞。原来以为有前车之鉴了&#xff0c; 我在tp6搞会很轻松&#xff0c; 没想到他的包更新了 3 版本了。 在我一些列阅读源码之后&#xff0c;我的同事提醒我&#xff0c; 这个Tp 在中国已经很成熟了啊&#xff0c…

登录功能图片验证码的实现

首先从网上下载一个生成验证码的Servlet&#xff1a; package com.train.controller;import java.awt.Color; import java.awt.Font; import java.awt.Graphics; import java.awt.Graphics2D; import java.awt.image.BufferedImage; import java.io.BufferedReader; import ja…

带验证码的登录页面

带验证码的登录页面 HTML页面中用表单标签的post方式提交到相应的php后台文件 <html lang"en"> <head><meta charset"UTF-8"><title>登录页面</title> </head> <body> <form method"post" actio…

GPT之父谈未来五年的AI:模型规模见顶,下个突破点在用好AI涌现特质

夕小瑶科技说 分享来源 | Web3 天空之城作者| 城主 划重点 ①尽管 AI 模型性能惊人&#xff0c;但它们的学习能力仍远远落后于人类。它们需要大量数据来学习&#xff0c;而人类可以从很少的数据中学习很多。所以&#xff0c;要达到人类的学习速度&#xff0c;这些模型还需要做大…

超好用万能提示词框架,ChatGPT效率翻三倍!

前几天写了几篇自己的AI实践&#xff1a; 《程序员&#xff0c;如何借力ChatGPT&#xff1f;》 《普通人&#xff0c;如何借力ChatGPT&#xff1f;》 《我认为&#xff0c;最好用的AI工具是它》 《如何借力AI工具做PPT》 很多朋友在后台留言&#xff0c;问我应该如何写高质量的…

Html5浪漫结婚请柬婚礼网站模板❤_爱她就给她最美的H5婚礼请柬_(婚庆电子邀请函)含背景音乐...

❉ Html5浪漫结婚请柬婚礼网站模板❤_爱她就给她最美的H5婚礼请柬_(婚庆电子邀请函)含背景音乐 一年一度的/520情人节/七夕情人节/生日礼物/告白师妹/程序员表白,这个是一个简单得html得结婚请柬效果图&#xff0c;是动态得&#xff0c;上面得文字可以更改&#xff0c;图片都可…

微信小程序电子签名及图片生成

基于微信小程序的电子签名及图片生成 前言:随着无纸化的推广,线上办公流程逐渐大众化,在线签字、等功能极大的缩短了异地签署周期,减少项目成本。 目录 一、功能介绍1.1、简介1.2、使用领域及原则1.3、相关技术1.4、小程序效果图1.5、基本功能二、代码块2.1、view2.2、wxss…

谁说程序员不懂浪漫——我的C语言结婚请柬(附源码)

前言&#xff1a;但行好事&#xff0c;莫问前程——《增广贤文》 从上学起开始学C,后面也做过H5&#xff0c;现在做Android。无论是学习用的&#xff0c;还是工作用的&#xff0c;上百个软件不止。但最另我骄傲的是&#xff0c;我用程序烂漫了一把。 用C语言&#xff0c;利用W…

计算机制作请柬,婚礼纪能用电脑制作电子请柬吗?电子请柬有哪些注意事项?...

不知道大家有没有发现&#xff0c;不知道从什么时候开始&#xff0c;结婚请柬已经从传统的纸质请柬变成了电子请柬的形式&#xff0c;这种不花成本去买、不费时间去派发的方式也是得到了越来越多新人的追捧。当然&#xff0c;纸质请柬有纸质请柬的制作方法&#xff0c;电子请柬…

HTML5结婚请柬响应式婚礼网站模板

简介&#xff1a; HTML5结婚请柬响应式婚礼网站模板是一款大气浪漫的结婚婚纱网站模板下载。aspku提示&#xff1a;本模板调用到谷歌字体库&#xff0c;可能会出现页面打开比较缓慢。 下载地址&#xff1a; http://www.bytepan.com/QwOAHHQ2pep

婚礼邀请函微信小程序

7.2.1任务分析 一、任务功能分析 本项目是一个婚礼邀请函小程序&#xff0c;通过小程序向亲朋好友发送婚礼到场邀请&#xff0c;相对于传 统方式的请柬&#xff0c;给人们带来不一样的便捷体验&#xff0c;也更容易受到广大年轻群体的喜爱。通过电 子版的邀请函&#xff0c;邀请…

婚礼请帖_第一次在线婚礼发生在1876年

婚礼请帖 重点(Top highlight) As the Covid-19 pandemic wears on, more and more of life has moved online — school, playdates, conferences, civic events, court proceedings, and even weddings. According to Wired, more than 450,000 couples were married between…

婚礼邀请函首页

一、 首页分析 1.1 邀请函页面的需求 背景音乐播放&#xff1a;页面的右上角有一个背景音乐播放按钮&#xff0c;用于控制音乐播放状态&#xff0c;单击按钮播放音乐&#xff0c;再次单击按钮暂停音乐。新人信息&#xff1a;页面中展示新娘和新郎的头像、姓名信息。婚礼信息&…

婚礼邀请函页面实现

邀请函实现步骤 主体页面以及导航栏样式布置一、项目初始化1、导航栏及标签部分代码 二、页面结构和样式1.邀请函页面主体页面包含了头顶部分的GIF图&#xff0c;标题&#xff0c;头像&#xff0c;及地点的等部分首页代码我们将在index.wxml文件中实现&#xff1a;首先&#xf…

微信小程序-婚礼邀请函页面

微信小程序-婚礼邀请函页面 &#xff08;1&#xff09;pages文件中的文件创建&#xff1a; 1.在app.json中进行创建文件&#xff0c;保存即可在pages中生成文件&#xff1b; &#xff08;2&#xff09;完成下导航&#xff1a; 1.在app.json中新增tabBar方法&#xff0c;并t在ab…

婚礼邀请函小程序项目

文章目录 一、学习目标1.掌握小程序常用组件的使用2.掌握腾讯视频插件的使用3.掌握背景音乐API、地图API的使用4.掌握订阅消息的发送 二、开发前准备1.项目展示 三、代码实现1 项目搭建2 功能实现2.1 背景音乐功能2.2 照片页面功能2.3 美好时光页面2.4 婚礼地点页面2.5 宾客信息…