ユーザー登録で「300円クーポン」プレゼント!まずは無料登録から!
募集をシェアしてメンターを探そう
シェア
エンジニア Auth0 Rails Redux JWT認証 React.js

Auth0、jwtを利用した認証周りやknock(Gem)を使用したトークン検証などについてアドバイスいただける方

6月12日
予算
10,000円 〜
提案数
1人が提案中

現在SI系企業で3年ほどエンジニアとして開発を担当しておりますが、
この度転職を考えるに至りまして、ポートフォリオの制作のサポートをしていただけるエンジニアの方を探しております。

経験として
・フロントエンド1年(React,Redux)
・バックエンド1年(Java)
があるのですが、Auth0、jwtを利用した認証周りやknock(Gem)を使用したトークン検証などについてアドバイスをいただける方がいらっしゃいましたらお願いしたいです。

①現在の状況
環境としては、ローカル開発環境で、フロントエンドはSPA(react) + バックエンドはrails(APIモード)でフロントエンド、バックエンドのソースを分けて開発しております。
また、SPAからログインの際にはjwtを使用したトークン認証を行っています。
ログインの際に認証基盤であるAuth0で認証処理が行われ、コールバックで私の作成したサービスのフロントエンドに戻る際にURLのフラグメントにidトークンが付与され、それをローカルストレージに保存しておりますが、ローカルストレージに保存することは悪意のあるjavascriptライブラリにクロスサイトスクリプティングを仕込まれた場合、危険という記事を多く見かけます。
代替として、トークンをCookieに保存するという方法があるようですが、その際の実装方法について質問があります。
参考にさせていただいたのは以下のサイトです。

Reactでの認証時にJWTをCookieに設定する方法
https://zenn.dev/marokanatani/articles/d0777a34641d22
こちらの「そもそもCookieの仕組みって?」というタイトルにあるClientとServerの図ですが、/jwtにリクエストする際に、トークンはどのように保持しておくのでしょうか。
(ログイン後、すぐにバックエンドへjwtを送信するため、保持する必要がないということでしょうか??)

送信されたトークンはknockというライブラリを使用してjwtの検証をrails側で実装しております。
https://github.com/nsarno/knock

フロントエンドからサーバーにリクエストをする際の処理もどのようにjwtを渡すように実装するのか、また、rails側ではどのように検証を行い、cookieを含めてフロントエンドに渡せばよいのか、わかっておりません。

また、現在の構成でローカルストレージからrailsに送信する際に、Authorizationヘッダーにトークンを含めて送信し、rails側で検証処理を行う方法で動いてはいるもののベターなやり方であるか自信がなく、コードレビューなどもしていただけるとありがたいです。

漠然とした内容で恐縮ですが、お力を貸していただけますと幸いです。

開発環境は以下の通りです。

【フロントエンド】
・React(Functional Component,React hooks),Redux,Redux-Thunk
・Typescript
・Styled-Component

【バックエンド】
・rails APIモード(一通り実装済)

【認証】
・Auth0(jwtを使用したトークン認証。rails側で検証。現在はフロントエンドでローカルストレージに保存)

【ソース管理】
・Github(ソースコードは共有いたします)

どうぞよろしくお願いいたします。

メンティーに提案してみましょう
募集をシェアしてメンターを探そう
シェア