2022年 の投稿一覧

[JavaScript] 操作を一定時間しないとタイムアウト扱いにする

Webブラウザとサーバー間で常時、または一定間隔で通信を行っている場合、ユーザーが端末の前から長時間離れた際などに通信を停止したい場合があります。最新の情報をサーバからもらってきても使う人がいなければムダですからね。

サーバ負荷的な面で実装するケースが多い印象ですが、スマホアプリの「クラッシュ・オブ・クラン」では無操作状態が続くと強制的にアプリを再起動せよと表示されます。このゲームの場合はログイン状態のときは他プレイヤーが攻め込めないというルールがあるため、それを悪用されないためだと思われます。

というわけで、今回は何らかの事情で一定の時間ユーザーが何も操作を行わなかったかどうかをクライアント側(Webブラウザ)でかんたんに判定できる方法を試してみます。
続きを読む

[AWS] ECRにDockerイメージをプッシュする

気がつけば猫も杓子もDockerと言いますかコンテナな世界になってしまいましたねw
DockerイメージをAWSの各種サービスと連携させるためには「ECR」と呼ばれるレジストリサービスへ登録しておく必要があります。

今回はローカルでビルドしたDockerイメージをECRへ登録するまではまとめておきます。

AWS App Runnerが使いたかったのですが、GitHubとの連携で苦戦したためECRにDockerイメージを登録する方法を採用することにしたというのが経緯だったりします。
続きを読む

[AWS] S3へMIMEタイプを自動判定しながらアップロードする – Node.js

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タイプがすべて判明していれば良いのですが、不特定多数の種類のファイルを扱うような場合にはファイル名から拡張子を取り出して判定して……といった処理が必要になります。難しくは無いけどゼロから書くのは正直めんどくさいw

そこで今回はNode.js版のAWS SDKを用いてこのMIMEタイプを自動で判定する方法をまとめます。

※ちなみにCLIから使う場合はawsコマンド(が内部で使っているPythonのライブラリ)が自動的に判定してくれています。
続きを読む

[GitHub] Git LFSで巨大なファイルを扱う

Gitでバイナリや巨大なファイルを扱う場合に活躍するのが「LFS(Large File Storage)」。
詳細な説明は様々なページで行われていますので、今回はGitHubの利用を前提とした基本的な使い方についてだけまとめておきます。

簡単に言うとLFSを利用するとファイルの実際のデータは専用のストレージに、リポジトリ内部には200byteにも満たないハッシュ値等を保存することでリポジトリを軽量化することができるという仕組みです。

Gitはバイナリファイルに更新がある度に全データがリポジトリに保管されるため油断しているとあっという間にリポジトリが肥大化してしまいます。またGitHubでは通常100Mbyte以上のファイルをpushすることができません。それに加えリポジトリのサイズは1G程度が推奨されていることから「LFS(Large File Storage)」が必要とされているというわけです。

続きを読む

[macOS] Brotli形式で圧縮・解凍する

Brotli」はGoogleが開発したファイルの圧縮形式で、主にWebサーバとの間の通信量を削減する目的で利用されています。gzipの後継的な位置づけで圧縮率もgzipより高くすでに主要なWebブラウザで対応済みのため今後徐々に置き換わっていくことが予想されます。

で、通常はWebサーバなどにモジュールを追加などして利用するわけですが、今回はmacOSのTerminal上で利用してみます。結論としては以下の通り。

圧縮 (file.txt.brが生成されます)

$ brotli file.txt

解凍 (file.txtが生成されます)

$ brotli -d file.txt.br

続きを読む

[HTML5] ZipファイルのMIMEタイプがOSによって異なる件

最近のHTMLはファイル選択画面でファイル形式をこちらで指定した物以外は選択不可にできます。例えば次のコードではJPEGとPNG画像だけが選択可能になります。

<form>
  <input type="file" accept="image/jpeg,image/png">
</form>

PCでZipファイルをサーバへアップロードするサービスを作っていたのですが、このaccept属性によって制限を付けると特定の環境でZipファイルが指定できない現象が発生し困ったことに。久しぶりにブラウザでZipファイルを扱ったので混乱したのですが、そういえば環境によってZipのMIMEタイプが違うのでした。

