🦁

VectorホームページサービスからAzure Static Web Appsへ移行した話②

2024/12/03に公開

Vector ホームページサービスは2024/12/20で終了

2000年くらいから利用してきたVectorホームページサービスは2024年12月20日を持って終了となります。およそ24年にわたり利用してきたサービスですがとうとうなくなります。
というわけで移行先または消滅ということを検討しなければなりません。

https://zenn.dev/tomokusaba/articles/df0b5c856f9ddd

構築

というわけで構築編です。

GitHubにPushせよ!

2000年頃から管理してきたホームページサービス故にアップロード手段と言えばFTPでした。
故に、FTPのデファクトスタンダードツールであるFFFTPでアップロードという手段をとっていました。
しかしながら、Azure Static Web Appsを使用するためにはFTPでアップロードという手段は使えません。GitHubまたはAzure DevOpsでリポジトリ管理してpushするとGitHubの場合はGitHub Actionsでデプロイされる仕組みです。
なので、何はともあれGitHubにPushします。
これまでフォルダー管理してきたものを何も考えずにそのままPushです。

使用ツールはGitHub Desktop
https://github.com/apps/desktop

Visual StudioのGitツールに慣れ親しんだ軟弱GitHub使いにはもってこいのGUIツールです。

Azure Static Web Appsのリソースをつくる!

おもむろにリソースの作成

Webのタブから静的Webアプリのところで作成

必要な項目を入力していきます。
サブスクリプション・リソースグループのあたりはAzureを使用している方なら説明不要かと思います。

今回、Azure Static Web Appsに特有なところとしてデプロイしたいHPがあるリポジトリを指定しなければいけません。
そして、フレームワークはないのでビルドのプリセットはCustomでOKです。

ここまで来たら今回はFunctionはないので作成してOKです。

ここまでで既定のドメインで表示できました。

カスタムドメインの設定

カスタムドメインの設定は過去記事を参照してください。
https://zenn.dev/tomokusaba/articles/52092b643f1664

Vectorサイトからリダイレクトの設定

最後に、元のVectorホームページサービス側のindex.htmlを書きかえmetaタグでリダイレクトの設定をします。

<meta http-equiv="refresh" content="5;url=https://転送先">

上記のタグをヘッダーに入れてあとは転送する旨、わかりやすいところに記述すればよいでしょう。

結果、新しいURLで閲覧が可能になりました。

Discussion