CSRFトークンなしでネイティブフェッチ要求に失敗する

Question

私はRailsで構築されたWebアプリケーションにモバイル補完を開発しています。 Fetch APIを使用して、「CSRFトークンの真正性を確認できません」という通知を受け取ります。

export const login = (user) => { 
    fetch('http://localhost:3000/api/session', { 
    method: 'POST', 
    credentials: 'include', 
    headers: { 
     'Accept': 'application/json', 
     'Content-Type': 'application/json' 
    }, 
    body: JSON.stringify({user}) 
    }) 
    // promise handling 
} 

編集：はそれが仕事を得るために管理が、私はまだ本当に理由を理解していません。誰かが同じ問題を抱えている場合、これが私が解決した方法です。私は自分のレールアプリケーションからform_authenticity_tokenを取得し、それを関数に渡した変数として保存しました。資格情報キーの削除はテストしていません。

export const login = (user, token) => { 
    return fetch('http://localhost:3000/api/session', { 
    method: 'POST', 
    credentials: 'include', 
    headers: { 
     'Accept': 'application/json', 
     'Content-Type': 'application/json', 
    }, 
    body: JSON.stringify({ user, authenticity_token: token }) 
    }) 

Answer 1

あなたはCSRFヘッダー内のトークンまたは無効/クロスドメインリクエストにCSRFを削除、追加する必要があります。

export const login = (user) => { 
    fetch('http://localhost:3000/api/session', { 
    method: 'POST', 
    credentials: 'include', 
    headers: { 
     'Accept': 'application/json', 
     'Content-Type': 'application/json', 
     'X-CSRF-TOKEN': token 
    }, 
    body: JSON.stringify({user}) 
    }) 
    // promise handling 
}