Atitit 图片验证码功能设计文档总结目录1.1. 使用图片验证码img src标签设置图片。。验证码图片有png，jpg，svg等格式。。 11.2. Php png图像 11.3. P

Atitit 图片验证码功能设计文档总结

目录

1.1. 使用图片验证码img src标签设置图片。。验证码图片有png，jpg，svg等格式。。 1

1.2. Php png图像 1

1.3. Php的svg图片生成 2

2. Cde 3

1. 1. 使用图片验证码img src标签设置图片。。验证码图片有png，jpg，svg等格式。。

Svg的head是这样header('Content-Type:image/svg+xml');

大概流程是生成字串放入session。。提交的时候校验session字串即可。。。

1. 1. Php png图像

<?php
//   /sdk/catchImg.php
require __DIR__ . '/../vendor/autoload.php';
use MinhoCaptchaCaptchaBuilder;

session_start();
$captch = new CaptchaBuilder();

$captch->initialize([
    'width' => 120,     // 宽度
    'height' => 40,     // 高度
    'line' => false,    // 直线
    'curve' => false,    // 曲线
    'noise' => 0,       // 噪点背景
    'fonts' => []       // 字体
]);
//  C:wampinphpphp5.6.31php.exe composer.phar install
//C:wampinphpphp5.6.31php.exe composer.phar update
$captch->create();
$captch->save('778.png',1);
$_SESSION['captch77'] = $captch->getText();

error_log('$_SESSION[captch77] from ctimg.php '.$_SESSION['captch77']);

$captch->output(1);
//echo $captch->getText();

1. 1. Php的svg图片生成

Pnp的png图像生成测试环境遇到点问题，需要集成gd库，也依赖于os的图像库。。

所以可以使用svg格式。。可惜php没有好的svg库，，只要使用nodejs的svg库

svg-captcha

通过cli模式调用。。。

1. Cde

<?php
 
header('Content-Type:image/svg+xml');
session_start();

//  C:wampinphpphp5.6.31php.exe composer.phar install
//C:wampinphpphp5.6.31php.exe composer.phar update
$jscmd = "node cpt2.js ";    // . base64_encode(json_encode($post));
error_log( $jscmd . PHP_EOL,3,'error_log.log');
$returnContent = exec($jscmd);
error_log( '$returnContent:'.$returnContent.PHP_EOL,3,'error_log.log');

$jsonObj=json_decode($returnContent,true);
$_SESSION['captch77'] = strtolower( $jsonObj['text']);

error_log('$_SESSION[captch77] from ctimg.php is:: '.$_SESSION['captch77'].PHP_EOL,3,'error_log.log');
echo $jsonObj['data'];

const code = require("svg-captcha");
 var ret=code.create({
    size: 4,
    ignoreChars: "0o1iIl",
    noise: 0,
    color: true,
    background: "#fff",
    fontSize: 60
});
console.log(JSON.stringify(ret) )