Codeigniter Google Recaptcha Form Validation Example

September 9, 2019 XpertPhp Comments 1 comment

In this tutorial, we are going to create the Codeigniter Google Recaptcha Form Validation Example. normally captcha is used for security purpose and only human users can pass through. computers or bots are not solving a captcha.

Now we will learn about captcha that how to integrate the Google reCAPTCHA in Codeigniter. so you can see below google captcha code form Validation with Codeigniter.

Overview

Step 1: Create a Database in table
Step 2: Connect to Database
Step 3: Get and Set Google Captcha Secrets
Step 4: Create Controller
Step 5: Create View File

Step 1: Create a Database in table
In this step, we have to create a table in the database, so we will create a database using the below code.

CREATE TABLE IF NOT EXISTS `register` (
  `id` int(11) NOT NULL AUTO_INCREMENT,
  `first_name` varchar(64) NOT NULL,
  `last_name` varchar(64) NOT NULL,
  `address` text NOT NULL,
  `email` varchar(64) NOT NULL,
  `mobile` varchar(12) NOT NULL,
  PRIMARY KEY (`id`)
) ENGINE=InnoDB  DEFAULT CHARSET=latin1 AUTO_INCREMENT=15 ;

CREATE TABLE IF NOT EXISTS `register` (

`id` int(11) NOT NULL AUTO_INCREMENT,

`first_name` varchar(64) NOT NULL,

`last_name` varchar(64) NOT NULL,

`address` text NOT NULL,

`email` varchar(64) NOT NULL,

`mobile` varchar(12) NOT NULL,

PRIMARY KEY (`id`)

) ENGINE=InnoDB DEFAULT CHARSET=latin1 AUTO_INCREMENT=15 ;

Step 2: Connect to Database
Go to the config folder and open database.php file some changes in this file like hostname, database username, database password, and database name.

$db['default'] = array(
	'dsn'	=> '',
	'hostname' => 'localhost',
	'username' => 'root',
	'password' => '',
	'database' => 'enter here database name',
	'dbdriver' => 'mysqli',
	'dbprefix' => '',
	'pconnect' => FALSE,
	'db_debug' => (ENVIRONMENT !== 'production'),
	'cache_on' => FALSE,
	'cachedir' => '',
	'char_set' => 'utf8',
	'dbcollat' => 'utf8_general_ci',
	'swap_pre' => '',
	'encrypt' => FALSE,
	'compress' => FALSE,
	'stricton' => FALSE,
	'failover' => array(),
	'save_queries' => TRUE
);

$db['default'] = array(

'dsn' => '',

'hostname' => 'localhost',

'username' => 'root',

'password' => '',

'database' => 'enter here database name',

'dbdriver' => 'mysqli',

'dbprefix' => '',

'pconnect' => FALSE,

'db_debug' => (ENVIRONMENT !== 'production'),

'cache_on' => FALSE,

'cachedir' => '',

'char_set' => 'utf8',

'dbcollat' => 'utf8_general_ci',

'swap_pre' => '',

'encrypt' => FALSE,

'compress' => FALSE,

'stricton' => FALSE,

'failover' => array(),

'save_queries' => TRUE

);

Step 3: Get and Set Google Captcha Secrets
First, we need to Google reCAPTCHA site key and secret key. so first we go to Google reCAPTCHA panel and get site key and secret key.

After getting the key, we will create a form using the bootstrap and pass the site key.

When the user fills the form data with resolves the reCAPTCHA code that time response token will be returned.

Step 4: Create Controller
In this step, we will create a Googlerecaptcha.php file in the “application/controller” directory and paste the below code in this controller.
application/controller/Googlerecaptcha.php

<?php
class Googlerecaptcha extends CI_Controller {
  
    public function __construct()
    {
        parent::__construct();
        $this->load->helper(array('url','form'));
        $this->load->library('session');
        $this->load->database();
    }
  
