>  기사  >  백엔드 개발  >  PHP에서 인증 코드 위치를 변경하는 방법

PHP에서 인증 코드 위치를 변경하는 방법

PHPz
PHPz원래의
2023-04-04 17:28:18649검색

웹사이트가 발전하면서 인증코드는 많은 웹사이트에서 등록이나 로그인에 필요한 보안 수단이 되었습니다. 그러나 때로는 인증 코드의 위치가 우리의 설계 요구 사항을 충족하지 않는 경우가 있으므로 오늘은 PHP에서 인증 코드의 위치를 ​​변경하는 방법에 대해 이야기하겠습니다.

먼저 인증코드 생성 원리를 이해해야 합니다. 일반적으로 확인 코드는 GD 라이브러리를 사용하여 PHP 스크립트에서 생성됩니다. GD 라이브러리는 imagecreate(), imagecolorallocate(), imagestring() 등과 같은 확인 코드 생성을 위한 몇 가지 함수를 제공합니다.

다음으로 이러한 기능에 대해 설명하겠습니다. 다른 인증번호 생성 방식을 사용하시는 경우, 생성원칙에 따라 수정하실 수 있습니다.

  1. 지정된 위치에 인증코드를 입력하세요

imagestring() 함수를 통해 인증코드를 캔버스에 출력할 수 있으며, 이를 통해 인증코드의 위치를 ​​제어할 수 있습니다.

기본 인증 코드 생성 스크립트는 다음과 같습니다.

<?php
session_start();
header("Content-type: image/png");

$code_len = 4;
$width = 80;
$height = 25;

