以前、JavaScriptでカメラを操作し写真を撮影するサンプルコードを作成しましたが、今回はそこにフォトフレームを合成してみたいと思います。 プリクラやスマホアプリでよくある見かけるやつですね。撮影した画像をダウンロードすることもできます。

canvasタグに現在描画されている内容を画像としてクライアントにダウンロードしてみます。 Webブラウザなどのクライアントだけで完結するためサーバの負荷などを気にする必要がありません。 今回はひたすらカウントアップするcanvasを、ボタンを押したタイミ…

今回は複数のcanvasタグを合成し、最終的に1つのcanvasに画像として結合する処理を取り上げたいと思います。 ↑こんな感じで画像を表示したcanvasと、キャプションを表示したcanvasを合成します。

小ネタです。 例えばsplitコマンドなどで分割したファイルをダウンロードした際に、一つ一つMD5の値を確認するのはダルいですよね。md5sumコマンドでは、予め検証したいファイルのパスとそのMD5の値をペアで記述されたファイルを用意しておくと、一発で確認…

小ネタです。 Linuxなどで利用するmd5sumをmacOSで利用するには別途インストールする必要があります。 結論から言うと以下で一発です。 $ brew install md5sha1sum 今回はv0.9.5が入りました。 $ md5sum --version Microbrew md5sum/sha1sum/ripemd160sum 0.…

小ネタです。 シェルスクリプトを書いている際にwgetで正常にファイルをダウンロードできた場合のみ処理を継続したい場合には次のようなコードを書きます。 #!/bin/bash wget 'https://example.com/foo.zip' if [ $? -ne 0 ]; then echo "[ERROR] 正常にダウ…

Node.jsでは、ファイルにデータを書き込む様々な方法が用意されています。今回はよく使われる方法についてまとめてみます。

Node.jsでは、ファイルからデータを読み込むだけでも様々なアプローチが用意されています。 今回はよく使われる方法についてまとめてみます。

JavaScriptで乱数を利用したい場合はMath.random()を使うことがほとんどだと思いますが、内部のロジック的に暗号などセキュアな用途には向いていないとされています。Node.jsでは標準モジュールであるcryptoを利用することでこの問題を解決することができま…

最近のGitHubでは、リポジトリ上で依存している外部のライブラリやモジュールが古いままだと警告を出してくれる機能が追加されました。Webページ上でも表示されますし、git pushなどremoteと通信した際などにも確認できます。 $ git push Total 0 (delta 0),…