株式会社ニーモニック

[株式会社ニーモニック @mnemoniccojp]

ちなみに末尾に「+00:00」は付かないが、省略可能なので問題ないらしい。実際、問題なく JST に変換されて表示された。

[株式会社ニーモニック @mnemoniccojp]

ではどうすればいいかというと、func.timezone('UTC', HogeModel.updated_at).label('updated_at') ではなく、普通に HogeModel.updated_at と書けばいいらしい。ラップを外すことで同値は tzinfo 付きの datetime が返り、Pydantic が UTC を Z 付きで JSON 化する、と。

[株式会社ニーモニック @mnemoniccojp]

AI いわく、modified_at は DateTime(timezone=True) なので、PostgreSQL 上では timestamp with time zone らしい。それを timezone(zone, ts) にすると timestamp without time zone になってしまう。つまり、オフセットを捨ててしまうのだそう。

[株式会社ニーモニック @mnemoniccojp]

そしてその値を SELECT する際には func.timezone('UTC', HogeModel.updated_at).label('updated_at') と指定している……のだが、どうやらこの処理が良くないらしい。というか、AI に訊いてみて判明したわけだが。

[株式会社ニーモニック @mnemoniccojp]

バックエンドは FastAPI で DB は SQLAlchemy2 で PostgreSQL。更新日である modified_at は以下のように指定している。

mapped_column(DateTime(timezone=True), default=lambda: https://t.co/cR7x3tZkb7(timezone.utc), onupdate=lambda: https://t.co/cR7x3tZkb7(timezone.utc))

[株式会社ニーモニック @mnemoniccojp]

まずは API のレスポンスを確認したところ、あれっ、文字列の末尾に「Z+00:00」が付いていないじゃないか。試しにレスポンスとして出力する前に最終更新日の値をチェックしてみると、どうもこの時点でタイムゾーンが付いていないっぽいことが分かった。

[株式会社ニーモニック @mnemoniccojp]

API のレスポンスはタイムゾーン付きの文字列にし、フロントでは Angular の date パイプで自動的にブラウザの標準ロケール（本件では JST）に変換してくれる……はずなのだが、変換されずそのまま表示されているっぽい。

[株式会社ニーモニック @mnemoniccojp]

とあるプロジェクトで、フロントに表示させている最終更新日が UTC のままになっていることに気づいた。「UTC のまま」と書いたのには理由があり、DB 上で Date 型のカラムはあえて UTC で扱っている。

[株式会社ニーモニック @mnemoniccojp]

他にも既存行が存在する場合に備えて、デフォルトの値で NOT NULL のカラムを追加したり、downgrade() 関数のほうにも ENUM 型を DROP する処理を追加したりと手数は少なくないのだが、ひとまず割愛。alembic upgrade head も無事成功した。

[株式会社ニーモニック @mnemoniccojp]

マイグレーションファイルの upgrade() 関数の冒頭に以下を追記。ちなみに updatestatus というのはモデルに追加した ENUM 型の名前ね。

update_status_enum = postgresql.ENUM('scraped', 'imported', name='updatestatus')
update_status_enum.create(op.get_bind(), checkfirst=True)

[株式会社ニーモニック @mnemoniccojp]

モデルに追加したのは status というカラムで、PostgreSQL の ENUM 型。件のマイグレーションファイル（/migrations/versions/ にある）を確認してみて分かったのだが、CREATE TYPE に相当するコードが記されていない。確か前回もこのファイルを直接編集した気がするけど、どうやったんだっけ？

[株式会社ニーモニック @mnemoniccojp]

確か 1 カ月ぐらい前にも同じ事案で躓いた記憶があるが、今日もまた躓いたので備忘として書いておく。Alembic で自動生成したマイグレーションを実行しようとして失敗。新しく追加しようとしたカラムの「型」が存在しないとのこと。

[株式会社ニーモニック @mnemoniccojp]

……と、ここまで書いておいてなんだが、単純に window.location.reload() で済んだ気もする。

[株式会社ニーモニック @mnemoniccojp]

結論から言うと、router.url で取得した URL 文字列を router.parseUrl() を使ってパース。つまり、

const parsed = this.router.parseUrl(this.router.url);
const path = parsed.root.children['primary'].segments.join('/');
const queryParams = parsed.queryParams;

といった感じ。

[株式会社ニーモニック @mnemoniccojp]

クエリ文字列を含む URL ではなく、パス部分とクエリ文字列部分を分けて取得し、this.router.navigate([path], { queryParams }) とするのが正解っぽいのだが、取得のほうがすんなりとはいかず、結構時間を要してしまった。

[株式会社ニーモニック @mnemoniccojp]

しばらくはこの方法で問題なく使えていたのだが、先ほど特定のページでログアウトしたところ、ページの表示がおかしくなる一件があった。原因は currentUrl にクエリ文字列が含まれていたからで、ブラウザの URL 欄が ? や = がエンコードされた状態になっていた。

[株式会社ニーモニック @mnemoniccojp]

読み解くに、router.navigateByUrl() でルート（/）に画面遷移させてから、元のページ（currentUrl）に戻すという妙な処理だが、おそらく通常のルーティングでは初期化されない値がいくつも存在していて都合が悪かったのだろう。

[株式会社ニーモニック @mnemoniccojp]

Angular 21 で構築したプロジェクトの、ログアウト処理にこんな記述があった（というか書いたのは私自身だが）。

this.router.navigateByUrl('/', { skipLocationChange: true }).then(() => {
　this.router.navigate([currentUrl]);
});

[株式会社ニーモニック @mnemoniccojp]

インポートソースの「ファイル」に、先ほどコピーした URI を貼り付け、先頭の gs:// 部分を削除する。これでインポートが可能になるが、次の画面で「インポートに失敗しました」と表示される場合は途中の何かが間違っているので、今一度確認すること。

[株式会社ニーモニック @mnemoniccojp]

gsutil URI という欄に gs:// から始まる URI が記されているのでこれをクリップボードにコピーする。そしてコピー先のプロジェクトに切り替え、Datastore の「インポート / エクスポート」のページにて「インポート」を実行。