Laravel驗證碼

Laravel圖片驗證碼步驟:git

1.從github中下載 gregwar/captchagithub

2.用composer集成到Laravel項目中,集成命令爲:在composer.json中「require」中添加,「gregwar/captcha」:"1.*"   在和"require"同一級下面添加"minimum-stability":"dev",json

3.經過在命令行中定位到當前文件的目錄中輸入 composer update 更新session

4.在控制器中引入文件 use Gregwar/Captcha\CaptchaBuilder;composer

函數 dom

//生成驗證碼
    public  function  verification(){

//        $input = Request::all();
        //生成驗證碼圖片的Builder對象,配置相應屬性
        $builder = new CaptchaBuilder;
        //能夠設置圖片寬高及字體
        $builder->build($width = 100, $height = 40, $font = "0");
        //獲取驗證碼的內容
        $phrase = $builder->getPhrase();

        //把內容存入session
//        Session::flash('milkcaptcha', $phrase);
        //生成圖片
        $builder->output();
    }
}

在路由中定義 函數

//驗證碼
Route::get('verification','LoginController@verification');

在HTML中使用驗證碼圖片:字體

<img src="/verification" onclick="getImage(this)" class = "img" style = "margin:0px;">

js代碼ui

<script>
        {{--提交的時候 驗證全部的輸入是否有值--}}
        function isAllInput(){
            var name = document.getElementById('telephone').value;
            if(name.length<1) document.getElementById("telephone_title").innerHTML="請輸入手機號";
            else document.getElementById("telephone_title").innerHTML="";

            var password = document.getElementById('password').value;
            if(password.length<1) document.getElementById("password_title").innerHTML="請輸入密碼";
            else document.getElementById("password_title").innerHTML="";

            var verification = document.getElementById('verification').value;
            if(verification.length<1) document.getElementById("verification_title").innerHTML="請輸入圖片驗證碼";
            else document.getElementById("verification_title").innerHTML="";
        }
//      每個輸入的判斷 title:提示語  id:當前控件
        function isInput(id,title){
            var inputText = id.value;
            var inputId = id.name;
            if(inputText<1) document.getElementById(inputId+"_title").innerHTML=title;
            else document.getElementById(inputId+"_title").innerHTML="";

        }
        //        獲取驗證碼圖片  加上?與Math.random()是爲了能獲取到圖片 不然是不能獲取到圖片的
        function getImage(id){
            id.src="/verification?"+Math.random();
        }
    </script>
相關文章
相關標籤/搜索