当前位置:首页 > 技术教程 > 正文内容

【教程】超简单的HCaptcha验证码配置(PHP版)

佳鑫2年前 (2022-11-15)技术教程26440

前言

大家在网上冲浪这么多年,肯定或多或少的遇到过类似下面这种的验证码,要么是红绿灯,要么就是斑马线……

不知道你们好奇过怎么来的没有

现在我告诉你们那些都是来自Google reCaptcha

但是Google的访问情况大家都是知道的…要么很慢,要么直接访问不了

然后hcaptcha出现了,据hcaptcha他们所说,他们不仅支持reCaptcha的所有功能,还更安全。

其他什么的感知不强,最主要是国内能正常访问,能提供人机验证服务才是最主要的

正文

注册

打开 注册界面 注册即可

然后创建一个新网站获取 sitekeysecret 

部署

部署分为前端和后端

前端

<script src='https://www.hCaptcha.com/1/api.js' async defer></script>

上面代码放进HTML的head标签里,然后再把下面的验证码显示代码放在你的表单底侧或者其他想添加的地方然后前端部署就完成了

<div class="h-captcha" data-sitekey="你的sitekey"></div>

然后把你的表单内容设置POST到hcaptcha.php即可

后端

新建一个PHP文件,命名为 hcaptcha.php 内容如下    


<?php
$Msg="";
if (isset($_POST['submit'])){
	if (isset($_POST['h-captcha-response']) && !empty($_POST['h-captcha-response'])){
		// get verify response
		$data = array(
		  'secret' => "这里填你的secret",
		  'response' => $_POST['h-captcha-response']
		);
		$verify = curl_init();
		curl_setopt($verify, CURLOPT_URL, "https://hcaptcha.com/siteverify");
		curl_setopt($verify, CURLOPT_POST, true);
		curl_setopt($verify, CURLOPT_POSTFIELDS, http_build_query($data));
		curl_setopt($verify, CURLOPT_RETURNTRANSFER, true);
		$verifyResponse = curl_exec($verify);
		$responseData = json_decode($verifyResponse);
		if ($responseData->success){
			//验证码验证成功
			//这里写你的代码
		} else {
			//验证失败
		}
	} else{
		//没有完成验证码
	}
}
?>

至此全文结束,下方附一个整合DEMO,替换sitekey和secret即可使用

DEMO

点击链接可在线预览>>

index.php

<?php
$Msg="";
if (isset($_POST['submit'])){
	if (isset($_POST['h-captcha-response']) && !empty($_POST['h-captcha-response'])){
		// get verify response
		$data = array(
		  'secret' => "0x520C0021E492973108692b184ea0D04B952687b4",
		  'response' => $_POST['h-captcha-response']
		);
		$verify = curl_init();
		curl_setopt($verify, CURLOPT_URL, "https://hcaptcha.com/siteverify");
		curl_setopt($verify, CURLOPT_POST, true);
		curl_setopt($verify, CURLOPT_POSTFIELDS, http_build_query($data));
		curl_setopt($verify, CURLOPT_RETURNTRANSFER, true);
		$verifyResponse = curl_exec($verify);
		$responseData = json_decode($verifyResponse);
		if ($responseData->success){
			//验证码验证成功
			$Msg = "验证成功";
		} else {
			$Msg = "验证失败";
		}
	} else{
		$Msg="未完成验证码";
	}
}
?>
<html>
    <head>
      <title>demo</title>
          <meta name="viewport" content="width=device-width,initial-scale=1">
       <script src="https://www.hCaptcha.com/1/api.js" async defer></script>
    </head>
    <body>
    <div>
    <h2>表单</h2>
    <div>
      <form action="" method="POST">
                 <input type="email" class="text"  placeholder="邮箱" name="mail" >
                <input type="password" class="text"  placeholder="密码" name="pwd" >
        <div class="h-captcha" data-sitekey="d037e381-43e2-4906-990f-0a89f75b9ca9"></div>
        <a><?php echo $Msg?></a>
        <input type="submit" name="submit" value="提交">
      </form>
    </div>      
  </div>
  </body>
</html>


扫描二维码推送至手机访问。

版权声明:本文由葭兴网 JaXing.cc发布,如需转载请注明出处。

本文链接:https://www.jaxing.cc/p/5.html

分享给朋友:
返回列表

没有更早的文章了...

下一篇:【教程】三分钟让你的网站支持PWA

“【教程】超简单的HCaptcha验证码配置(PHP版)” 的相关文章

【教程】linux下的Nginx自编译安装云锁进行防护

【教程】linux下的Nginx自编译安装云锁进行防护

什么是云锁?云锁是奇安信旗下的一个面向服务器安全的加固方案,具体什么的就不巴拉巴拉了,可以理解为windows电脑上的防护(防护)软件,可以用来防护服务器,以免受到有心者的侵害。除了基础防护,还需要更高级的自编译防护此篇文章是精炼了官方自编译nginx文档的一篇文章,是面向linux的 nginx的...

无需电脑,借助termux使其Android手机自己adb自己

无需电脑,借助termux使其Android手机自己adb自己

*本文内容仅适用于Android11(R)以上,因为11以下没有无限adb调试首先要下载好termux才能进行后续操作官方下载v118>>蓝奏云下载v118(推荐)>>开启手机开发者选项(以MIUI13为例)连接WIFI后进入开发者选项并启用无线调试选勾 始终允许通过此网络进...

MT管理器的【文本加/解密,编/解码】插件使用文档

MT管理器的【文本加/解密,编/解码】插件使用文档

【文本加/解密,编/解码】插件适用于MT管理器,方便开发者对字符串的一些编/解码等调试操作该插件实现的方式均为本地离线操作,无第三方依赖库,安全小巧MT管理器的插件管理->插件中心搜索"加密"即可找到安装使用方法(推荐在文本编辑中使用):加密/编码部分使用介绍现支持md5、...

MT管理器的【Java代码快速插入】插件使用文档

MT管理器的【Java代码快速插入】插件使用文档

【Java代码快速插入】插件适用于MT管理器,方便开发者对常用的Java代码进行快速填入的操作,免去繁琐的编辑步骤该插件实现的方式均为本地离线操作,无第三方依赖库,安全小巧MT管理器的插件管理->插件中心搜索"快速插入"即可找到安装使用方法(推荐在文本编辑中使用):在MT的...

宝塔面板一键安装golang环境脚本

宝塔面板一键安装golang环境脚本

由于宝塔官方迟迟不出golang一键环境且php逐渐满足不了性能,开始尝试go的怀抱开始教程:(本文环境:宝塔面板7.9.0+,OpenCloudOS8.6,x86_64,go1.20.5.linux-amd64.tar.gz)①首先确保宝塔面板已安装完成,且能正常使用,没有宝塔面板的话不保证脚本在...

gin框架的绑定器在无参数时使用默认值

gin框架的绑定器是支持默认值的,但是中文搜索引擎上硬是没搜到……遂写下这篇内容。实现方法很简单;type User struct {     Name string `form:"name&quo...

发表评论

访客

看不清,换一张

◎欢迎参与讨论,请在这里发表您的看法和观点。