Skip to content

Commit 6a69deb

Browse files
rowan-mrowan-m
committed
Explicit render example
1 parent c0b9c72 commit 6a69deb

File tree

6 files changed

+165
-10
lines changed

6 files changed

+165
-10
lines changed

‎examples/index.php

Lines changed: 2 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -55,6 +55,7 @@
5555
<li><h2>reCAPTCHA v2</h2>
5656
<ul>
5757
<li><a href="/recaptcha-v2-checkbox.php">"I'm not a robot" checkbox</a></li>
58+
<li><a href="/recaptcha-v2-checkbox-explicit.php">"I'm not a robot" checkbox - Explicit render</a></li>
5859
<li><a href="/recaptcha-v2-invisible.php">Invisible</a></li>
5960
</ul>
6061
</li>
@@ -66,12 +67,11 @@
6667
</ul>
6768
</main>
6869

69-
<!-- Global site tag (gtag.js) - Google Analytics -->
70+
<!-- Google Analytics - just ignore this -->
7071
<script async src="https://www.googletagmanager.com/gtag/js?id=UA-123057962-1"></script>
7172
<script>
7273
window.dataLayer = window.dataLayer || [];
7374
function gtag(){dataLayer.push(arguments);}
7475
gtag('js', new Date());
75-
7676
gtag('config', 'UA-123057962-1');
7777
</script>

‎examples/recaptcha-v2-checkbox-explicit.php

