2017-09-01 35 views
1

私は反応するネイティブアプリにgoogle reCAPTCHAを実装しようとしています。私はラップされたwebviewを使用しています。ReactNative with reCATPCHA

<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; 
} 

私はそれをレンダリングする場合、それは私に次のエラーを与える: ERROR for site owner: Invalid domain for site key

私はそれは私が「ファイル」として、それを実行しているので、協力したくないという理論を持っていますWebView、Googleダッシュボードでドメインの一部としてファイルを追加することはできません。

GoogleのreCAPTCHAダッシュボードまたはドメインの偽造のいずれかの方法で、file://権限が追加されているので、その偽のドメインをダッシュ​​ボードに追加することができます。それとも、私は完全に失われていて、問題は何か他のものですか?

+0

それは動作しますか? ' mihai1990

+0

はい、うまくいきます!あなたのフィードバックに感謝します。あなたが例解を書くなら、私は受け入れられた答えとしてそれを設定することができます。 –

答えて

0

あなたはsource小道具でbaseUrlを設定することによって、あなたのWebViewのためのドメインを設定することができます:あなたはbaseUrlにして、ドメインを設定している場合

<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; 
} 
関連する問題