验证码功能(个人理解):

  1. 减轻服务器的压力(如12306的验证码功能);
  2. 防止暴力注册

个人思路:在a-z,A-Z,1-9生成n位随机的数来构成新的验证码。

关于生成验证码的几个小函数

  1. range() //指定范围输出一个数组

a)       如: range(1,9)

  1. array_merge()//合并数组

a)       array_merge(数组1,数组2….)

  1. array_rand(数组,数量)

a)       随机从数组中取出几个下标返回一个数组

  1. shuffle(数组)//将再一次打乱数组中元素
  2. mt_rand(指定一个范围) //生成一个更好的随机数
  3. 如: mt_rand(1,5) //生成一个在1-5之间的任意数

生成验证码代码

<?php

$arr1=range('a', 'z');//指定范围输出一个数组

$arr2=range('A', 'Z');

$arr3=range(1,9);

$arr=array_merge($arr1,$arr2,$arr3); //合并数组

$index = array_rand($arr,5); //在$arr中随机取5个数,返回值是$arr的下标

Shuffle($index);

$code = '';//定义一个空的字符串来存储生成的验证码用’点’来进行拼接

foreach ($index as $key => $value) {//遍历数组

$code.= $arr[$value];//根据下标取数组中的值

}

var_dump($code);

?>

运行结果截图

完善:要把验证码添加到图像中这样的验证码才逼真

在完善之前先介绍有关图像创建的大致步骤

创建图像

方法一: 创建一个真彩色图像 (空画布)

imagecreatetruecolor(width, height) //创建一个真彩色图像

说明:

  1. width : 画布的宽度(像素)
  2. height: 画布的高度(像素)
  3. 返回值为图像资源

注意:

为真彩色图像: 填充颜色

imagefill(image, x, y, color) //为图像资源填充颜色

说明:

  1. image //图像资源
  2. x,y,填充的坐标点(注意:填充的与此点最接近的颜色)

color; //用什么颜色来填充

为真彩色图像: 分配颜色

imagecolorallocate(image, red, green, blue)

说明:

  1. image //图像资源
  2. red: //红颜色(0-255) 或 0x(00-ff) //即十六进制来表示 (0xff就是255)
  3. green//绿颜色(0-255)
  4. blue //蓝颜色(0-255)

imagefill和imagecolorallocate的代码演示

在没有给画布填充颜色时的效果

给画布填充颜色时的效果和代码

<?php

//创建图像资源(空白画布)默认显示为黑色

$image = imagecreatetruecolor(300, 400);

//1.image //图像资源

//2.red: //红颜色(0-255) 或 0x(00-ff) //即十六进制来表示 (0xff就是255)

//3.green//绿颜色(0-255)

//4.blue //蓝颜色(0-255)

$color = imagecolorallocate($image, 255, 0, 0);

//1.image //图像资源

//2.x,y,填充的坐标点(注意:填充的与此点最接近的颜色)

//3.color; //用什么颜色来填充

imagefill($image, 0, 0, $color);

//输出图像

header('content-type:image/jpeg');

imagejpeg($image);

//销毁图像资源

imagedestroy($image);

?>

结果截图;

输出图像(以jpeg为例)

  1. 输出图像到浏览器

a)       header('content-type:image/jpeg'); //设置将图像通过浏览来查看

b)      imagejpeg(图像资源)

  1. 按文件进行输出图像

a)       imagejpeg(图像资源,’图像路径’,图像的质量)    //质量取值0-100

b)      注意:

注意:只能jpeg格式才有质量这个参数.

销毁图像

imagedestroy($image); //销毁图像,释放内存资源.

注意: 当前生成几个图像资源,就销毁几个.

验证码的整个代码:

<?php

//实例:让文本居于图像的正中

//创建图像资源(空白的画布)

$image = imagecreatetruecolor(100, 50);

$color = imagecolorallocate($image, mt_rand(20,200), mt_rand(20,200), mt_rand(20,200));

//为图像资源填充颜色

imagefill($image, 0, 0, $color);

//绘制图像

$font = 5;

//验证码的开始

$arr1 = range('a','z');

$arr3 = range('A','Z');

$arr2 = range(1,9);

//array_merge — 合并一个或多个数组

$arr = array_merge($arr1,$arr2,$arr3);

$index = array_rand($arr,5); //随机从原数组中找出5个下标

$string = '';

