专栏首页嘿dotNetASP.NET Core 使用 Google 验证码(reCAPTCHA v3)代替传统验证码

ASP.NET Core 使用 Google 验证码(reCAPTCHA v3)代替传统验证码

写在前面

友情提示:

Google reCAPTCHA(v3下同) 的使用不需要“梯子”,但申请账号的时候需要!

Google reCAPTCHA 的使用不需要“梯子”,但申请账号的时候需要!

Google reCAPTCHA 的使用不需要“梯子”,但申请账号的时候需要!

那天上班路上刷博客园,看到晓晨大佬的ASP.NET Core 使用 Google 验证码(Google reCAPTCHA)手痒不已,回家立马抽空自己也写了一遍(基本上抄晓晨大佬的),趁周末写个文,挥发下余温;(然而今天晚上下班才匆忙收尾。。。)

日常所见各类奇葩验证码

这个太有名了,必须前排

京东的

中文的:

丧心病狂的:

面对这堆无力吐槽的验证码,降低用户体验不说,也提高了开发成本;

很多现在很多公司验证码是用了第三方的,极验网易云盾等等。

也有很多公司的验证码(人机识别)模块是自己做的,有的甚至做了几套,还有更甚的甚至用上了理解图卷积算法,堪称丧心病狂;

但现在爬虫横行,恶意爬取数据,大量肉鸡爬取几乎等于dos攻击等,这算轻的;稍有不慎,暴力破解、数据泄露等安全问题也着实严峻;

so,如果现在说,有人帮你搞定这些(人机识别),让你的登录页面清清爽爽,没有验证码,你想不想爽一把。

我看你也跟我一样,定抵不住这Google.reCAPTCHA-v3这妖艳货色婀娜的身姿;

Google.reCAPTCHA(v3)

本文讲的reCAPTCHA都是v3,下同;

官方文档:https://developers.google.com/recaptcha/docs/v3 英文好的自己看看;

一句带过:reCAPTCHA 会以嵌入js的方式,给网站后台返回一个分数,这个分数是用于判断用户是否是机器人,分数的范围是0~1,分数约接近0,越像机器人;

顺便提一句,reCAPTCHA 这妖艳货色是免费的哦!

申请Google.reCAPTCHA接入权限

注册站点:https://www.google.com/recaptcha/admin/create

这里很简单啦,照着我的图瞎点就行了;

点提交之后,得到:

这两个kes是配置用的,作用页面也说清楚了;

很简单,ok,接下来看看怎么在.net core站点中使用;

继承入Asp.net Core中

1、创建项目

2、引用程序包

install-package Unicorn.reCAPTCHA.AspNetCore

这个包是晓晨大佬改过的(我也不知道改了什么[捂脸]),就先用它 不想用这个的,可以用https://github.com/TimothyMeadows/reCAPTCHA.AspNetCore

3、写个简单的登录页

AccountViewModel

	public class AccountViewModel
    {
        [Required]
        public string Username { get; set; }

        [Required]
        public string Password { get; set; }

        public string GoogleToken { get; set; }
    }

后端:

 public IActionResult Login()
        {
            return View();
        }

        [HttpPost]
        public async Task<IActionResult> Login(AccountViewModel model)
        {
            if (ModelState.IsValid)
            {
                var recaptchaReault = await _recaptcha.Validate(model.GoogleToken);

                if (!recaptchaReault.success || recaptchaReault.score < 0.08m)
                {
                    ModelState.AddModelError(string.Empty, "老实说,你是不是机器人!");
                }
                else
                {
                    ModelState.AddModelError(string.Empty, "登录成功~");
                }
            }

            return View(model);
        }

前端:

appsettings.json

{
  "RecaptchaSettings": {
    "SiteKey": "刚刚申请的SiteKey",
    "SecretKey": "刚刚申请的SecretKey",
    "Version": "v3",
    "Domain": "www.recaptcha.net"
  }
}

Startup

services.AddGoogleRecaptcha(Configuration.GetSection("RecaptchaSettings"));

4、简单测试

我们先把这里改成这样

然后调试会得到:

我还放到了对外地址上,大家有空可以点来玩玩(但提交不要点太快哦,js异步加载token太快会报错)

http://www.sophiawu.cn/

哦,对了,还有一个坑,就是你点登录按钮后点浏览器的返回按钮,再点登录,这个时候百分百识别为机器人,线上用的时候要注意这个问题

总结

以后做有人机验证需求的登录页面,多了个选择,后面多玩下,自己试着用爬虫摸一下这个页面什么的,可靠的话我就投入生产了;

本文示例代码(也没写什么新内容,大部分是看晓晨大佬那篇博客自己实现了一遍)

参考

https://www.cnblogs.com/stulzq/p/10714417.html

本文参与腾讯云自媒体分享计划,欢迎正在阅读的你也加入,一起分享。

我来说两句

0 条评论
登录 后参与评论

相关文章

  • [Hei.Captcha] Asp.Net Core 跨平台图形验证码实现

    说起来比较丢脸。我们有个手机的验证码发送逻辑需要使用验证码,这块本来项目里面就有验证码绘制逻辑,.Net Framework的,使用的包是System.Draw...

    乔达摩@嘿
  • sql server 更新两个表的某个字段

    乔达摩@嘿
  • HTML之打开/另存为/打印/刷新/查看原文件等按钮的代码

    乔达摩@嘿
  • 如何用 Python 让微博热搜榜动起来

    龙哥
  • 如何用 Python 让微博热搜榜动起来

    AirPython
  • 手把手教你用Python+Pyecharts让微博热搜榜动起来

    经分析,微博热搜数据就在网页中,可以直接requests请求,然后BeautifulSoup解析获取内容,最后存入表格中,代码如下(完整代码在文末):

    刘早起
  • 深圳大数据培训学习:继承--【千锋】

    也可以把单个方法或者字段声明为final,以确保它不能被重写,注意和Java的不同,Java中final修饰的字段意味着不可变。

    深圳java培训技术
  • MySQL auto_increment_increment,auto_increment_offset 用法

        MySQL中对于表上ID自增列可以在创建表的时候来指定列上的auto_increment属性;等同于SQL server中的identity属性;Ora...

    Leshami
  • 2019-08-07 点击地图下钻效果

    用户4344670
  • 模板语言

    常用语法 只需要记两种特殊符号: {{  }}和 {% %} 变量相关的用{{}},逻辑相关的用{%%}。 变量 {{ 变量名 }} 变量名由字母数字和下划线组...

    人生不如戏

扫码关注云+社区

领取腾讯云代金券