zoukankan      html  css  js  c++  java
  • SSM-网站后台管理系统制作(3)---Google的reCaptcha验证码

      网上找了好久,也不知道怎么接入,后来看到一篇博客才搞好  

      reCaptcha官网:https://www.google.com/recaptcha/admin#site/344147946

      参考博客:https://blog.csdn.net/baidu_38990811/article/details/83546143

      

      步骤一:按照官网介入网站获得私钥密钥就好了(Hbulider上面测试的话需要加入127.0.0.1

      

    步骤二:按照上面步骤基本就可以在Hbulider上面显示一个基本的验证码了

    代码如下(私钥是Controller层用于判断发送给Google的)

      

    <!DOCTYPE html>
    <html lang="en">
    <head>
        <title></title>
        <meta charset="utf-8">
        <meta name="viewport" content="width=device-width, initial-scale=1">
        <script src='https://www.recaptcha.net/recaptcha/api.js'></script>
    </head>
    <body>
     
    <form action="/check" method="post">
         <!-- 公钥 -->
        <div class="g-recaptcha" data-sitekey="这里是您的公钥"></div>
        <p><button class="btn btn-primary" type="submit">登录</button>
    </form>
    </body>
    </html>

       步骤三:然后把该div放到你想加入的form表单里面,发送给Controller层即可,下面分析Controller层

       步骤四:查看json中的数据:

        https://www.recaptcha.net/recaptcha/api/siteverify 

        上面这个网站即可看到返回数据为String类型,没转成json,单纯就string.indexof查找false就可以判断了,整体过程还是蛮简单的,可能由于需要科学上网的原因,导致网上关于该验证码的

    完整讲解很少。

        总体思路就是:前端发送form表单给Controller层,然后后台给Google发送数据,Google返回是否为robat(在string json中),然后用户判断json中是否有false(正确就返回success,用户也可以

    将false改成success),然后前端接收数据,判断用户是否通过(可有可无,和上面的CSDN博客一样,只是为了增加用户体验,下面给出该js代码)

     1 @RequestMapping(value="/login")
     2      public ModelAndView login(@RequestParam("loginname") String loginname,
     3              @RequestParam("password") String password,
     4              HttpSession session,
     5              ModelAndView mv, HttpServletRequest request){
     6         /****************************验证码业务************************************/
     7         String checkCode = request.getParameter("g-recaptcha-response");
     8         Map<String, Object> map = new HashMap<>();
     9          // 私钥
    10         map.put("secret", "这里写你的私钥");
    11         map.put("response", checkCode);
    12         String json = MyHttpRequest.sendPost("https://www.recaptcha.net/recaptcha/api/siteverify", map, "UTF-8");
    13         /*************************************************************************/
    14         
    15         // 调用业务逻辑组件判断用户是否可以登录
    16         User user = hrmService.login(loginname, password);
    17         if(user != null && json.indexOf("false") == -1){

      

    <script type="text/javascript">
        function check_grecaptcha() {
            if(grecaptcha.getResponse() == ""){
                alert("请先进行人机验证");
                return false;
            }
            else{
                alert("验证通过");
                return true;
            }
        }
        </script>

      到此,Google的reCATPCHA验证码就成功加入到SSM中了 

  • 相关阅读:
    BUCK/BOOST电路原理分析
    boost升压电路原理
    NPN/PNP和N沟道/P沟道负载的接法
    常用电源芯片记录
    LDO和BUCK降压稳压器对比
    some nets were not able to be matched
    Altium PCB布局时快速摆放元件的技巧
    树莓派+android things+实时音视频传输demo之遥控小车
    野狗产品与价格
    librtmp将本地FLV文件发布到RTMP流媒体服务器
  • 原文地址:https://www.cnblogs.com/meditation5201314/p/10227126.html
Copyright © 2011-2022 走看看