foreach ($index as $value) { //$value 两个功能,即是$index中的值,又是$arr中的下标

$string .= $arr[$value];  //将得到字符进行连接

}

//验证码的结束

//mt_rand — 生成更好的随机数

//echo mt_rand(1,5);die;

//加入点干扰

$pointcolor = imagecolorallocate($image, mt_rand(20,200), mt_rand(20,200), mt_rand(20,200));

//循环创建1000个干扰点

for ($i=0; $i <1000 ; $i++) {

imagesetpixel($image, mt_rand(0,imagesx($image)), mt_rand(0,imagesy($image)), $pointcolor);

}

//加入线的干扰

$lintecolor = imagecolorallocate($image, mt_rand(20,200), mt_rand(20,200), mt_rand(20,200));

// 循环创建50个线干扰

for ($i=0; $i <50 ; $i++) {

imageline($image, mt_rand(0,imagesx($image)), mt_rand(0,imagesy($image)), mt_rand(0,imagesx($image)), mt_rand(0,imagesy($image)) ,$lintecolor);

}

//一个字符的宽度  imagefontwidth($font)

//字符串的个数: strlen(字符串)

//一个字符的宽度*字符串的个数

//所有字符串宽度和= 一个字符的宽度*字符串的个数

//$x = (画布的宽度-所有字符串宽度和)/2

$x = (imagesx($image)-imagefontwidth($font)*strlen($string))/2;

//$y = (画布的高度-字符的高度)/2;

//字符的高度: imagefontheight($font)

$y = (imagesy($image)-imagefontheight($font))/2;

$stringcolor = imagecolorallocate($image, mt_rand(20,200), mt_rand(20,200), mt_rand(20,200));

imagestring($image, $font, $x, $y, $string, $stringcolor);

//输出图像

header('content-type:image/jpeg'); //设置将图像通过浏览来查看

imagejpeg($image,'',100); //将图像资源输出

//销毁图像资源

imagedestroy($image); //销毁图像

理解代码中的一些函数

加入干扰的点

imagesetpixel(image, x, y, color)

说明:x,y 一个点的坐标

加入干扰的线

imageline(image, x1, y1, x2, y2, color)

说明: x1,y1是线的一个端点坐标; x2,y2是线的另一个端口的坐标; 由两点画一条线

让验证码居于图像的正中

  1. imagefontheight(font)获取字体的高度:
  2. imagefontwidth(font)获取字体的宽度:
  3. strlen(字符串)//获取字符串的长度
  4. imagesx(image) //获取画布的宽度
  5. imagesy(image) //获取画布的高度

最后运行结果

再次完善(和html代码结合起来)

Html代码

<!DOCTYPE html>

<html lang="en">

<head>

<meta charset="UTF-8">

<title>Document</title>

</head>

<body>

<form name='frm' method='post' action=''>

<table width="30%" border="2" align="center" rules="all" cellpadding="10">

<tr>

<th colspan="2">请输入信息</th>

</tr>

<tr>

<th>姓名:</th>

<th><input type="text" name="username"></input></th>

</tr>

<tr>

<th>密码:</th>

<th><input type="password" name="userpwd"></input></th>

</tr>

<tr> 555556

<th>验证码</th>

<th><input type = 'text' name = 'checkcode'></input><img src="21.php" style="cursor:pointer" onclick="this.src='21.php'?+Math.random()"></th>

</tr>

<tr>

<th colspan="2"><input type="submit" name="submit" value="提交"></input></th>

</tr>

</table>

</form>

</body>

</html>

理解;

最后结果截图

