Angular2에서 Google ReCaptcha 구현

Question

현재 Angular 2로 애플리케이션을 개발 중이며 사용자 확인을 위해 Google의 ReCaptcha를 사용하고자합니다. 그러나 지금까지 본 모든 커뮤니티 생성 모듈은 일단 API에 가입하면 제공되는 비밀 키를 사용하여 서버 측 인증을 사용하지 않는 것 같습니다.

이전에 Javascript로 명시 적 렌더링 기능을 사용하여 ReCaptcha를 구현했습니다. 그러나, 내 Angular 2 Typescript 코드 내에서 동일한 기능을 구현하는 방법을 잘 모르겠습니다. 이상적으로 사용자가 ReCaptcha를 클릭하게하고 ReCaptcha가 완료되면 사용자가 양식을 제출할 수 있도록 제출 버튼을 표시 한 다음 백엔드 서버가 비밀 키가 포함 된 최종 확인을 완료하게합니다. 이 작업은 http.post 호출을 통해 수행됩니다.

https://developers.google.com/recaptcha/docs/verify

그러나, 일반적으로 제출하면 내가 사용자가 reCAPTCHA를 가이드에 설명 된대로 양식을 제출하면 http.post을 통해 전송 받고있는 것으로 생각하고있는 "G-reCAPTCHA를 응답"나를 제공하지 않습니다

누군가에게 조언이나 경험이 있으면 알려 주시기 바랍니다. 또한 필요한 추가 정보가있는 경우, 여기에 질문을 게시 할 때 상대적으로 새로운 질문을하십시오.

Answer 1

angular2에서 이것을 설명하는 환상적인 글이 있습니다. 나는 그것이 당신에게이 접근법을 생각할 수 있다고 생각합니다.
사용자가 recaptcha 버튼을 클릭 한 후 백엔드 서버에 전화해야합니다. 이 후 확인을 위해 Google recaptcha api에 사이트 키를 보낼 수 있습니다.

app.get('/validate_captcha', (req, res) => { 
     const options = { 
     method: 'POST', 
     uri: 'https://www.google.com/recaptcha/api/siteverify', 
     qs: { 
      secret, 
      response: req.query.token 
     }, 
     json: true 
     }; 

     rp(options) 
     .then(response => res.json(response)) 
     .catch(() => {}); 

    }); 

이렇게하면 백엔드 쪽에서 도움이됩니다.
이 기사 나 문서에서 말한 것처럼 프론트 엔드에서 grecaptcha-response를 얻을 수 있습니다. 당신이 방정식의 PHP 측을 찾고 있다면
당신이 [이 답변] 한 번 봐 가질 수이 링크 recaptcha