angular - 不可见的 reCAPTCHA 与 Angular 分量的集成

Question

我想在 Angular 2 组件中集成不可见的 recaptcha。

这是我在 login.component.html 中的代码

 <button type="submit" class="g-recaptcha" data-sitekey="<Site-Key>" data-callback='onsubmit'> Log On </button>

并且 login.component.ts 有如下的 onsubmit 方法:

     onsubmit() {
  console.log("In onsubmit method");
}

当我从 login.component.ts 调用 onsubmit 方法时出现以下错误

ReCAPTCHA couldn't find user-provided function:onsubmit

以及如何在我的 login.component.ts 中获取“g-recaptcha-response”。

Answer 1

reCaptcha 回调无法找到您的 onsubmit 函数，因为您的组件中它是一个方法。

您可以像这样将您的全局函数附加到窗口对象:

window['onsubmit'] = () => {
    ...
}

您可以在组件的构造函数中执行此操作