2024年9月〜2024年10月
melodycluecreateCookieSessionStorageはCookieに直接データを入れる
(where the session data itself is stored in the session cookie with the browser, see cookies)
もしデータを外部(redisとか)に持たせたい場合はcreateSessionStorageを使う
よってネット上にあるremixの例では、自社のセキュリティ要件に合わないこともあるので注意
例えばメールアドレスをcookieに入れるとか。
ただ、remixのcookieは暗号化されるので、httpOnlyやsecureなどの属性をきちんとすれば大抵は大丈夫とのこと。
melodyclue結局lucia-authに落ち着いた
セッションをDBに持たせて、google 0auth2をログイン方法とする
luciaはセッションの作成、破壊の扱いが楽。
セッションライブラリといってもいいかも
0auth2についてもarcticのおかげで比較的楽に実装できた
データベース、ホスティングはどちらもRender.comで。
シンガポールリージョンだけどまあ許容できるレベルかな
melodyclueメールアドレスを入力したらコードが届きそれを入力してメールアドレス検証したい
コード入力は普通のInputでもいいと思うけど、shadcnのOtp Inputを利用すると格段に便利になる！
REGEXPとして入力バリデーションが用意されている👍
declare const REGEXP_ONLY_DIGITS = "^\\d+$";
declare const REGEXP_ONLY_CHARS = "^[a-zA-Z]+$";
declare const REGEXP_ONLY_DIGITS_AND_CHARS = "^[a-zA-Z0-9]+$";
melodyclueCookieだろうがlocalstorageだろうがどっちもXSSの前には無力です
基本的に安全な場所なんてないっていう認識
それでもできるだけ安全な場所(安全な方法)で保存しようとすることは大前提であると...
melodyclueoslo便利ですね！
以下の例は30日後の日付️（期限）をDateで取得する関数です
普通にやっても良いんですけど、このライブラリのおかげで
感覚的に意味が分かりやすくなりました
import { createDate, TimeSpan } from "oslo";
const getSessionExpirationDate = () => createDate(new TimeSpan(30, "d")); // in 30 days