Zenn
🗑️

ゴミ収集カレンダーのリダイレクタを作ったが必要なかった話

に公開
ゴミ
tech

モチベーション

社会人になって一人暮らしを始めたので自治体が変わった。
新しい自治体は資源物系の回収品目が週ごとに違うのでゴミ収集カレンダーを見ないとわからない。
Webでゴミ収集カレンダーを提供しているが、ページ構成が以下の形式でめんどくさい。
example.com/{地区番号}/{西暦}/{月}
めんどくさいポイント

  1. 該当のページをブックマークすると毎月ブックマークしなおさないといけない
  2. TOPページからアクセスすると毎回地区を選択しないといけない

あるべき姿

一度ブックマークすれば、自動的に該当の地区の該当の年月のカレンダーが表示される

解決策

自分のWebサーバを使って日付によってリダイレクトさせる

実装

サーバでリダイレクトさせてもよいが、めんどくさいのでjsで処理することにした。
あと、一応技術的な理由もあってCloudflareでドメインを管理していると静的ファイルをCloudflareのCDNでホスティングしてくれるっぽくて処理速度が速いのでは？と思ったから。実際、速度に寄与しているのかはわからない。

コードの綺麗さは適当だが、プロダクトとしてのこだわりポイントは一応ある。

  • アクセス時刻に応じて当日の月を表示するか翌日の月を表示するか変えた（月末にありがたい）
  • 対象の日付が土日の場合は翌月曜日のカレンダーを表示する（月末にありがたい）
コード
<!DOCTYPE html>
<html lang="ja">
<head>
    <meta charset="UTF-8">
    <title>ゴミ収集日リダイレクタ</title>
    <link rel="apple-touch-icon" href="https://example.com/favicon.ico">
</head>
<script>
    const baseUrl = new URL("https://example.com/{地区番号}/");
    const now = new Date();
    // 今日のURLにリダイレクトするか、翌日以降のURLにリダイレクトするかを決定する
    const hour = now.getHours();
    const isToday = hour < 10;
    
    // 曜日を取得
    const dayOfWeek = now.getDay();
    const isWeekend = (dayOfWeek === 0 || dayOfWeek === 6); // 日曜日または土曜日
    let queryDate = new Date(now);
    if (isToday && !isWeekend) {

    } else {
        if (isWeekend) {
            // 土曜日または日曜日の場合、月曜日のURLにリダイレクト
            queryDate = getNextMondayParam(now)
        } else {
            // 翌日以降のURLにリダイレクト
            queryDate.setDate(now.getDate() + 1);
            if (queryDate.getDay() === 0 || queryDate.getDay() === 6) {
                // 日曜日または土曜日の場合、月曜日のURLにリダイレクト
                queryDate = getNextMondayParam(queryDate);
            }
        }
    }
    queryDateParam = queryDate.getFullYear() + "/" + (queryDate.getMonth() + 1);
    const redirectUrl = new URL(queryDateParam, baseUrl);
    window.location.href = redirectUrl;
    

    function getNextMondayParam(nowDate) {
        const nextMonday = new Date(nowDate);
        const nowDay = nowDate.getDay();
        let appendDay = 0;
        if (nowDay === 0) {
            // 日曜日の場合、次の月曜日は1日後
            appendDay = 1;
        } else if (nowDay === 6) {
            // 土曜日の場合、次の月曜日は2日後
            appendDay = 2;
        } else{
            // エラー
            alert("エラー: 土曜日または日曜日以外の曜日です。");
            return;
        }
        nextMonday.setDate(nowDate.getDate() + appendDay);
        return nextMonday;
    }

</script>
<body>
</body>

おまけというか本質情報１

というのを実装したけど、3月末にポストにゴミ収集カレンダーが投かんされていた。
なんでもデジタルで解決しようとする思考はよくないなと気づいた。

おまけというか本質情報２

賢明な読者ならお気づきかもしれないが、この記事を書いているときに以下のURLにアクセスすると今月のカレンダーが表示された。もしかしてこのページをブックマークすればいいのか。。？
example.com/{地区番号}

おまけ

zennに投稿するためにソースコードを探していたら見つからなくてアレ？と思ったらgomiというフォルダに入っていた。そうか、、ゴミだもんな。

教訓

解決策は一つではないので頭を柔らかくすることが大切

こうしてまたデジタルゴミを作ってしまった。

Discussion