Lines changed: 155 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,155 @@
1+
<?php
2+
/**
3+
* @copyright Copyright (c) 2015, Google Inc.
4+
* @link https://www.google.com/recaptcha
5+
*
6+
* Permission is hereby granted, free of charge, to any person obtaining a copy
7+
* of this software and associated documentation files (the "Software"), to deal
8+
* in the Software without restriction, including without limitation the rights
9+
* to use, copy, modify, merge, publish, distribute, sublicense, and/or sell
10+
* copies of the Software, and to permit persons to whom the Software is
11+
* furnished to do so, subject to the following conditions:
12+
*
13+
* The above copyright notice and this permission notice shall be included in
14+
* all copies or substantial portions of the Software.
15+
*
16+
* THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR
17+
* IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY,
18+
* FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE
19+
* AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER
20+
* LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM,
21+
* OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN
22+
* THE SOFTWARE.
23+
*/
24+
// Initiate the autoloader. The file should be generated by Composer.
25+
// You will provide your own autoloader or require the files directly if you did
26+
// not install via Composer.
27+
require_once __DIR__ . '/../vendor/autoload.php';
28+
29+
// Register API keys at https://www.google.com/recaptcha/admin
30+
$siteKey = '';
31+
$secret = '';
32+
33+
// Copy the config.php.dist file to config.php and update it with your keys to run the examples
34+
if ($siteKey == '' && is_readable(__DIR__ . '/config.php')) {
35+
$config = include __DIR__ . '/config.php';
36+
$siteKey = $config['v2-standard']['site'];
37+
$secret = $config['v2-standard']['secret'];
38+
}
39+
40+
// reCAPTCHA supports 40+ languages listed here: https://developers.google.com/recaptcha/docs/language
41+
$lang = 'en';
42+
?>
43+
<!DOCTYPE html>
44+
<meta charset="UTF-8">
45+
<meta name="viewport" content="width=device-width,height=device-height,minimum-scale=1">
46+
<link rel="shortcut icon" href="https://www.gstatic.com/recaptcha/admin/favicon.ico" type="image/x-icon"/>
47+
<link rel="canonical" href="https://recaptcha-demo.appspot.com/recaptcha-v2-checkbox-explicit.php">
48+
49+
<script type="application/ld+json">
50+
{
51+
"@context": "http://schema.org",
52+
"@type": "WebSite",
53+
"name": "reCAPTCHA demo - \"I'm not a robot\" checkbox - Explicit render",
54+
"url": "https://recaptcha-demo.appspot.com/recaptcha-v2-checkbox-explicit.php"
55+
}
56+
</script>
57+
58+
<meta name="description" content="reCAPTCHA demo - &quot;I'm not a robot&quot; checkbox - Explicit render" />
59+
<meta property="og:url" content="https://recaptcha-demo.appspot.com/recaptcha-v2-checkbox-explicit.php" />
60+
<meta property="og:type" content="website" />
61+
<meta property="og:title" content="reCAPTCHA demo - &quot;I'm not a robot&quot; checkbox - Explicit render" />
62+
<meta property="og:description" content="reCAPTCHA demo - &quot;I'm not a robot&quot; checkbox - Explicit render" />
63+
<link rel="stylesheet" type="text/css" href="/examples.css">
64+
65+
<title>reCAPTCHA demo - "I'm not a robot" checkbox - Explicit render</title>
66+
<header>
67+
<h1>reCAPTCHA demo</h1><h2>"I'm not a robot" checkbox - Explicit render</h2>
68+
<p><a href="/">↤ Home</a></p>
69+
</header>
70+
<main>
71+
<?php
72+
if ($siteKey === '' || $secret === ''):
73+
?>
74+
<h2>Add your keys</h2>
75+
<p>If you do not have keys already then visit <kbd> <a href = "https://www.google.com/recaptcha/admin">https://www.google.com/recaptcha/admin</a></kbd> to generate them. Edit this file and set the respective keys in the <kbd>config.php</kbd> file or directly to <kbd>$siteKey</kbd> and <kbd>$secret</kbd>. Reload the page after this.</p>
76+
<?php
77+
elseif (isset($_POST['g-recaptcha-response'])):
78+
// The POST data here is unfiltered because this is an example.
79+
// In production, *always* sanitise and validate your input'
80+
?>
81+
<h2><kbd>POST</kbd> data</h2>
82+
<kbd><pre><?php var_export($_POST);?></pre></kbd>
83+
<?php
84+
// If the form submission includes the "g-captcha-response" field
85+
// Create an instance of the service using your secret
86+
$recaptcha = new \ReCaptcha\ReCaptcha($secret);
87+
88+
// If file_get_contents() is locked down on your PHP installation to disallow
89+
// its use with URLs, then you can use the alternative request method instead.
90+
// This makes use of fsockopen() instead.
91+
// $recaptcha = new \ReCaptcha\ReCaptcha($secret, new \ReCaptcha\RequestMethod\SocketPost());
92+
93+
// Make the call to verify the response and also pass the user's IP address
94+
$resp = $recaptcha->verify($_POST['g-recaptcha-response'], $_SERVER['REMOTE_ADDR']);
95+
96+
if ($resp->isSuccess()):
97+
// If the response is a success, that's it!
98+
?>
99+
<h2>Success!</h2>
100+
<kbd><pre><?php var_export($resp);?></pre></kbd>
101+
<p>That's it. Everything is working. Go integrate this into your real project.</p>
102+
<p><a href="/recaptcha-v2-checkbox-explicit.php">⟳ Try again</a></p>
103+
<?php
104+
else:
105+
// If it's not successful, then one or more error codes will be returned.
106+
?>
107+
<h2>Something went wrong</h2>
108+
<p>The following error was returned:
109+
<?php
110+
foreach ($resp->getErrorCodes() as $code) {
111+
echo '<kbd>', $code, '</kbd> ';
112+
}
113+
?></p>
114+
<p>Check the error code reference at <kbd><a href="https://developers.google.com/recaptcha/docs/verify#error-code-reference">https://developers.google.com/recaptcha/docs/verify#error-code-reference</a></kbd>.
115+
<p><strong>Note:</strong> Error code <kbd>missing-input-response</kbd> may mean the user just didn't complete the reCAPTCHA.</p>
116+
<p><a href="/recaptcha-v2-checkbox-explicit.php">⟳ Try again</a></p>
117+
<?php
118+
endif;
119+
else:
120+
// Add the g-recaptcha tag to the form you want to include the reCAPTCHA element
121+
?>
122+
<p>Complete the reCAPTCHA then submit the form.</p>
123+
<form action="/recaptcha-v2-checkbox-explicit.php" method="post">
124+
<fieldset>
125+
<legend>An example form</legend>
126+
<label class="form-field">Example input A: <input type="text" name="ex-a" value="foo"></label>
127+
<label class="form-field">Example input B: <input type="text" name="ex-b" value="bar"></label>
128+
<!-- Set up a container to render the widget -->
129+
<div class="g-recaptcha form-field"></div>
130+
<!-- Disable the button by default, will enable when the widget loads -->
131+
<button class="form-field" type="submit" disabled>Submit ↦</button>
132+
</fieldset>
133+
</form>
134+
<script type="text/javascript">
135+
var onloadCallback = function() {
136+
var captchaContainer = document.querySelector('.g-recaptcha');
137+
grecaptcha.render(captchaContainer, {
138+
'sitekey' : '<?php echo $siteKey; ?>'
139+
});
140+
document.querySelector('button[type="submit"]').disabled = false;
141+
};
142+
</script>
143+
<script type="text/javascript" src="https://www.google.com/recaptcha/api.js?hl=<?php echo $lang; ?>&onload=onloadCallback&render=explicit" async defer></script>
144+
<?php
145+
endif;?>
146+
</main>
147+
148+
<!-- Google Analytics - just ignore this -->
149+
<script async src="https://www.googletagmanager.com/gtag/js?id=UA-123057962-1"></script>
150+
<script>
151+
window.dataLayer = window.dataLayer || [];
152+
function gtag(){dataLayer.push(arguments);}
153+
gtag('js', new Date());
154+
gtag('config', 'UA-123057962-1');
155+
</script>

