GitHubPages を活用して長い URL を短縮する

Last updated at 2024-11-21Posted at 2024-11-21

今回は GoogleDrive のリンクなど
長い URL を短くする試みをしようと思います。

URL 短縮サイトは
・サイト側に悪意があった場合に
　勝手に遷移先を差し替えられる可能性がある
・ハッキングで
　勝手に遷移先を差し替えられる可能性がある
といったリスクがありますので
今回の手法で短縮する事を思いつきました。

今回は GitHubPages でその仕組みを作成します。

例えば uni928 という
GitHub アカウントを取得して
Sephiroth というサイト名ならば

短縮を目的にしている割には
URL が長いと感じるかもしれませんが
URL 短縮サイトのリスクを考慮すると
妥協する価値はあると思っています。

手順 1 GitHub のアカウントを取得する

まずは GitHub のアカウントを取得します。
ユーザー名は

https://ユーザー名.github.io/サイト名
のユーザー名部分になるため
URL に使用しても違和感のない
ユーザー名を登録して下さい。

手順 2 プロジェクトを新規作成する

次にプロジェクトを新規作成します。

New を押して

Repository name を設定して
Create repository をクリックします。

Repository name は

https://ユーザー名.github.io/サイト名
のサイト名部分に当たるため
URL に使用しても違和感のない
Repository name を使用して下さい。

手順 3 README.txt を作成する

次に README.txt を作成します。

出現した画面で README の部分を
クリックして下さい。

その後出現した画面は
Commit changes... を選択して下さい。

ダイアログが出現したら
再度 Commit changes... を選択して下さい。

html を作成する

次に遷移するための
html ファイルを作成します。

Add file を選択して
Create new file を選択して下さい。

するとファイル作成画面に入りますので

Name your file... に
index.html と入力して

Enter file contents here に

入力する内容

<script>
  window.location.href = 'https://www.google.co.jp/';
</script>

と入力して下さい。

https://www.google.co.jp/
部分は実際の遷移先を入力して下さい。

その後 Commit changes...
を選択して、出現したダイアログでも
Commit changes を選択して下さい。

Settings を設定する

最後に Settings を設定します。

Settings を開いて

Pages を開いて
Branch の None を main に変更して
Save を押します。

反映に時間がかかるため
10 分程その画面で放置してから
画面を更新する事で

Your site is live at https://uni928.github.io/URLShortTest/
といった文字が出現します。

この文字が出たら作業は完了です。
URL を開くと自動で
遷移先に遷移する事が確認できます。