というわけで割と最近のOSとブラウザ毎にZipファイルのMIMEがどのようになっているか調査します。
続きを読む

【募集中】個人でゲーム開発をされている方(新サービスのご意見募集)

ゲーム会社さんからのご依頼で新しいプラットフォームの開発にご協力いただける方を大募集しております!

ご興味のある方がいらっしゃいましたら、ぜひご協力をいただけると大変助かります。

対象者
個人でゲーム開発を行われており、Webブラウザ上で動作する物を作成できる方
※学生の方や趣味で行われていらっしゃる方も大歓迎です
※作成方法は問いません(UnityやUE4、RPGツクールなどのツールから出力するのもOKです)
お願いしたいこと
現在α版のサービスを実際にご利用いただき感想やご意見をお聞かせください。
謝礼
薄謝あり
※Amazonギフト券5000円分を予定
募集人数
最大で10名程度を予定しております
その他
・詳細はご応募いただいた方へご説明いたします。
・ご説明後にご辞退いただいても問題ございません。
・何らかの費用負担や金銭のお支払を求めることはございません。

幅広く意見を頂戴することを目的としていますので、ゲーム開発を始めて間もない方や技術的に自信が無い方、ツクールでRPGを作られている方なども大歓迎です。個人の趣味レベルでOKですので現状大ヒットを飛ばしていなくてももちろん大丈夫ですw

今回ご協力いただいた方は今後も優先的にお声がけしますので未知の物に興味がある方もぜひ!(・∀・)
もしご興味がある方いらっしゃいましたら、以下のツイートにリプをいただくかDMなどでご連絡いただけると大変助かります!

よくあるご質問

怪しい会社ではありませんか?
日本国内で有名な一部上場企業のグループ会社です。ご説明をさせていただく際に企業名をお伝えいたします。その後ご辞退いただいても問題ございません。
具体的にどういったことをするのでしょうか?
Web上で動作すゲームをアップロードいただきつつ、サービスの各機能をご利用ください。その際感じられた率直なご意見をお聞かせください。
Web上で動くゲームを作ったことがないですが大丈夫ですか?
これから挑戦される場合でももちろんOKです。
今回は幅広いご意見をいただくことを目的としておりますので、初心者の方も大歓迎です。例えばUnityなどを利用されている場合はWebGLでのビルドをご利用ください。
ゲームは新作の必要がありますか?
今回の目的はあくまでご意見をお伺いすることですので、どういった作品であっても問題ございません。過去に作成されたものや、権利的に問題が無ければゲーム開発ツールのチュートリアル用の教材などでもOKです。

その他ご質問などがありましたらTwitterに返信などをいただければご回答いたします。

[MySQL] 外部キー制約を一時的に無効にする

MySQLで外部キー制約を適用しているテーブルにはDROP TABLEができません。

本番ではその挙動でもちろん良いのですが、開発中にテーブルをまるごと作り直したいときにはこの制約が邪魔になることがあります。またmysqldumpなどで出力したファイルをインポートする際にも、テーブルを順番通りインポートする必要が出てきます(外部キー制約があるとインポートに時間もかかりますよね)。

そういったときにforeign_key_checksの値に「0」をセットすることで一時的に外部キー制約を無効にすることができます。

SET foreign_key_checks = 0;

再び有効にするには「1」を代入します。

SET foreign_key_checks = 1;

続きを読む

[MySQL] アップデート時にGPGキーのエラーで停止してしまう場合

小ネタです。
踏み台サーバである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キーを別の物に変更した場合も同様の現象になります。
続きを読む

[JavaScript] フォーム部品に値をセットする(まとめ)

前回に引き続きフォーム部品のまとめです。今回はプログラム側から値をセットしたり選択状態をコントロールするお話です。

前回のフォームに入力された値を取得したいという方は以下をどうぞ。


続きを読む

[JavaScript] フォーム部品の入力値を取得する(まとめ)

Webサービスを作る際に必ずと言ってよいほど利用するフォーム部品ですが、ユーザーに入力された値を取得する際にお恥ずかしながら自分でもたまにど忘れすることがあるのと、新旧の情報がごっちゃになっているため脳内の整理も兼ねてまとめておきます。

フォーム部品に値をセットしたり、選択状態をコントロールしたい場合は以下をどうぞ。

続きを読む