趣味のNote

Vercelの変更など

作成:

Vercelのロックが解除されたのでCloudflareからまたVercelに戻ってきた。
Cloudflareはどうもビルド失敗が多い。

Trailing slash

以前のURLの末尾がスラッシュだと別の投稿になる問題に対処するためにvercel.jsonに末尾に必ずスラッシュがつくようになる設定を加えた。

{
  "trailingSlash": true, //これ
}

時間の問題

Vercelの日時はUTC時間だが(javascriptのDateは基本的にUTC)ブログ記事のfrontmatterの日時は日本時間なため<time>タグのdatetimeがUTC時間の日本時刻という未来になりBridgy-Fedに未来時間の投稿をしてしまっていた。

とりあえず以下のように一時対処した。

通知用日時にするためにUTC時刻用変数を２つ用意する。

---
const postDate = frontmatter.date
  ? new Date(frontmatter.date)
  : new Date("2000-01-01 00:00:00");
const updatedDate = frontmatter.updatedDate
  ? new Date(frontmatter.updatedDate)
  : new Date("2000-01-01 00:00:00");
postDate.setHours(postDate.getHours() - 9);
updatedDate.setHours(updatedDate.getHours() - 9);

ブログに表示される日時部分は以下のとおり。

    <div class="dateInfo">
      {
        frontmatter.date && (
          <span class="postDate">
            作成:
            <time datetime={postDate.toJSON()}>
              {new Date(frontmatter.date).toLocaleDateString(SITE_DATE_LANG, {
                year: "numeric",
                month: "short",
                day: "numeric",
              })}
            </time>
          </span>
        )
      }
      {
        frontmatter.updatedDate && (
          <span class="updatedDate">
            更新:
            <time datetime={updatedDate.toJSON()}>
              {new Date(frontmatter.updatedDate).toLocaleDateString(
                SITE_DATE_LANG,
                {
                  year: "numeric",
                  month: "short",
                  day: "numeric",
                }
              )}
            </time>
          </span>
        )
      }
    </div>

非表示のBridgy-Fed通知用の<time>タグは以下のようにした。

      <div style="display: none;">
        <a class="u-bridgy-fed" href="https://fed.brid.gy/"></a>
        <time class="dt-published" datetime={postDate.toJSON()}>
          {postDate.toJSON()}
        </time>
      </div>

これでブログ上の表記ではfrontmatterのdateを使い日本時間になり、Bridgy-Fedに通知する時間はUTC時間になった。

もっとマシなやり方がありそうだが一応ここまでにしておく。