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

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

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

2021-12-26

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

HTML5 JavaScript WebStorage localStorage Content-Security-Policy window.postMessage オリジン

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

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

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

2021-11-18

「いらすとや」さんのトランプ画像をまとめてダウンロードする

bash ダウンロードいらすとやトランプシェル

小ネタです。

「いらすとや」さんのトランプ画像を使わせていただこうとしたら、1枚ずつ保存しなければならないようで心が折れそうになったため一括でダウンロードできるシェルスクリプトを組みました。……組んだのですが、URLのハッシュ値の法則性を解析するのが面倒だったので、結局すべてのURLのリストを作ることにｗ

せっかくなので別の方も利用されるかもしれないと思いコードを置いておきますね。悪用厳禁でお願いしますｗ

2021-11-14

[AWS] CloudFrontのオリジンを動的に変更する – Lambda@Edge + Node.js

Node.js JavaScript AWS-Lambda CDN AWS-CloudFront AWS-Lambda@Edge AWS

CloudFrontで参照しているオリジンをLambda@Edgeで変更してみます。

今回はhttp://foo.example.comでアクセスされたら、CloudFrontがオリジンhttp://example.com/foo/へリクエストする設定をします。

正直なところあまり需要は無いと思いますがｗこの設定が生きてくるのは大量に同様の設定をしなければならない時ですね。設定が必要なドメインが2〜3個であればCloudFront側でディストリビューションを必要なだけ作成する方がわかりやすいです。

というわけで先ほどの例の「foo」の部分はどのような文字列が来ても対応可能なよう設定していきます。

2021-11-03

[JavaScript] 数値がゾロ目か判定する

JavaScript 正規表現ゾロ目 HTML5

小ネタです。

指定された数値がゾロ目かどうかを判定する正規表現を試してみます。説明するまでも無いと思いますが「1111」「8888」など同じ数だけで構成された数値をゾロ目と言います。

結論から言うと以下の通り。

/**
 * ゾロ目判定
 *
 * @param {number} num
 * @returns {boolean}
 */
function isZorome(num){
  return String(num).match(/^([0-9])\1+$/) !== null
}

2021-10-20

[AWS] Serverless FrameworkでLambdaをArm64対応する

AWS AWS-Lambda ServerlessFramework Arm64

AWS Lambdaが2021年9月29日からArm64に対応しました。デフォルトではx86…要はIntelのCPUが使われていますが、Arm64を選択するだけで20%のコストダウン、最大19%のパフォーマンスの向上が期待できるとか！乗るしかない！このビッグウェーブに！