2024-07-07 13:48:29 #このサイト

七夕

今日は七夕。空気の澄んだところで満天の天の川を見ながらゆっくりしたいなあ、と思ったりはするものの、実際にやろうと思うと、場所を調べて、天候を調べて、宿を予約して、移動して、と苦労して着いてから、虫がいたり、道に迷ったり、いい場所なら人が多かったり、天気が悪かったり、そして結局目が悪いんでよく見えないｗ、と色々大変なんで実行しない。

そうだ！我々にはUnityがあるじゃないか！

ということで（どゆこと？）、ようやくこのサイトもWebGLコンテンツを設える所まで到達できました。ﾜｰﾜｰﾔﾝﾔﾔﾝﾔ
テストとして「どこか空気のいいところで天の川をゆっくりと楽しむ」というコンテンツを作成しましたので公開です。ﾄﾞﾝﾄﾞﾝﾊﾟﾌﾊﾟﾌ

Milkerway2024（89MB）

天空のサイズがデカいので結構サイズがデカいですが、動画な昨今は大丈夫かなと。
画面が暗いのでモバイルは機種によっては部屋を暗くしないと見えないかもです。
特に何も仕掛けてないので気楽にお楽しみください。
PC、モバイル（スマホ、タブレット）対応で、いずれも上記リンクからブラウザ上で動きます（多分。Brave（Chrome）でチェック済み）。操作がそれぞれでちょっと勝手が違います。マニュアル読む派の人は以下をお読みください。

PC

キーボードのWASDキーで移動。マウスで見る方向と進む方向が変わります。ウィンドウ内を1回マウスクリックすると音（環境音）が出ます。
ウィンドウ表示してる場合は、ウィンドウからマウスカーソルが外れると向きが変わらなくなりますので、「マウスポインタ非表示」ボタンを押して、ボタンが消えたら再度ウィンドウ内をクリックすると、マウスカーソルが消えて向きを自由に変えられるようになります。ESCキーを押すとマウスカーソルが表示され、再度ESCキーを押すとボタンが表示されます。

ボタンを押した後再度クリックするのが面倒くさいんですが、昨今のブラウザのセキュリティ要件の様です。詐欺バナーとかあったりする弊害です。

右上のボタンを押して再度ウィンドウ内をクリックすると、全画面表示になります。ESCキーで解除します。

モバイル（スマホ、タブレット）

画面タップで音が鳴ります。
画面上の白い丸は、左が移動用のジョイスティック、右が見る方向と進む方向が変わります。
右上のボタンをタッチ、再度画面をタッチすると全画面表示、再度を押すと解除します。

全画面表示は画面が横向きの方が見やすく操作しやすいでしょう。

先ずは画面を横表示にして（やり方は機種によって違うので割愛）、右上に小さくなってるボタンをタッチして、再度画面をタッチすると全画面表示します。再度を押すと解除します。
＊iPhone（safari）は横にするだけで全画面になるようなのでこの辺の操作は不要で全画面ボタンも機能しないようです。

2024-07-02 16:09:16 #このサイト

アクセスログの絞り込み機能

あー、もう今年も半分過ぎたか。

ちょっとUnityで観覧車回してて（前にHinge Jointで回してみたらゴンドラがびょんびょんして回らんかったけどコライダーをいい感じにしたら回った話はまたいずれ）Laravelイジれて無かったが、アクセスログ見たら月別の欄が（まだ入れて2週間経ってないのに）やたら件数あって「なんや？」と調査したら、ソート項目間違えてた。間違えてたのはええけど（よくない）クエリ的には整合してて、なんでそうなんのかが意味分からん。
まあそれは行き詰まったんで未来の自分に任せて、ついでに懸念のアクセスログ絞り込み機能を実装した。

ページとかIPアドレスとかを絞り込み対象にすることで、どこの誰がどういうアクセスしてるのか、主に悪さする系の動向を炙り出す用。
集計の各項目にフォームをセットして、クエリ条件に追加したら完成。
ググってワードプレスの不正アクセスファイル10選 ってサイトに載ってる「/wp-content/plugins/core-plugin/include.php」がログにあった😫んで試しに絞ってみると、誰（IP、ユーザエージェント）がいつのアクセスでやったんかが分かりやすい。

これで何を見てるんかの傾向出して、Denyリストとか作って該当の悪い子をアクセスログ処理んとこで無限牢獄に入れるなり自動通報するなりして、「僕の作った最強の防衛システム」みたいにする（かもしないかも）。まあそっち方面は最近すっかり疎いんで、またちょっと色々調べてからやなあ。

2024-06-26 20:15:06 #Laravel

アクセスログ

先週、昔作ったサイトを色々見てて、アクセスログページを見つけた。

WordPressにした頃かその前やったか、世の中がGoogle Analyticsばっかになって、どんなもんやろかと使ってみるまでは、その都度で自作してた。
そのうちGoogle Analiticsは色々要らん情報まで取られるようになって、EUの法規制が厳しくなり始めた頃に自作のサイトから排除した。

