#63
#62
#61
まとめて

12/22までにやります
報告が遅れて申し訳ないです…！

APIをどのように呼ぶべきかと、正しく呼べたかを確認する方法がわからずに詰まっています…
とりあえず分からないなりに実装しましたが、たぶん間違っているので教えてほしいです🙏
ResetPasswordView.vue
ResetPasswordAfterMailView.vue

実際に動かして確認はできていないのですが、APIの呼び出し方は合っていそうです!
モックサーバーは./scripts/run-mock-api.shで起動できます。
ただ、今の状態ではモックサーバーのURLが間違っていて繋がらないので、scripts/gen-api.shで生成されるsrc/generated/runtime.tsの16行目で、http://localhostをhttp://localhost:4010に直して仮対応していただけると使えるようになります。(手を入れないと動かない状態で申し訳ないです。近い内に修正します)

ありがとうございます！mockサーバーに接続できてそうです

ResetPasswordFormView.vueを実装しようとしていたのですが、/reset-passwordについて、JWTが何かが調べてもあまり理解できませんでした…
どのように実装すべきか全く方針が立たないので教えていただきたいです🙏
相談遅くなってしまい申し訳ないです

まずJWTについて超簡単に説明すると，使用されている署名アルゴリズムとトークンタイプ+共有したい情報+署名からなるものです。署名によりJWTが改竄されているかどうかを判定することができ，それゆえ正しい情報をやり取りすることができます。今回はフロントからサーバーへopenapiyamlで定義されるような情報を送る必要があり，そのためにJWTを使用することにしています。

JWTの作成のためのコードを自前で用意するのは厳しいので，ライブラリを使うと良いと思います。公式のサイトからリンクされていてかつスター数が多い https://github.com/auth0/node-jsonwebtoken や https://github.com/kjur/jsrsasign を使ってみてください。これらの使い方についてはREADMEなどに載っていると思うので，それをみながら必要な情報を載せてください。人気のライブラリなのでWeb検索してもコード例が出てきそうです。

署名アルゴリズムについては書くライブラリデフォルトのもので良いと思いますが，指定する必要があるならばHS256を用いてください。

上記のライブラリを使いJWTを作成したら，そのトークンをリクエストボディに含めてAPIを叩くコードを書いてください。

またわからなければ聞いてください！

https://jwt.io/introduction
https://jwt.io/libraries

ありがとうございます！
読んで勉強します

フロント側でJWT作成する必要がなさそうな気がしています🤔
/postRequestResetPasswordからして、JWTはバックエンド側で作成していて、メールでユーザに送られたURLのパラメータとしてフロント側に送られているのかな？と思いました
認証まわりの知識が無く不安なので教えていただきたいです🙏🙏

全くもってその通りです！ごめんなさい！(自分で作ったAPIの仕様を間違えるというありえんミスをしてしまいました......)
ユーザーはクエリパラメタにJWTを持ってページに来ることが想定されるので，そのクエリパラメタをリクエストボディに含める(なければリクエストを投げない？もしくは空のままリクエストを送ってサーバー側に弾かせる？)ようにしてください

ありがとうございます！了解です👍