Use reCaptcha with ZK"

From Documentation
Line 15: Line 15:
  
 
<source lang='xml'>
 
<source lang='xml'>
<zk xmlns:n="native" xmlns:c="client">
+
<zk xmlns:c="client" xmlns:x="xhtml">
<script type="text/javascript" src='https://www.google.com/recaptcha/api.js'  
+
<script type="text/javascript" src='https://www.google.com/recaptcha/api.js' defer="true" />
defer="true" />
+
...
..
+
<x:div id="recaptcha" class="g-recaptcha"  
 
+
data-sitekey="your-key"
<n:div class="g-recaptcha" data-sitekey="6Lcj5AYTAAAAAHp_ATdyZcWkMi7lzO_JZPMhYj4S"
+
data-callback="afterValidate" />
data-callback="afterValidate" />
 
 
</source>
 
</source>
  

Revision as of 09:13, 30 March 2017

DocumentationSmall Talks2017MayUse reCaptcha with ZK
Use reCaptcha with ZK

Author
Hawk Chen, Engineer, Potix Corporation
Date
?
Version
ZK 8.0.4

Introduction

Google reCaptach is an easy to use and free service that protects your site from spam and bot. Users usually just need one click to pass the check instead of reading twisted words like Captcha. This article will show you how to use it within ZK framework.

Get reCaptcha

Please follow Google's guide to get reCaptcha API key: https://developers.google.com/recaptcha/docs/start

How to Apply

Include recaptcha API & Configuration

<zk xmlns:c="client" xmlns:x="xhtml">
	<script type="text/javascript" src='https://www.google.com/recaptcha/api.js' defer="true" />
	...
	<x:div id="recaptcha" class="g-recaptcha" 
		data-sitekey="your-key"
		data-callback="afterValidate" />

Check Verification Result

Reuse

Comments



Copyright © Potix Corporation. This article is licensed under GNU Free Documentation License.