Webブラウザとサーバー間で常時、または一定間隔で通信を行っている場合、ユーザーが端末の前から長時間離れた際などに通信を停止したい場合があります。最新の情報をサーバからもらってきても使う人がいなければムダですからね。
サーバ負荷的な面で実装するケースが多い印象ですが、スマホアプリの「クラッシュ・オブ・クラン」では無操作状態が続くと強制的にアプリを再起動せよと表示されます。このゲームの場合はログイン状態のときは他プレイヤーが攻め込めないというルールがあるため、それを悪用されないためだと思われます。
というわけで、今回は何らかの事情で一定の時間ユーザーが何も操作を行わなかったかどうかをクライアント側(Webブラウザ)でかんたんに判定できる方法を試してみます。
続きを読む
気がつけば猫も杓子もDockerと言いますかコンテナな世界になってしまいましたねｗ
DockerイメージをAWSの各種サービスと連携させるためには「ECR」と呼ばれるレジストリサービスへ登録しておく必要があります。
今回はローカルでビルドしたDockerイメージをECRへ登録するまではまとめておきます。
AWS App Runnerが使いたかったのですが、GitHubとの連携で苦戦したためECRにDockerイメージを登録する方法を採用することにしたというのが経緯だったりします。
続きを読む
AWS S3を単なるストレージとして使う際には問題とならないのですが、S3をWebサーバとして使う場合はファイルのMIMEタイプ(Content-type)を正しく指定しておかないとWebブラウザからダウンロードを求められるなど意図した通り動いてくれないことがあります。
この指定方法はシンプルでS3.putObjectを実行する際のパラメーターとして渡すだけ。
const params = {
Bucket: 's3.example.com',
Key: 'foo.html',
Body: await fs.readFile('foo.html'),
ContentType: 'text/html'
}
await S3.putObject(params).promise()
このときに予めMIMEタイプがすべて判明していれば良いのですが、不特定多数の種類のファイルを扱うような場合にはファイル名から拡張子を取り出して判定して……といった処理が必要になります。難しくは無いけどゼロから書くのは正直めんどくさいｗ
そこで今回はNode.js版のAWS SDKを用いてこのMIMEタイプを自動で判定する方法をまとめます。
※ちなみにCLIから使う場合はawsコマンド（が内部で使っているPythonのライブラリ）が自動的に判定してくれています。
続きを読む
Gitでバイナリや巨大なファイルを扱う場合に活躍するのが「LFS(Large File Storage)」。
詳細な説明は様々なページで行われていますので、今回はGitHubの利用を前提とした基本的な使い方についてだけまとめておきます。
簡単に言うとLFSを利用するとファイルの実際のデータは専用のストレージに、リポジトリ内部には200byteにも満たないハッシュ値等を保存することでリポジトリを軽量化することができるという仕組みです。
Gitはバイナリファイルに更新がある度に全データがリポジトリに保管されるため油断しているとあっという間にリポジトリが肥大化してしまいます。またGitHubでは通常100Mbyte以上のファイルをpushすることができません。それに加えリポジトリのサイズは1G程度が推奨されていることから「LFS(Large File Storage)」が必要とされているというわけです。
AWS LambdaはRESTful APIの開発時だけではなく、特定のイベントをトリガーとして処理を行うことができます。今回はServerlessFrameworkを利用し、S3に新しくオブジェクトが追加された際に関数を起動するところまでをまとめます。
続きを読む
「Brotli」はGoogleが開発したファイルの圧縮形式で、主にWebサーバとの間の通信量を削減する目的で利用されています。gzipの後継的な位置づけで圧縮率もgzipより高くすでに主要なWebブラウザで対応済みのため今後徐々に置き換わっていくことが予想されます。
で、通常はWebサーバなどにモジュールを追加などして利用するわけですが、今回はmacOSのTerminal上で利用してみます。結論としては以下の通り。
圧縮 (file.txt.brが生成されます)
$ brotli file.txt
解凍 (file.txtが生成されます)
$ brotli -d file.txt.br
最近のHTMLはファイル選択画面でファイル形式をこちらで指定した物以外は選択不可にできます。例えば次のコードではJPEGとPNG画像だけが選択可能になります。
<form>
<input type="file" accept="image/jpeg,image/png">
</form>
PCでZipファイルをサーバへアップロードするサービスを作っていたのですが、このaccept属性によって制限を付けると特定の環境でZipファイルが指定できない現象が発生し困ったことに。久しぶりにブラウザでZipファイルを扱ったので混乱したのですが、そういえば環境によってZipのMIMEタイプが違うのでした。
というわけで割と最近のOSとブラウザ毎にZipファイルのMIMEがどのようになっているか調査します。
続きを読む
ゲーム会社さんからのご依頼で新しいプラットフォームの開発にご協力いただける方を大募集しております！
ご興味のある方がいらっしゃいましたら、ぜひご協力をいただけると大変助かります。
幅広く意見を頂戴することを目的としていますので、ゲーム開発を始めて間もない方や技術的に自信が無い方、ツクールでRPGを作られている方なども大歓迎です。個人の趣味レベルでOKですので現状大ヒットを飛ばしていなくてももちろん大丈夫ですｗ
今回ご協力いただいた方は今後も優先的にお声がけしますので未知の物に興味がある方もぜひ！（・∀・）
もしご興味がある方いらっしゃいましたら、以下のツイートにリプをいただくかDMなどでご連絡いただけると大変助かります！
【募集】個人でゲーム開発をされている方（新サービスのご意見募集）
ゲーム会社さんからのご依頼で新しいプラットフォームの開発にご協力いただける方を大募集しております！ご興味のある方がいらっしゃいましたら、ご協力をいただけると大変助かります！（つづく）— 勝部麻季人 💦👏 (@katsube) February 7, 2022
その他ご質問などがありましたらTwitterに返信などをいただければご回答いたします。
MySQLで外部キー制約を適用しているテーブルにはDROP TABLEができません。
本番ではその挙動でもちろん良いのですが、開発中にテーブルをまるごと作り直したいときにはこの制約が邪魔になることがあります。またmysqldumpなどで出力したファイルをインポートする際にも、テーブルを順番通りインポートする必要が出てきます（外部キー制約があるとインポートに時間もかかりますよね）。
そういったときにforeign_key_checksの値に「0」をセットすることで一時的に外部キー制約を無効にすることができます。
SET foreign_key_checks = 0;
再び有効にするには「1」を代入します。
SET foreign_key_checks = 1;
小ネタです。
踏み台サーバであるAmazon Linux2にMySQLのクライアントを入れRDSを操作しているのですが、ある日yum updateをしたら途中で停止してしまいました。
エラーメッセージを眺めるとMySQLをアップデートする際にGPGが原因でコケているっぽい。
$ sudo yum update
(中略)
warning: /var/cache/yum/x86_64/2/mysql57-community/packages/mysql-community-libs-5.7.37-1.el7.x86_64.rpm: Header V4 RSA/SHA256 Signature, key ID 3a79bd29: NOKEY
file:///etc/pki/rpm-gpg/RPM-GPG-KEY-mysql から鍵を取得中です。
The GPG keys listed for the "MySQL 5.7 Community Server" repository are already installed but they are not correct for this package.
Check that the correct key URLs are configured for this repository.
Failing package is: mysql-community-libs-5.7.37-1.el7.x86_64
GPG Keys are configured as: file:///etc/pki/rpm-gpg/RPM-GPG-KEY-mysql
RPMやyumではパッケージが改ざんされているか検証するためにGPGキーを利用していることがあるのですが、このGPGキーには有効期限が設定されている関係で一定期間が経つと検証が行えなくなりインストールが停止してしまいます。パッケージを作成する際にGPGキーを別の物に変更した場合も同様の現象になります。
続きを読む
前回に引き続きフォーム部品のまとめです。今回はプログラム側から値をセットしたり選択状態をコントロールするお話です。
前回のフォームに入力された値を取得したいという方は以下をどうぞ。
Webサービスを作る際に必ずと言ってよいほど利用するフォーム部品ですが、ユーザーに入力された値を取得する際にお恥ずかしながら自分でもたまにど忘れすることがあるのと、新旧の情報がごっちゃになっているため脳内の整理も兼ねてまとめておきます。
フォーム部品に値をセットしたり、選択状態をコントロールしたい場合は以下をどうぞ。
