使用 reCAPTCHA 响应 Native

React Native with reCATPCHA

我正在尝试在我的 React 本机应用程序中实现 google reCAPTCHA。我正在使用包装的网络视图。

<WebView 
    javaScriptEnabled={true} 
    mixedContentMode={'always'} 
    style={{height: 200}} 
    source={{
        html: this.getWebviewContent()
    }}/>


getWebviewContent(){
    var originalForm = '<!DOCTYPE html><html><head><script src="https://www.google.com/recaptcha/api.js"></script></head><body><form action="[POST_URL]" method="post"><input type="hidden" value="[TITLE]"><input type="hidden" value="[DESCRIPTION]"><input type="hidden" value="[URL]"><div class="g-recaptcha" data-sitekey="<My key>"></div><input type="submit" value="Send"/></form></body></html>'
    var tmp =  originalForm
        .replace("[POST_URL]", "http://localhost:3000/v1/video")
        .replace("[TITLE]", this.state.form.title)
        .replace("[DESCRIPTION]", this.state.form.description)
        .replace("[URL]", this.state.form.url); 

    return tmp; 
}

如果我渲染它，它会给我以下错误：

我有一个理论，它不想合作，因为我运行它作为 WebView 中的 "file" 并且你不能添加文件作为Google 仪表板中的域。

有没有办法在 Google 的 reCAPTCHA 仪表板中添加 file:// 权限，或者有什么方法可以伪造域，以便我可以在仪表板中添加该伪造的域。还是我完全迷路了，问题出在其他地方？

您可以通过在 source prop:

中设置 baseUrl 来为您的 WebView 设置域

<WebView 
    javaScriptEnabled={true} 
    mixedContentMode={'always'} 
    style={{height: 200}} 
    source={{
        html: this.getWebviewContent(),
        baseUrl: 'http://your-domain.com' // <-- SET YOUR DOMAIN HERE
    }}/>


getWebviewContent(){
    var originalForm = '<!DOCTYPE html><html><head><script src="https://www.google.com/recaptcha/api.js"></script></head><body><form action="[POST_URL]" method="post"><input type="hidden" value="[TITLE]"><input type="hidden" value="[DESCRIPTION]"><input type="hidden" value="[URL]"><div class="g-recaptcha" data-sitekey="<My key>"></div><input type="submit" value="Send"/></form></body></html>'
    var tmp =  originalForm
        .replace("[POST_URL]", "http://localhost:3000/v1/video")
        .replace("[TITLE]", this.state.form.title)
        .replace("[DESCRIPTION]", this.state.form.description)
        .replace("[URL]", this.state.form.url); 

    return tmp; 
}