‎examples/recaptcha-v2-checkbox.php

Lines changed: 5 additions & 4 deletions
Original file line numberDiff line numberDiff line change
@@ -72,7 +72,7 @@
7272
if ($siteKey === '' || $secret === ''):
7373
?>
7474
<h2>Add your keys</h2>
75-
<p>If you do not have keys already then visit <kbd> <a href = "https://www.google.com/recaptcha/admin">https://www.google.com/recaptcha/admin</a></kbd> to generate them. Edit this file and set the respective keys in <kbd>$siteKey</kbd> and <kbd>$secret</kbd>. Reload the page after this.</p>
75+
<p>If you do not have keys already then visit <kbd> <a href = "https://www.google.com/recaptcha/admin">https://www.google.com/recaptcha/admin</a></kbd> to generate them. Edit this file and set the respective keys in the <kbd>config.php</kbd> file or directly to <kbd>$siteKey</kbd> and <kbd>$secret</kbd>. Reload the page after this.</p>
7676
<?php
7777
elseif (isset($_POST['g-recaptcha-response'])):
7878
// The POST data here is unfiltered because this is an example.
@@ -125,21 +125,22 @@
125125
<legend>An example form</legend>
126126
<label class="form-field">Example input A: <input type="text" name="ex-a" value="foo"></label>
127127
<label class="form-field">Example input B: <input type="text" name="ex-b" value="bar"></label>
128+
<!-- Default behaviour looks for the g-recaptcha class with a data-sitekey attribute -->
128129
<div class="g-recaptcha form-field" data-sitekey="<?php echo $siteKey; ?>"></div>
130+
<!-- Submitting before the widget loads will result in a missing-input-response error so you need to verify server side -->
129131
<button class="form-field" type="submit">Submit ↦</button>
130132
</fieldset>
131133
</form>
132-
<script type="text/javascript" src="https://www.google.com/recaptcha/api.js?hl=<?php echo $lang; ?>" async defer></script>
134+
<script type="text/javascript" src="https://www.google.com/recaptcha/api.js?hl=<?php echo $lang; ?>"></script>
133135
<?php
134136
endif;?>
135137
</main>
136138

137-
<!-- Global site tag (gtag.js) - Google Analytics -->
139+
<!-- Google Analytics - just ignore this -->
138140
<script async src="https://www.googletagmanager.com/gtag/js?id=UA-123057962-1"></script>
139141
<script>
140142
window.dataLayer = window.dataLayer || [];
141143
function gtag(){dataLayer.push(arguments);}
142144
gtag('js', new Date());
143-
144145
gtag('config', 'UA-123057962-1');
145146
</script>

‎examples/recaptcha-v2-invisible.php

Lines changed: 1 addition & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -138,12 +138,11 @@ function onSubmit(token) {
138138
endif;?>
139139
</main>
140140

141-
<!-- Global site tag (gtag.js) - Google Analytics -->
141+
<!-- Google Analytics - just ignore this -->
142142
<script async src="https://www.googletagmanager.com/gtag/js?id=UA-123057962-1"></script>
143143
<script>
144144
window.dataLayer = window.dataLayer || [];
145145
function gtag(){dataLayer.push(arguments);}
146146
gtag('js', new Date());
147-
148147
gtag('config', 'UA-123057962-1');
149148
</script>

‎examples/recaptcha-v3-request-scores.php

Lines changed: 1 addition & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -112,12 +112,11 @@
112112
endif;?>
113113
</main>
114114

115-
<!-- Global site tag (gtag.js) - Google Analytics -->
115+
<!-- Google Analytics - just ignore this -->
116116
<script async src="https://www.googletagmanager.com/gtag/js?id=UA-123057962-1"></script>
117117
<script>
118118
window.dataLayer = window.dataLayer || [];
119119
function gtag(){dataLayer.push(arguments);}
120120
gtag('js', new Date());
121-
122121
gtag('config', 'UA-123057962-1');
123122
</script>

‎examples/recaptcha-v3-verify.php

Lines changed: 1 addition & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -37,6 +37,7 @@
3737
$secret = $config['v3']['secret'];
3838
}
3939

40+
// Effectively we're providing an API endpoint here that will accept the token, verify it, and return the action / score to the page
4041
$recaptcha = new \ReCaptcha\ReCaptcha($secret);
4142
$resp = $recaptcha->verify($_GET['token'], $_SERVER['REMOTE_ADDR']);
4243
header('Content-type:application/json');

0 commit comments

Comments
 (0)