首先我们在控制器里创建一个actions方法，用于使用yii\captcha\CaptchaAction

request->isPost) {
      //获取post过来的验证码
      $verify = YII::$app->request->post('verify');

      //我们手动进行验证，第二个参数表示是否区分大小写
      if ($this->createAction('captcha')->validate($verify, false)) {
        echo '成功';
      } else {
        echo '失败';
      }

    } else {
      return $this->renderPartial('index');
    }
  }

  //actions的作用主要是共用功能相同的方法
  //当用户访问index/captcha时，actions就会调用yii\captcha\CaptchaAction方法
  public function actions()
  {
    return [
      'captcha' => [
        'class' => 'yii\captcha\CaptchaAction',
        'fixedVerifyCode' => null,
        //背景颜色
        'backColor' => 0x000000,
        //最大显示个数
        'maxLength' => 4,
        //最少显示个数
        'minLength' => 4,
        //间距
        'padding' => 2,
        //高度
        'height' => 30,
        //宽度
        'width' => 85,
        //字体颜色
        'foreColor' => 0xffffff,
        //设置字符偏移量
        'offset' => 4,
      ],
    ];
  }
}

显示页面代码如下：

  
  


  " method="post">
    验证码：

    ">

    
    request->csrfToken; ?>">
  

  
  
    $(function () {
      //处理点击刷新验证码
      $("#verifyImg").on("click", function () {
        $.get("?refresh", function (data) {
          $("#verifyImg").attr("src", data["url"]);
        }, "json");
      });
    });
  

演示结果如下：

上面控制器中验证码的验证方式是我们手动的。我们也可以创建一个模型配置rules()来自动完成。

 '请填写验证码'],
      //注意captchaAction的设置，指向你显示验证码的action，这里我们的是index/captcha
      ['verify', 'captcha', 'captchaAction' => 'index/captcha', 'caseSensitive' => false, 'message' => '验证码错误'],
    ];
  }
}

控制器代码修改如下：

request->isPost) {
      $verify = new VerifyForm();
      $verify->load(YII::$app->request->post(), '');

      //自动验证
      if ($verify->validate()) {
        echo '成功';
      } else {
        var_dump($verify->errors);
      }

    } else {
      return $this->renderPartial('index');
    }
  }

  //actions的作用主要是共用功能相同的方法
  //当用户访问index/captcha时，actions就会调用yii\captcha\CaptchaAction方法
  public function actions()
  {
    return [
      'captcha' => [
        'class' => 'yii\captcha\CaptchaAction',
        'fixedVerifyCode' => null,
        //背景颜色
        'backColor' => 0x000000,
        //最大显示个数
        'maxLength' => 4,
        //最少显示个数
        'minLength' => 4,
        //间距
        'padding' => 2,
        //高度
        'height' => 30,
        //宽度
        'width' => 85,
        //字体颜色
        'foreColor' => 0xffffff,
        //设置字符偏移量
        'offset' => 4,
      ],
    ];
  }
}