AJAX、非AJAX、JQueryを使用したJWTトークン

Question

ログイン、送信、リダイレクト中にJWTトークンを管理するのに少し不満があります。私はここに始める前に、私の技術スタックは、念のためです：

JQuery/Html -> Node.Js -> Java Restful Services -> MySQL. 

私のJavaのRESTfulサービスは、それを行うと、クライアントにそれを渡すために何を決めるのNode.js層に戻すJWTトークンを作成し管理します。これはすべて素晴らしいです。

JWTトークンを取得するには、ノードの中間層にajaxベースの認証要求を行います。これは、クライアントのlocalstorageに要約されるトークンを認証して返します。

今私は、サイト全体をajaxで1ページ分読み込むことを欲するものはありません。それは複雑なサイトであり、それをやっているだけです。私は、JWTトークンを運んでいる間に、サブページに転送してナビゲートする必要があります。

これは質問です（最後に）... JWTトークンを中間層（node.js）に送信するにはどうすればいいですか？ベアラーに関連付けられたヘッダーに埋め込む方法を見つけることができないようです。

Answer 1

あなたが唯一の選択肢は、上記の提案をしたくない場合に、トークンをクッキーに保存することです。リンクにhttpヘッダーを設定することはできません。

Answer 2

あなたが例えば使用して、クライアント側でトークンを格納する必要がありcookieまたはlocalStorage

アヤックスは、HTTPヘッダーを使用して、各リクエストでトークンを提供するために必要とされる

を要求します。例

POST /authenticatedService 
Host: example.com 
Authorization: Bearer eyJhbGciOiJIUzI1NiIsInR5cCI6IkpXVCJ9.eyJzdWIiOiIxMjM0NTY3ODkwIiwibmFtZSI6IkpvaG4gRG9lIiwiYWRtaW4iOnRydWV9.TJVA95OrM7E2cBab30RMHrHDcEfxjoYZgeFONFh7HgQ 

のためにこれはjqueryの

フォームを使用して、ヘッダを制御することはできませんフォーム送信に

を提出使ってAjaxのPOSTリクエストを実行する方法を示すためのコード例ですブラウザによって設定されるので、ベアラトークンでAuthorizationヘッダーを設定することはできません。この場合、することができます

• クッキー：フォームデータと共に送信されるクッキーでJWTを格納します。 CSRF添付を避けるために特別なセキュリティを追加する必要があります
• フォームパラメータ：JWTはフォームの非表示フィールドに格納されます。

使用常にPOST（GETではない）JWT

のキャッシュを回避するために

リンク

リンクはGETリクエストを実行します。 JWTをクエリパラメータとして追加するリンクを構築することができますurl?jwt=...

しかし、この場合セキュリティリスクがあると考えてください。ブラウザはurlをキャッシュすることができ、ログに記録されます。攻撃者は、アクセス可能であれば潜在的に入手することができます。また、ユーザーはリンクをコピーしてウェブアプリケーションの外部で使用することもできます（例：メールで送信するなど）