$charset = &#39;abcdefghkmnprstuvwxyABCDEFGHKMNPRSTUVWXY3456789&#39;;
$code = &#39;&#39;;
for ($i = 0; $i < $code_len; $i++) {
    $code .= $charset[mt_rand(0, strlen($charset) - 1)];
}
$_SESSION[&#39;verify_code&#39;] = strtoupper($code);

$img = imagecreate($width, $height);
imagecolorallocate($img, 255, 255, 255);  //设置背景颜色

$font_color = imagecolorallocate($img, mt_rand(0, 100), mt_rand(0, 100), mt_rand(0, 100));
for ($i = 0; $i < $code_len; $i++) {
    $font_size = mt_rand(12, 16);
    $angle = mt_rand(-10, 10);
    $f_x = ($width / $code_len) * $i + mt_rand(0, 5);
    $f_y = $height / 2 + mt_rand(-5, 6);

    imagestring($img, $font_size, $f_x, $f_y, $code[$i], $font_color);  //输出验证码
}

imagepng($img);
imagedestroy($img);

위 코드를 사용하면 캔버스의 임의 위치에 인증 코드가 출력됩니다. 지정된 위치에 인증 코드를 수정하려면 설계 요구 사항에 따라 $f_x$f_y 값만 수정하면 됩니다. $f_x$f_y 的值即可。

例如,我们将验证码固定在画布的中心位置,只需要将 $f_x$f_y 的值修改如下:

$f_x = ($width / 2 - (($font_size + 3) * $code_len) / 2) + ($font_size + 3) * $i;  // 控制水平方向位置
$f_y = $height / 2 + mt_rand(-5, 6);  // 控制竖直方向位置

运行后,验证码将出现在画布的中心位置。

  1. 将验证码放置在指定HTML元素内

如果我们想将验证码放置在指定HTML元素内,可以通过CSS控制画布的位置,并将画布嵌入到HTML元素中。

例如,我们想将验证码放置在 <div id="verify"> 元素内,可以在CSS中添加如下代码:<pre class="brush:php;toolbar:false">#verify {     position: relative;     background-color: #fff;  /* 图片背景色 */     width: 100px;     height: 32px;     text-align: center; } #verify img {     position: absolute;  /* 设置验证码图片位置 */     top: 0;     left: 0; }</pre><p>然后在HTML中添加如下代码:</p><pre class="brush:php;toolbar:false">&lt;div id=&quot;verify&quot;&gt;     &lt;img src=&quot;verify.php&quot; alt=&quot;验证码&quot;&gt; &lt;/div&gt;</pre><p>通过上面的代码,我们可以将生成的验证码嵌入到指定元素中,其位置将被CSS控制。</p><ol start="3"><li>将验证码放置在背景上</li></ol><p>在某些情况下,我们可能需要将验证码放置在背景上,例如背景是一张大图,我们需要将验证码放置在画面角落中。</p><p>要实现这个功能,我们可以先生成一个不带验证码的背景图,然后将验证码绘制到背景上。</p><p>下面是一个基本的实现:</p><pre class="brush:php;toolbar:false">&lt;?php session_start(); header(&quot;Content-type: image/png&quot;); $width = 300; $height = 200; $img = imagecreate($width, $height); imagecolorallocate($img, 255, 255, 255); //设置背景颜色 // 生成不带验证码的背景图 $bg_img = imagecreatefromjpeg(&amp;#39;bg.jpg&amp;#39;); imagecopy($img, $bg_img, 0, 0, 0, 0, $width, $height); $code_len = 4; $charset = &amp;#39;abcdefghkmnprstuvwxyABCDEFGHKMNPRSTUVWXY3456789&amp;#39;; $code = &amp;#39;&amp;#39;; for ($i = 0; $i &lt; $code_len; $i++) { $code .= $charset[mt_rand(0, strlen($charset) - 1)]; } $_SESSION[&amp;#39;verify_code&amp;#39;] = strtoupper($code); // 将验证码写入背景图中 $font_color = imagecolorallocate($img, mt_rand(0, 100), mt_rand(0, 100), mt_rand(0, 100)); for ($i = 0; $i &lt; $code_len; $i++) { $font_size = mt_rand(12, 16); $angle = mt_rand(-10, 10); $f_x = mt_rand(0, $width - ($font_size + 3)); $f_y = mt_rand(0, $height - $font_size); imagestring($img, $font_size, $f_x, $f_y, $code[$i], $font_color); //输出验证码 } imagepng($img); imagedestroy($img);</pre><p>在上面的代码中,我们先加载原始背景图 <code>bg.jpg

예를 들어 캔버스 중앙에 인증 코드를 수정하는 경우 $f_x$f_y 값만 다음과 같이 수정하면 됩니다.
    rrreee
  1. 실행 후 캔버스 중앙에 인증코드가 나타납니다.
    1. 지정된 HTML 요소 내에 인증 코드를 삽입하세요

      🎜지정된 HTML 요소 내에 인증 코드를 삽입하려면 CSS를 통해 캔버스 위치를 제어하고 캔버스를 삽입하면 됩니다. HTML 요소 중간에. 🎜🎜예를 들어 <div id="verify"> 요소 안에 확인 코드를 배치하려면 CSS에 다음 코드를 추가하면 됩니다. 🎜rrreee🎜그런 다음 다음을 추가하세요. code in HTML: 🎜rrreee🎜위 코드를 사용하면 생성된 인증 코드를 지정된 요소에 삽입할 수 있으며 그 위치는 CSS에 의해 제어됩니다. 🎜<ol start="3">🎜배경에 인증 코드를 배치하세요🎜🎜🎜경우에 따라 인증 코드를 배경에 배치해야 할 수도 있습니다. 예를 들어 배경이 큰 그림인 경우에는 인증 코드를 배치해야 합니다. 화면 모서리에 있는 인증 코드를 확인하세요. 🎜🎜이 기능을 구현하려면 먼저 인증 코드 없이 배경 이미지를 생성한 다음 배경에 인증 코드를 그려야 합니다. 🎜🎜다음은 기본 구현입니다. 🎜rrreee🎜위 코드에서는 먼저 원본 배경 이미지 <code>bg.jpg를 로드한 다음 새 캔버스에 복사한 다음 인증 코드를 생성하고 삽입합니다. 캔버스에 넣습니다. (이 예시에서 생성된 인증코드는 임의의 위치에 있다는 점에 유의하세요. 목적을 달성하려면 일부 수정이 필요합니다.) 🎜🎜🎜Summary🎜🎜🎜이 글에서는 인증 위치를 변경하는 세 가지 방법을 소개합니다. 코드 중 첫 번째는 PHP에서 생성된 확인 코드를 기반으로 하며 출력 위치를 수정하여 구현됩니다. 두 번째는 확인 코드 캔버스를 HTML 요소에 삽입하고 CSS를 통해 위치를 제어하는 ​​것입니다. 확인을 위해 배경에 확인 코드를 추가하십시오. 코드의 위치는 배경과 일치합니다. 다양한 구현 방법은 다양한 시나리오에 적합하며 실제 요구 사항에 따라 최상의 솔루션을 선택할 수 있습니다. 🎜

    위 내용은 PHP에서 인증 코드 위치를 변경하는 방법의 상세 내용입니다. 자세한 내용은 PHP 중국어 웹사이트의 기타 관련 기사를 참조하세요!

    성명:
    본 글의 내용은 네티즌들의 자발적인 기여로 작성되었으며, 저작권은 원저작자에게 있습니다. 본 사이트는 이에 상응하는 법적 책임을 지지 않습니다. 표절이나 침해가 의심되는 콘텐츠를 발견한 경우 admin@php.cn으로 문의하세요.