Yii2中验证码在模型中captcha验证失败及点击换验证码

  •   
  • 13393
  • PHP
  • 0
  • super_dodo
  • 2015/11/09

在Yii2的开发中，前端用户登陆不需要验证码,但是对于管理员登陆则需要使用验证码这样为了安全性考虑。

一般后台方面的模块会新建一个Modules。假设建立了一个admin的模块，这个时候需要把验证码也已到admin模块下面的site控制器中。

//验证码
public function actions(){
	return [
		'error' => [ 'class' => 'yii\web\ErrorAction', ],
		'captcha' =>  [
			'class' => 'yii\captcha\CaptchaAction',
			'height' => 40,
			'width' => 80,
			'minLength' => 4,
			'maxLength' => 4
		],
	];
}


//管理员登陆
public function actionLogin(){
	if (!\Yii::$app->user->isGuest) {
		$this->redirect('/admin/');		//后台登陆成功
	}
	$model = new LoginForm();
	if ($model->load(Yii::$app->request->post()) && $model->login()) {
		$this->redirect('/admin/');		//后台登陆成功
	//	return $this->goBack();
	}
	return $this->renderPartial('login', ['model' => $model,] );
}

这个时候对于验证码得到则采用 /admin/site/captcha?refresh 这个方法。视图层的代码如下：

<!DOCTYPE HTML>
<html lang="en-US">
<head>
	<meta charset="UTF-8">
	<meta name="viewport" content="width=device-width, initial-scale=1">
	<meta name="csrf-param" content="_csrf">
	<meta name="csrf-token" content="<?php echo Yii::$app->getRequest()->getCsrfToken();?>">
	<title>管理员登陆</title>
	<meta name="keywords" content="">
	<meta name="description" content="">
	<link rel="shortcut icon" href="/favicon.ico" type="image/x-icon" />
	<link rel="stylesheet" href="/assets/css/common.css">
	<link rel="stylesheet" href="/assets/css/login_reg.css">
	<script src="/assets/js/jquery-1.7.2.js" type="text/javascript"></script>
</head>
<body>
<form action="/admin/site/login" method="post" id="login-form" class="form-inline">
	<input type="hidden" name="_csrf" value="<?php echo Yii::$app->getRequest()->getCsrfToken(); ?>" />
	<h3>管理员登录</h3>
	<div class="loginTr">
		<span class="loginTip">用户名</span>
		<input type="text" class="form-control loginInput" id="username" name="LoginForm&#91;username&#93;" placeholder="请输入用户名或手机号"/>
		
	</div>

	<div class="loginTr">
		<span class="loginTip">密  码</span>
		<input type="password" class="form-control loginInput" name="LoginForm&#91;password&#93;" placeholder="请输入密码"/>
	</div>

	<div class="loginTr">
		<span class="loginTip">验证码</span>
		<input type="text" class="form-control xx5" style="width:80px;" name="LoginForm&#91;verifyCode&#93;" />
		<img onclick="changeVerifyCode()" id="imgVerifyCode" align="middle" title="点击换一张" src="" valign="absmiddle">
		<a style="cursor:pointer;" onclick="changeVerifyCode()">换一张</a>
	</div>

	<div class="loginTr">
		<button type="submit" class="loginBtn btn btn-success" title="登录">  登  录  </button>  
		<a href="javascript:;" class="btn btn-info" id="clear_form">清除</a>
	</div>
	<div class="loginTr">
		<span class="loginErr">
			<?php echo ($_POST && isset($model->errors['username'][0])) ? $model->errors['username'][0] : '';?>
			<?php echo ($_POST && isset($model->errors['password'][0])) ? $model->errors['password'][0] : '';?>
			<?php echo ($_POST && isset($model->errors['verifyCode'][0])) ? $model->errors['verifyCode'][0] : '';?>
		</span>
	</div>
</form>

<script type="text/javascript">
	$(function(){                   //当页面加载的时候
		changeVerifyCode();         //刷新或者重新加载一个验证码

		//清除输入框里面的数据
		$("#clear_form").click(function(){
			$("input").val('');
		});
	});

	//更改或者重新加载验证码
	function changeVerifyCode() {
		$.ajax({
			url: "/admin/site/captcha?refresh",
			dataType: 'json',
			cache: false,
			success: function(data) {
				$('#imgVerifyCode').attr('src', data['url']);
				$('body').data('/admin/site/captcha?refresh', [data['hash1'], data['hash2']]);
			}
		});
	}
</script>

</body>
</html>

登陆的方法可以继续使用LoginForm的方法。

public function rules(){
	return [
		// username and password are both required
		[['username', 'password','verifyCode'], 'required','message'=>'{attribute}不能为空'],
		// rememberMe must be a boolean value
		['rememberMe', 'boolean'],

		['verifyCode', 'captcha','captchaAction'=>'/admin/site/captcha','message'=>'{attribute}有误'],  //验证验证码是否正确

		// password is validated by validatePassword()
		['password', 'validatePassword'],

	];
}

如果captcha验证报错 Yii2 Invalid CAPTCHA action ID in module 的时候请检查你的model里面的是否有'captchaAction'=>'/admin/site/captcha'。该验证的重点为'captchaAction'=>'/admin/site/captcha' 这样就可以和site/captcha分开了。验证也能成功。

该方法为自定义的登陆可以实现用户点击验证码图片或者点击文字实现换验证码的功能。

故天将降大任于是人也，必先苦其心志，劳其筋骨，饿其体肤，空乏其身，行拂乱其所为，所以动心忍性，增益其所不能。----孟轲