2021年 12月 の投稿一覧

ログイン画面にreCAPTCHA v3を導入する

ユーザー登録やログインなどで不安になるのが「ボット」の存在です。

検索エンジンのクローラーなど悪意の無いものであればよいのですが、機械的に大量のユーザーを作成されたり、悪意のある人が第三者のアカウントをゲットしようとプログラムを組んで攻めてくる可能性が有名なサービスになればなるほど高くなります。知名度の低いサービスであっても決済情報が保存されているような場合は狙われることもあるでしょう。

そんな心配に比較的かんたんに立ち向かえるのがGoogle社が提供する「reCAPTCHA」です。「私はロボットではありません」のチェックボックスを見かけたことがある方も多いと思いますが、最新版のv3ではこのチェックも不要になり導入のハードルが非常に下がりました。

今回はこのreCAPTCHAをログインする仕組みに導入するという設定でまとめていきます。
続きを読む

[HTML5] 異なるオリジンのWebStorageの内容を取得する

WebStorage(localStorageとsessionStorage)は同一オリジン内のデータしか読み書きできません。名前空間を分けることでデータの衝突を防いだり、大切なデータを他のサイトから覗き見られることから守ってくれています。

しかしWebサービスを開発していると、サブドメイン間などでWebStorage内のデータを共有したいことがあります。そんなときに使うのが window.postMessage。指定したオリジンにだけWebStorage内のデータを渡したり、逆にデータを受け取ってWebStorage内に保存するといったドメインをまたいでの通信が可能になります。

同一オリジンとは「スキーム(http)」「ホスト(example.com)」「ポート番号(443)」のすべてが同じ場合を言います。詳しくはこちらをどうぞ

続きを読む