php之验证码小程序的更多相关文章

  1. java制作验证码(java验证码小程序)

    手动制作java的验证码 Web应用验证码的组成: (1)输入框 (2)显示验证码的图片 验证码的制作流程: 生成验证码的容器使用 j2ee的servlet 生成图片需要的类: (1) Buffere ...

  2. random模块(验证码小程序)

    #!/usr/bin/env python #-*- coding:utf-8 -*- import random li=[] for i in range(6): #循环几次,就代表生成几位的验证码 ...

  3. 微信小程序之获取验证码js

    在微信小程序中怎样实现获取验证码的倒计时功能捏,倒计时的原理是一样一样的,就是某些地方需要注意. 第一步:结构 <view class='get-code' wx:if="{{!isS ...

  4. 如何使用微信小程序云函数发送短信验证码

    其实微信小程序前端和云端都是可以调用短信平台接口发送短信的,使用云端云函数的好处是无需配置域名,也没有个数限制. 本文使用的是榛子云短信平台(http://smsow.zhenzikj.com) ,S ...

  5. 微信小程序发送短信验证码完整实例

    微信小程序注册完整实例,发送短信验证码,带60秒倒计时功能,无需服务器端.效果图: 代码: index.wxml <!--index.wxml--> <view class=&quo ...

  6. 微信小程序如何发送短信验证码,无需搭建服务器

    自从微信小程序提供云开发支持,开发者无需搭建后台服务器,使用微信提供的核心API就可以实现应用功能,此时就需要小程序能够自己发送短信,比如短信验证码,榛子云短信(http://smsow.zhenzi ...

  7. 微信小程序【获取验证码】倒计时效果

    最近开始接触微信小程序,会记录一些相关的小功能——例如这次是点击[获取验证码]按钮出现的倒计时效果. 原文: http://blog.csdn.net/Wu_shuxuan/article/detai ...

  8. 微信小程序-----自定义验证码实现

    这一段时间做小程序项目,使用的是mpvue的框架,需要自己实现验证码输入,模拟input的光标,上一个框输入后后一个框自动获取焦点,删除时从后往前依次删除.下图是整体效果: <template& ...

  9. 微信小程序验证码获取倒计时

    wxml <button disabled='{{disabled}}' bindtap="goGetCode">{{code}}</button> js ...

随机推荐

  1. CSS3实现图形曲线阴形和翘边阴影

    首先,来看看完成之后的效果图: 实现原理 ①曲线阴影实现: 多个阴影重叠,就是正常阴影+曲线阴影 正常情况下,有个矩形有正常的阴影,作为主投影,这时候再定义一个有一定弧度圆角的圆角矩形,然后放在正常矩 ...

  2. ZOJ Problem Set - 1292 Integer Inquiry

    题目本身属于简单题,但是注意在输出的时候,题目很变态的对格式做了很多要求: 1.输入的N与下面的block有一个空行 2.每次输出与下一个输入的block有一个空行 3.但是特别注意,当是最后一个输出 ...

  3. 在IIS EXPRESS下运行一个visual studio 项目,跳转到另一个项目的解决方案。

    原因是因为以前有一个项目也是3690端口,然后在3690端口上建立了一个网站,现在的新网站也是用的3690端口,那么会调用以前网站的WEB.CONFIG文件. 解决方法,右键单击网站,然后选择属性.在 ...

  4. 求一个数组的最大子数组(C/C++实现)

    最大子数组:要求相连,加起来的和最大的子数组就是一个数组的最大子数组.编译环境:VS2012,顺便说句其实我是C#程序员,我只是喜欢学C++. 其实这是个半成品,还有些BUG在里面,不过总体的思路是这 ...

  5. 从零开始,搭建博客系统MVC5+EF6搭建框架(4)上,前后台页面布局页面实现,介绍使用的UI框架以及JS组件

    一.博客系统进度回顾以及页面设计 1.1页面设计说明 紧接前面基础基本完成了框架搭建,现在开始设计页面,前台页面设计我是模仿我博客园的风格来设计的,后台是常规的左右布局风格. 1.2前台页面风格 主页 ...

  6. EF框架组件详述【Entity Framework Architecture】(EF基础系列篇3)

    我们来看看EF的框架设计吧: The following figure shows the overall architecture of the Entity Framework. Let us n ...

  7. C#利用反射+特性实现简单的实体映射数据库操作类

    附上源代码: using System; using System.Collections.Generic; using System.Data; using System.Linq; using S ...

  8. WinFrom 公共控件 Listview 的使用

    Listview绑定数据库数据展示与操作使用  1.拖一个Listview控件到项目中先将视图改为Details 2.编辑列 设置列头  添加columnHeader成员 Text 是显示的名称 3. ...

  9. JS检查是否支持Storage

    查看效果:http://hovertree.com/code/html5/q69kvsi6.htm 代码: <!DOCTYPE html> <html> <head> ...

  10. 一个简单的后台与数据库交互的登录与注册[sql注入处理,以及MD5加密]

    一.工具: vs2013[因为我现在用的也是2013,版本随便你自己开心] sql2008[准备过久升级] 二.用到的语言: HTML+CSS+Jquery+Ajax+sqlserver HTML[相 ...