window.location.hrefのCSRFトークンを追加する

Question

私はwindow.location.hrefをjavascriptでいくつか使用しています。すべてにCSRFトークンを追加する一般的な方法はありますか？ window.locationのオブジェクトがあるので

とwindow.location.hrefは、我々はそれをオーバーライドすることはできません、そのプロパティの 一つです。

以下のような共通の機能を記述し、すべての インスタンスをルーティングする方が手作業で時間がかかります。

addCSRFAndProceed(url); 
function addCSRFAndProceed (url) { 
    window.location.href = url + getCSRFTokenAndValue(); 
} 

バックエンドのコード は、ここに私のバックエンドからCSRFクッキーを設定するためのコードです。

$_COOKIE['CSRFTOKEN'] = '123456'; 

HTMLコード

<div class="redirect-button" onclick="TriggerRequest()"> 

Javascriptコード

function TriggerRequest() { 
    window.location.href="www.mysite.com/?index.php&from=desktop"; 
} 

私はwindow.location.hrefを使用するさまざまな機能を持っており、それがするので、URLにトークンを追加する一般的な解決策を期待手動ですべての機能を追加することに忙しい。

Answer 1

とmetaタグで出力CSRFトークンを

<meta id="csrf" name="csrf-token" content="{{ csrf_token() }}"> 

（トークンがどこから来て持っているので、私の例では、関連するわずか1行のため）私はバックエンドの状況としてlaravelから話すだろうしましょうid csrfの権利ですか？あなたはまた、クエリ文字列パラメータtokenをチェックするバックエンドのコードを書く必要がありますだけにして要求されたページを返す

addCSRFAndProceed(url); 
function addCSRFAndProceed (url) { 
    window.location.href = url + '?token=' + getCSRFTokenAndValue(); 
} 

function getCSRFTokenAndValue() { 
    return document.getElementById("csrf").getAttribute('content'); 
} 

：まあ、あなたのリダイレクトコードを使用すると変更

は次のように動作します。あなたはバックエンド（あなたがNode.jsの話ではないされていると仮定した場合）にCSRFトークンを生成しなければならない（サーバー側の検証）

擬似コード（まだあなたのバックエンドを知らない）

if ($query_string_array['token'] == 'accepted token') { 
    return view:page; 
} else { 
    return error: token does not match; 
}