その後特に必要ないまま、自作することもなかったが、今回サイトを新しくしてからお問い合わせにスパムがそこそこ来るｗ。レンサバの管理画面でアクセスログをチェックしよかと見たら、集計画面が無くなって、ログテキストのダウンロード（しかも日別）だけになってた。おいー。
うーん、取りあえず動向チェックして自動でスパム振り分け機能とか入れたいなあ、と思いつつ、そこまでモチベが無く進んでなかった。

という経緯があって、あーこれでええか、と実装決定。

見つけたアクセスログは2005年頃に書いたやつで、当時は当然スクラッチで、対象ページでaccess_log()とかいちいち書いてた。Laravelならファサードか、と思ったが、ルーティングあるし一括でフックする方法があるやろと調べたら、Middlewareとやらでやるらしい。
処理したいクラスを書いたらapp/Http/Kernel.phpの$middlewareに追加するか、名前を付けてルートで指定するだけ。おー、分かりやすい。

前のテーブルそのまんまでマイグレーション書いて、Middleware書いて、常に記録するんでKernel.phpの$middlewareに追加したら動いた！お手軽！
Laravelて、IPとかuser agent（header）とかも$requestに入ってんのなあ。

そうしてアクセスログの集計ページも、前に使ってたクエリそのまんまをクエリビルダに書き換えて作成。
fromをサブクエリで書く方法がクエリビルダのマニュアルに見つからず「あれ？無いんか？」と思ったら、ググったらLaravelのソース調べて見つけたって記事があった。助かる。

前の集計グラフは太古の技術で1ピクセル画像を広げてたりして、全てが前世代HTML＋CSSやったんで、当然の全書き換え。bootstrapでどう並べるんや？と手間取りながら何とかまとめる。

動作確認してたら自分のアクセス毎にカウントアップするのがやっぱ気になる。
元のはログにユーザIDを入れて集計時に除外してたけど、Middlewareの処理でログイン情報取得出来んかったんで放置してたんやった。
改めて調べると、$next()でそのページの処理をやってて、$next()の前で事前処理するか、後で事後処理するかということ。なら事後処理ならログイン情報も取れてるか？と改修したら取れてた。

そうしてアクセスログが設置完了。テストして本番適用。

なんか毎日結構な量のハックなアクセスあんなあ。(；´Д｀)
あんま変なとこばっか覗いてたら痛い目に遭わせたくなるやでｗ。

2024-06-24 13:13:24 #Laravel

LaravelでWebサイトを作ろう2

＊このサイトの開発記録です。

テンプレートのトップにあるキャラクタを変更。
そういやAffinityにしてからイラスト的なの描いたこと無かったなあ。まあ元絵がプリミティブな図形の組み合わせっぽいんで、それに合わせて簡単に描く。

元絵の雰囲気が出んなあｗ。まあいいや。

さていよいよCMS機能の実装。認証処理のlaravel/uiと合わせたCRUDをチュートリアルで再確認（後にlaravel/uiはLarave 6時代の遺物と知って、Breezeを使う事になる。実装周りがコンパチブルでよかった）。チュートリアルって書いてるまんまをトレースするだけなんで、何回やってもあんま頭に残らんのよなあ。

とりあえず実装予定の「お知らせ」「ポートフォリオ」「お問い合わせ」のデータベースの各テーブルを設計。といってもお知らせはテキスト1行、ポートフォリオはタイトルとアイコン画像と説明文、お問い合わせはタイトルとメールアドレスと本文と返信文と、今のところリレーションも無くシンプル構成。これにID、登録日時、更新日時、公開フラグを付けてとりま完成。

artisanコマンドでマイグレーションを作成して、テーブル設定を書いてマイグレート。グループ開発はこれが非常に便利やが、個人ではただ面倒くさいだけやなｗ。まあスキル習得目的もあるんできっちりやろう。

Laravelのセキュリティ面の運用周りをまだよく把握してないんで、サーバはartisanコマンド周辺は入れてない。なのでマイグレートできないんで、ローカルDBからのクエリダンプで作成。
後にマイグレートに--pretendオプションを付けることでクエリ吐き出しが出来ると知ってからは、先ずはオプションの実行でクエリ取得するフローにした。

当初は管理画面は別ページで作ろうと考えてたが、ログイン周りは色々と制御しやすそうなのと、コスパが良さ気で面白そうという理由で、今回は公開ページそのまんまで、ログイン時に管理画面化する事にした。
デザインやレイアウトの変更時の面倒くささもあるんで、将来的には別画面にするかもしれない。

さて、先ずはテンプレートにどっかとあるメールフォームの実装。フォームの入力を受け取って、バリデーション、DB登録、メール送信。メールは自分への通知メールと、併せてメールアドレスの入力があった場合に「お問い合わせを受け付けました」メールを送信しようと思ってたが、今時は何に使われるか分からんので、自分への通知メールだけにした。

