这里用的是Laravel8。
这里验证码要使用到fileInfo的功能,需要提前让php加载此dll or so,在php.ini中修改:
验证码功能最终实现的效果是:
首先添加相关库:
composer require mews/captcha --ignore-platform-req=ext-fileinfo
其次再生成对应的config文件:
php artisan vendor:publish
输入你那边mews/captcha相关的选项:
我这里是选项11。
默认验证码为9位,这里太多了,看不清,修改下captcha.php
- <?php
-
- return [
- 'characters' => ['2', '3', '4', '6', '7', '8', '9', 'a', 'b', 'c', 'd', 'e', 'f', 'g', 'h', 'j', 'm', 'n', 'p', 'q', 'r', 't', 'u', 'x', 'y', 'z', 'A', 'B', 'C', 'D', 'E', 'F', 'G', 'H', 'J', 'M', 'N', 'P', 'Q', 'R', 'T', 'U', 'X', 'Y', 'Z'],
- 'default' => [
- 'length' => 5,
- 'width' => 120,
- 'height' => 36,
- 'quality' => 90,
- 'math' => false,
- 'expire' => 60,
- 'encrypt' => false,
- ],
- ......
- ......
- ];
这里default.length的大小本来是9的,我改成了5。
生成对应的Controller
php artisan make:controller CaptchaValidationController
在CaptchaValidationController.php中生成验证码:
- <?php
-
- namespace App\Http\Controllers;
-
- use Illuminate\Http\Request;
-
- class CaptchaValidationController extends Controller
- {
- public function reloadCaptcha()
- {
- return response()->json(['captcha'=> captcha_img()]);
- }
- }
这里这个Controller就是验证码服务了。就完成了。
下面是使用。
前端:
JS相关:
- <script type="text/javascript">
-
- $('#captchaImg').click(function(){
- $(this).prop('src',"{{captcha_src()}}" + Math.random(1000,9999));
- });
- </script>
HTML相关:
- <div class="row">
- <div class="col" style="max-width: 140px">
- <img src="{{ captcha_src() }}" id="captchaImg" >
- </div>
- <div class="col pull-left ">
- <input type="text" autocomplete="off" placeholder="验证码" id="captcha" class="form-control" name="captcha">
- </div>
- </div>
后端:
- public function customLogin(Request $request)
- {
- $request->validate([
- 'email' => 'required|email',
- 'password' => 'required|min:6|max:128',
- 'captcha' => 'required|captcha'
- ]);
- ......
- ......
- }
这里Laravel自己做了处理,我们只要添加了captcha,就可以了。这里感觉比其他语言少写了好多逻辑判断代码。