2017-09-29 28 views
0

フラスコwtf(v。0.14.2、Python 3.4.6)の文書に続いてhereonchangeイベントで反応するとCSRF token is missingというエラーが発生します。フラスコ側のFlask-WTF CSRFトークンがありません

<script type="text/javascript"> 
// Send the status of the radio buttons using AJAX 
function radio_changed(){ 
    var csrf_token = "{{ csrf_token() }}"; 

    $.ajaxSetup({ 
     beforeSend: function(xhr, settings) { 
      if (!/^(GET|HEAD|OPTIONS|TRACE)$/i.test(settings.type) && !this.crossDomain) { 
       xhr.setRequestHeader("X-CSRFToken", csrf_token); 
      } 
     } 
    }); 
    var radioValue = $("input[class=radios]:checked").val(); 
    //alert(radioValue); 
    $.ajax({ 
        url: '/_radio_update', 
        data: {value:radioValue}, 
        type: 'POST', 
        success: function(response){ 
          console.log(response); 
        }, 
        error: function(error){ 
          console.log(error); 
        } 
      }); 
} 
</script> 

その後

<form method=post action=""> 
{{ form.csrf_token }} 
... 

... 
from flask_wtf.csrf import CSRFProtect 

app = Flask(__name__) 
app.secret_key = 'shhhhhhh!' 
csrf = CSRFProtect(app) 

@app.route('/_radio_update', methods=['GET', 'POST']) 
def _radio_update(radiostatus): 
    print(radiostatus) 
... 

私は何かが足りないのですか?

+0

ブラウザは実際にトークンを送信しますか?あなたの開発ツールのネットワークタブを確認してください。そうでなければ 'this.crossDomain'が真だからですか? – kichik

+0

ネットワーク - >ヘッダー - >リクエストヘッダーの下でセッションクッキーのみが表示され、トークンは表示されません。私は 'crossDomain:false'と同じ結果を試しました。また、この[チュートリアル](https://d-mueller.de/blog/cross-domain-ajax-guide/)で説明されているように 'jsonp'を試してみても役に立たなかった。あなたは詳細を教えていただけますか? – xaratustra

+0

サーバがCSRFトークンを見ることができないと言った場合、サーバに存在しないか、サーバにバグがあります。私たちはそこにないトークン、具体的にはブラウザがそれを送信しないようにしました。次に、JavaScriptを行単位でトレースして、計画どおりに行かないものを確認します。 – kichik

答えて

1

wtformsから輸入Formsdocumentationの最後にノートによると、問題の原因flask.ext.wtfからの輸入ものの違いがあるようです。

from wtforms import Form, RadioField, SubmitField, validators 
class InputForm(Form): 
... 

これが私のために問題を解決し

from wtforms import RadioField, SubmitField, validators 
from flask_wtf import FlaskForm 
class InputForm(FlaskForm): 
... 

へ:

廃止通知を扱った後、最終的に私はラインを変更しました。

関連する問題