メール送信のLaravel的実装作法も知れればと、当時試してたwrtn.jpで「Laravelでのメール送信方法を解説して」と聞いて、回答に倣ってメールサーバの設定とコードの実装。
まあAIなんで、メールサーバ設定周りの細々したとこやテンプレートの書き方、メール送信の取り回し等々の微妙にあちこち間違えてたり足らんかったりで、それら細々を調べて補完しながらなんとか設える。この頃はまだLaravel理解の理解度が低くていちいちが面倒くさい。
どーやってもメールサーバにつながらんかったのが、キャッシュクリアしたらすんなりつながったりしながら実装完了。

面倒くさそうなメール実装を抜けたんで、いよいよ各コンテンツのCRUD実装。
ここまでLaravelはBladeとBootstrapが標準、と思ってたが、Laravel 8でBootstrapからTailwindに変更されてる事を知る。まあそれでもBootstrapはまだスタンダードっぽいし、何より今回使ったテンプレートがCDNでBootstrapを使ってるんで、今後もBootstrapの使用で続行。
BladeとBootstrapを調べながら、各コンテンツの組み付けを進める。

bladeまとめのメモ

この頃Laravel自体についても色々調べてて、2017年辺りでPHP FWのトレンドがCakePHPからLaravelに移った事を知った。VR始めたタイミングに入れ替わりしてたとかなあ。(；´Д｀)
そしてここまではサイトに残ってたLaravel 6を使ってたが、（当時の）現状はバージョン10と知った。おぉ。これはせめて8にはしとかなあかんやろと、新たにLaravel 8をセットアップ。そしてBreezeを導入。ここまで作ったテンプレートやメール送信周りを移植。

そして今回の目的のひとつ、サイト更新にGit導入。
使ってるレンタルサーバはだいぶ前にGitレディになってたが、WordPressにしたり、他の自作Webアプリも長く放置状態で、設定も面倒くさいし特に必要性が無いままで使ってなかった。
今回は、今後の色々な拡張性も考えて、テストサイトと本番サイトの運用と、サイトにGit pullを組み込んでの、開発環境（エディタ内Git操作）とブラウザでのGit pullで、サイト更新を完結しよう、という目論見。

今まで作ったサイトもローカルでは既にGitで管理してて、たんびたんびで機能拡張や改修をしてきてたが、サイト更新はSSHだったんで、時間が開くほど更新確認が面倒になってｗ、結果ローカル環境はどんどんバージョンが進んでるが、サーバ上は昔のまんま、という状況がここ数年続いて、差分がエグいことになってたりしたｗ。

せっかくの今回のサイトリニューアルも、サーバ側Gitを導入しとかんと面倒くさいサイトがまたひとつ増えるだけになりかねないという懸念ｗ。しかし設計から設定、設置まで全部自分でやらんとならんのでイニシャルが面倒くさ過ぎんよなあｗ。
そして面倒の甲斐あって、サーバ側Git設置の効果は非常に成功。機能拡張や改修から更新が実にスムースで、Gitの便利さを再認識した。

実は最初の更新で、ローカルMAMPはPHP8がやったが、サーバはPHP7.6やったという事実を認識。(；´Д｀)
サーバに上げてもエラーで動かずで「なんでや？」ってなった。ガチガチのバージョン縛りなんやなあ。artisan周りを入れてなかったんで、そこら辺かと思ったりして原因究明を手間取らせた。(；´Д｀)
そしてローカルLaravelをPHP7.6ベースにしてインストールし直して、ここまでの機能を移植。サーバ側も8にした時用にブランチを残しつつ、新たに7.6用にブランチ切り直すというちょーめんどくさい行程が入った。ホンマ勘弁。(；´Д｀)
何がめんどいって、ローカル環境でパス無しで実行するPHPがMAMPで無いバージョン8なんで、artisanとか実行する時はMAMPまでのパス付きのPHPを実行せんならんという。ホンマ面倒くさい。

2024-05-30 14:18:53 #Unity

シーンやオブジェクトにメモ

WebGLでコース周回をランキングするゲームでも作ろうかと考えながら久々にUnityのプロジェクトを開いた。時間が空くと何が何やら分からんなあｗ。シーンやオブジェクトに簡単にメモ書きしたいなあと毎回思ってんなあと思いながら、そういや前にそんなAsset使ってたなあとAssetStoreを探して、ふと、いちいちAsset入れんでも「comment」とかスクリプト作ってStringをSerializeしたらええんちゃうんか？と思い付いた。でもコンポーネントも書かんとInspectorのフィールドサイズてSerialiseで変えれんやろか？と調べたらいけた。

[SerializeField, Multiline([表示行数])] private string textfield;
[SerializeField, TextArea([最初表示行数], [最大表示行数])] private string textArea;

Multilineは左に項目名入るしスクロールせんからあかんな。TextAreaはバッチグー。
まあそもで日本語入力はちょっとバグってるからあれやがｗ、目的には十分。
シーンのコメントはCommentとか空のオブジェクト作ってアタッチ、オブジェクトはそのまんまアタッチして、コメント書いたらオッケー。
何ならOnSceneGUI()でメモのtext ui生成したらシーンでも確認できるやろけどそれは今回は過剰に逸脱するんで気が向いたら案件。

そしてこれはようやくで初のObsidianの開発メモからの丸まんまのコピペ。