reCAPTCHA v3网络密集型Web应用程序 [英] reCAPTCHA v3 network intensive web applications

查看:90
本文介绍了reCAPTCHA v3网络密集型Web应用程序的处理方法,对大家解决问题具有一定的参考价值,需要的朋友们下面随着小编来一起学习吧!

问题描述

我在 reCAPTCHA v3 ://angular.io/"rel =" noreferrer> Angular 2 应用程序可防止自动提交表单.当用户与UI交互时,我的应用程序在后台进行了许多网络调用.

I'm using Google's reCAPTCHA v3 in an Angular 2 application to protect from automatic form submission. My application makes many network calls in the background as users' interact with the UI.

index.html中,我故意进行了 blocking 调用以加载库(防止在加载recaptcha/api.js之前进入Angular世界):

From index.html, I make an intentionally blocking call to load the library (preventing the Angular world from entering before recaptcha/api.js is loaded):

<script src="https://www.google.com/recaptcha/api.js?render=reCAPTCHA_site_key"></script>

从Angular 服务的构造函数中,我使用

From the constructor of an Angular Service I use the DOCUMENT DI token to reference the grecaptcha object:

  constructor(@Inject(DOCUMENT) private document: any) {
    this.grecaptcha = this.document.grecaptcha;
  }

一旦加载了应用程序(使用生命周期挂钩),上述Angular服务就会调用grecaptcha.execute获取唯一的token(根据前端集成指南):

Once the application's loaded (using lifecycle hooks), the aforementioned Angular service calls grecaptcha.execute to obtain the unique token (as per the Frontend Integration guide):

  public executeCaptcha() {
    this.grecaptcha.ready(() => {
      this.grecaptcha
        .execute(MyService.CAPTCHA_KEY, {
          action: 'execute'
        })
        .then((token: string) => this.token = token);
    });
  }

token是回调的参数,并存储为Angular服务(this.token = token))的成员.

The token is a parameter of the callback, and is stored as a member of the Angular service (this.token = token)).

目前,该应用程序尚未对我的后端进行任何API调用,也没有将该用户验证为人类.

At this point the application has not made any API calls to my backend, nor has the user been verified as a human.

必须将token发送到我的后端服务器,该服务器又必须验证用户的进行响应.

The token must be sent to my backend server, which in-turn must verify the user's response by making an API Request.

API响应然后可以返回到浏览器(角度应用程序):

The API Response can then be returned to the browser (Angular app):

{
  "success": true|false,
  "challenge_ts": timestamp,  // timestamp of the challenge load (ISO format yyyy-MM-dd'T'HH:mm:ssZZ)
  "hostname": string,         // the hostname of the site where the reCAPTCHA was solved
  "error-codes": [...]        // optional
}

问题

  • 应该将token与我的Angular中的每个HTTP请求一起发送 应用,并且每次都经过验证?
    • ...还是可以(在开始时)验证用户并在Angular应用中记住他们的得分?
    • Should the token be sent with every HTTP request from my Angular app, and verified each time?
      • ... or can the user be verified once (at the start) and their score remembered in the Angular app?
      • ...这是否意味着我应该定期(重新)验证以获得更高的分数?

      推荐答案

      如果您想确保安全,则每次用户通过表单发布数据时,都必须发送令牌(每次都是新令牌).否则,如果用户发现您只是在他第一次单击发布时就在检查他,那么他就可以运行selenium或其他脚本程序,因为他的会话已经过验证.

      If you want to be secure you have to send token (each time new one) every time user is posting data via forms. Otherwise if user find out that you are checking him just once he could click post the first time himself then he could run selenium or other scripting program, since his session would already be verified.

      请注意,您每次都需要向Google询问新令牌.首先,因为它们仅允许您一次使用一个令牌,其次,令牌在到期之前具有很短的生存时间.这两个边界是为了防止我上文所述的漏洞.

      Notice that you need to ask google each time for new token. Firstly because they allow you only to use one token single time, secondly token has small time-to-live time after which it it expired. And those two boundaries are for purpose to protect against vulnerability I described above.

      当然,在安全性和性能之间总是要权衡取舍.我不建议您缓存验证数据,但是对于某种轻量级搜索,您可以考虑使用它,但是在发布数据,更新或删除数据时,我强烈建议您不要这样做.

      Of course there is always a trade-off between security and performance. I would not recommend caching verification data, but maybe for some kind of lightweight search, you could consider it, but I would strongly advise against such practice when posting data, updating or deleting.

      这篇关于reCAPTCHA v3网络密集型Web应用程序的文章就介绍到这了,希望我们推荐的答案对大家有所帮助,也希望大家多多支持IT屋!

查看全文
登录 关闭
扫码关注1秒登录
发送“验证码”获取 | 15天全站免登陆