    public function index()
    {    
         $this->load->view('google_recaptcha_form');
    }
    public function googleForm()
	{
		$data = array(
		'first_name' => $this->input->post('first_name'),
		'last_name' => $this->input->post('last_name'), 
		'address' => $this->input->post('address'), 
		'email' => $this->input->post('email'), 
		'mobile' => $this->input->post('mobile')
		);

		$recaptchaResponse = trim($this->input->post('g-recaptcha-response'));
		$userIp=$this->input->ip_address();		 
		$secret='ENTER_YOUR_SECRET_KEY';

		$response = json_decode(file_get_contents("https://www.google.com/recaptcha/api/siteverify?secret=".$secret."&response=".$recaptchaResponse."&remoteip=".$userIp), true);
		if($response['success'] == false)
		{
		   $this->session->set_flashdata('message', 'Sorry Google Recaptcha Unsuccessful!!');
		}
		else
		{
			echo '<h2>Thanks for posting comment.</h2>';
			$this->db->insert('users',$data); 
			$this->session->set_flashdata('message', 'Google Recaptcha Successful');
		}
		redirect(base_url('googlerecaptcha'));
    }
 
}
?>

<?php

class Googlerecaptcha extends CI_Controller {

public function __construct()

{

parent::__construct();

$this->load->helper(array('url','form'));

$this->load->library('session');

$this->load->database();

}

public function index()

{

$this->load->view('google_recaptcha_form');

}

public function googleForm()

{

$data = array(

'first_name' => $this->input->post('first_name'),

'last_name' => $this->input->post('last_name'),

'address' => $this->input->post('address'),

'email' => $this->input->post('email'),

'mobile' => $this->input->post('mobile')

);

$recaptchaResponse = trim($this->input->post('g-recaptcha-response'));

$userIp=$this->input->ip_address();

$secret='ENTER_YOUR_SECRET_KEY';

$response = json_decode(file_get_contents("https://www.google.com/recaptcha/api/siteverify?secret=".$secret."&response=".$recaptchaResponse."&remoteip=".$userIp), true);

if($response['success'] == false)

{

$this->session->set_flashdata('message', 'Sorry Google Recaptcha Unsuccessful!!');

}

else

{

echo '<h2>Thanks for posting comment.</h2>';

$this->db->insert('users',$data);

$this->session->set_flashdata('message', 'Google Recaptcha Successful');

}

redirect(base_url('googlerecaptcha'));

}

Step 5: Create View File
So finally, we will create the google_recaptcha_form.php file in the “application/views/” directory and make a form with google Recaptcha code in HTML.
application/views/google_recaptcha_form.php

<!DOCTYPE html>
<html lang="en">
<head>
  <title>Codeigniter Google Recaptcha Form Validation Example - XpertPhp</title>
  <meta charset="utf-8">
  <meta name="viewport" content="width=device-width, initial-scale=1">
  <link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.4.0/css/bootstrap.min.css">
  <script src="https://ajax.googleapis.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
  <script src="https://maxcdn.bootstrapcdn.com/bootstrap/3.4.0/js/bootstrap.min.js"></script>
  <script src='https://www.google.com/recaptcha/api.js'></script>
</head>
<body>
<div class="container">
   <form id="cotact_form" action="<?php echo base_url('googlerecaptcha/googleForm') ?>" method="post">
   <div class="form-group">
    <label for="first_name">First Name:</label>
    <input type="text" class="form-control" id="first_name" name="first_name">
   </div>
   
   <div class="form-group">
    <label for="last_name">Last Name:</label>
    <input type="text" class="form-control" id="last_name" name="last_name">
   </div>
   
   <div class="form-group">
    <label for="address">Address:</label>
    <input type="text" class="form-control" id="address" name="address">
   </div>

   <div class="form-group">
    <label for="email">Email:</label>
    <input type="email" class="form-control" id="email" name="email">
   </div>
   
   <div class="form-group">
    <label for="mobile">Mobile:</label>
    <input type="text" class="form-control" id="mobile" name="mobile">
   </div>

   <div class="form-group">
      <div class="g-recaptcha" data-sitekey="here_enter_site_key"></div>
    </div>
     <button type="submit" class="btn btn-default">Submit</button>
  </form>
</div>
</body>
</html>

<!DOCTYPE html>

<head>

<title>Codeigniter Google Recaptcha Form Validation Example - XpertPhp</title>

</head>

<body>

<form id="cotact_form" action="<?php echo base_url('googlerecaptcha/googleForm') ?>" method="post">

<label for="first_name">First Name:</label>

</div>

</div>

<label for="address">Address:</label>

</div>

<label for="email">Email:</label>

</div>

<label for="mobile">Mobile:</label>

</div>

</div>

<button type="submit" class="btn btn-default">Submit</button>

</form>

</div>

</body>

</html>

Please follow and like us:

Related posts: