・プッシュ通知の修正

・メニューをスマホに最適化・アラート送信済みの条件が再度発動しないように修正
2026-05-25 16:29:38 +09:00
parent 50b872b439
commit a0356e630e
10 changed files with 844 additions and 88 deletions
--- a/db/schema.sql
+++ b/db/schema.sql
@@ -106,11 +106,19 @@ CREATE TABLE IF NOT EXISTS site_alert_conditions (
  threshold_hours integer NOT NULL CHECK (threshold_hours > 0 AND threshold_hours <= 17520),
  webhook_method_ids uuid[] NOT NULL DEFAULT '{}',
  push_enabled boolean NOT NULL DEFAULT false,
+  last_notified_certificate_expires_at timestamptz,
+  last_notified_at timestamptz,
+  last_notification_skipped_at timestamptz,
  created_at timestamptz NOT NULL DEFAULT now(),
  updated_at timestamptz NOT NULL DEFAULT now(),
  UNIQUE (site_id, condition_type, threshold_hours)
 );

+ALTER TABLE site_alert_conditions
+  ADD COLUMN IF NOT EXISTS last_notified_certificate_expires_at timestamptz,
+  ADD COLUMN IF NOT EXISTS last_notified_at timestamptz,
+  ADD COLUMN IF NOT EXISTS last_notification_skipped_at timestamptz;
+
 CREATE INDEX IF NOT EXISTS site_alert_conditions_site_id_idx ON site_alert_conditions(site_id);

 DROP TRIGGER IF EXISTS site_alert_conditions_set_updated_at ON site_alert_conditions;
--- a/development_status.md
+++ b/development_status.md
@@ -42,11 +42,14 @@
 - Webhook 登録 API
 - Webhook 更新 API
 - Webhook 削除 API
+- 現在ブラウザの Push 購読状態確認 API
 - Push 購読情報登録 API
+- Push 購読情報解除 API
 - OpenSSL による証明書発行元・発行日時・期限取得処理
 - 監視ジョブで取得した最新の証明書発行元・発行日時・期限・確認日時・取得失敗状態をサイトに保存
 - サイトごとの通知条件評価
 - 条件一致時のアラート履歴作成
+- 通知条件ごとの証明書期限単位の送信済み管理
 - 証明書取得失敗時のアラート履歴作成
 - Webhook 通知送信処理
 - Push 通知送信処理
@@ -151,6 +154,7 @@
 - `updated_at` 更新用トリガーを定義。
 - ユーザー関連データは `ON DELETE CASCADE` を中心に設計。
 - サイト削除時は通知条件も削除される。
+- 通知条件は、対象の証明書期限ごとに送信済み状態を保持する。
 - アラート履歴のサイト参照は `ON DELETE SET NULL`。

 ## API
@@ -183,7 +187,9 @@ GET    /api/notification-methods
 POST   /api/notification-methods/webhooks
 PATCH  /api/notification-methods/webhooks/:methodId
 DELETE /api/notification-methods/webhooks/:methodId
+POST   /api/notification-methods/push-subscription-status
 POST   /api/notification-methods/push-subscriptions
+DELETE /api/notification-methods/push-subscriptions

 GET    /api/account
 PATCH  /api/account/profile
@@ -238,7 +244,9 @@ pnpm monitor:worker
  - Webhook 編集
  - 確認ダイアログ付き Webhook 削除
  - ブラウザ Push 通知の許可状態表示
+  - 現在のブラウザの Push 登録状態表示
  - VAPID public key がある場合の Push 購読登録
+  - 現在のブラウザが登録済みの場合の Push 購読解除
 - アカウント設定画面
  - 表示名更新
  - ダイアログでのパスワード更新
@@ -248,7 +256,7 @@ pnpm monitor:worker
  - 確認ダイアログ付きアカウント削除
 - 認証後画面共通の左サイドメニュー
  - PC 幅では展開表示
-  - スマートフォンなど狭い幅ではアイコンのみの畳み表示
+  - スマートフォンなど狭い幅では上部の横メニューバーとハンバーガーメニューで表示
  - サイト一覧、アラート履歴、通知方法、アカウント、ログアウトに対応
 - 認証後画面の URL ルーティング
  - サイト一覧、サイト設定、アラート履歴、通知方法、アカウントに個別 URL を付与
@@ -283,6 +291,8 @@ pnpm monitor:worker
 - Webhook URL は `normalizeHttpsUrl` を通し、localhost / private IPv4 / loopback IPv4 を拒否。
 - Webhook 更新・削除はログインユーザーの通知方法のみ対象。
 - Push endpoint は HTTPS のみ許可。
+- Push 設定画面では登録済みデバイス一覧を返さず、現在ブラウザの登録状態のみ確認。
+- Push 購読解除はログインユーザーの現在ブラウザ endpoint のみ対象。
 - OpenSSL 呼び出しはタイムアウトを設定。
 - 監視ジョブはサイト単位の失敗で全体を止めない。
 - 外部通信を伴う監視処理は並列数を制限。
@@ -336,9 +346,12 @@ API 動作確認:
 - API 経由で Webhook 登録成功。
 - API 経由で Webhook 更新成功。
 - API 経由で Webhook 削除成功。
+- API 経由で現在ブラウザの Push 登録状態確認成功。
 - API 経由で Push 購読情報登録成功。
+- API 経由で Push 購読情報解除成功。
 - `pnpm monitor:once` 成功。
 - API セキュリティ境界と証明書監視処理のテスト成功。
+- 通知条件ごとの重複送信防止、1 時間以上経過時の送信済み扱い、証明書更新時の再通知をテストで確認。
 - `/push-sw.js` が SPA fallback ではなく Service Worker JavaScript として返ることをテストで確認。
 - サイト登録時の証明書期限初期取得と取得失敗時の登録拒否テスト成功。
 - 権限付き実行で OpenSSL による実サイトの証明書期限取得成功。
--- a/docker-compose.yml
+++ b/docker-compose.yml
@@ -14,6 +14,8 @@ services:
      interval: 10s
      timeout: 5s
      retries: 5
+    ports:
+      - '127.0.0.1:54320:5432'

  app:
    build: .
--- a/src/client/components/Sidebar.jsx
+++ b/src/client/components/Sidebar.jsx
@@ -1,4 +1,5 @@
-import { Bell, Globe2, Link, LogOut, ShieldCheck, UserRound } from 'lucide-react';
+import { useState } from 'react';
+import { Bell, Globe2, Link, LogOut, Menu, ShieldCheck, UserRound, X } from 'lucide-react';

 const navItems = [
  { view: 'sites', label: 'サイト一覧', icon: Globe2 },
@@ -8,14 +9,44 @@ const navItems = [
 ];

 export function Sidebar({ activeView, user, onNavigate, onLogout }) {
+  const [menuOpen, setMenuOpen] = useState(false);
+  const MenuIcon = menuOpen ? X : Menu;
+
+  function handleNavigate(view) {
+    onNavigate(view);
+    setMenuOpen(false);
+  }
+
+  function handleLogout() {
+    setMenuOpen(false);
+    onLogout();
+  }
+
  return (
-    <aside className="sidebar" aria-label="メインメニュー">
+    <aside className={`sidebar ${menuOpen ? 'menu-open' : ''}`} aria-label="メインメニュー">
      <div className="sidebar-brand">
        <ShieldCheck aria-hidden="true" size={24} />
        <span>CertRemind</span>
      </div>

-      <nav className="sidebar-nav">
+      <div className="sidebar-mobile-user">
+        <UserRound aria-hidden="true" size={18} />
+        <span>{user.displayName}</span>
+      </div>
+
+      <button
+        className="sidebar-menu-button"
+        type="button"
+        onClick={() => setMenuOpen((open) => !open)}
+        aria-expanded={menuOpen}
+        aria-controls="sidebar-menu"
+        aria-label={menuOpen ? 'メニューを閉じる' : 'メニューを開く'}
+        title={menuOpen ? 'メニューを閉じる' : 'メニューを開く'}
+      >
+        <MenuIcon aria-hidden="true" size={22} />
+      </button>
+
+      <nav className="sidebar-nav" id="sidebar-menu">
        {navItems.map((item) => {
          const Icon = item.icon;
          const active = activeView === item.view;
@@ -23,7 +54,7 @@ export function Sidebar({ activeView, user, onNavigate, onLogout }) {
            <button
              className={`sidebar-link ${active ? 'active' : ''}`}
              key={item.view}
-              onClick={() => onNavigate(item.view)}
+              onClick={() => handleNavigate(item.view)}
              aria-current={active ? 'page' : undefined}
              title={item.label}
            >
@@ -39,7 +70,7 @@ export function Sidebar({ activeView, user, onNavigate, onLogout }) {
          <UserRound aria-hidden="true" size={18} />
          <span>{user.displayName}</span>
        </div>
-        <button className="sidebar-link" onClick={onLogout} title="ログアウト">
+        <button className="sidebar-link" onClick={handleLogout} title="ログアウト">
          <LogOut aria-hidden="true" size={20} />
          <span>ログアウト</span>
        </button>
--- a/src/client/routes/NotificationMethodsView.jsx
+++ b/src/client/routes/NotificationMethodsView.jsx
@@ -1,5 +1,5 @@
-import { useEffect, useState } from 'react';
-import { ArrowLeft, BellRing, Link, Pencil, Plus, Trash2 } from 'lucide-react';
+import { useCallback, useEffect, useState } from 'react';
+import { ArrowLeft, BellOff, BellRing, Link, Pencil, Plus, Trash2 } from 'lucide-react';
 import { request } from '../api/client.js';
 import { ConfirmDialog } from '../components/ConfirmDialog.jsx';
 import { Field } from '../components/Field.jsx';
@@ -29,15 +29,32 @@ function urlBase64ToUint8Array(base64String) {
 }

 function permissionText(permission) {
+  if (permission === 'unsupported') return '非対応';
  if (permission === 'granted') return '許可済み';
  if (permission === 'denied') return '拒否されています';
  return '未設定';
 }

+function pushStatusText(status) {
+  if (status === 'checking') return '確認中';
+  if (status === 'registered') return 'このブラウザは登録済みです';
+  if (status === 'unregistered') return 'このブラウザは未登録です';
+  if (status === 'no-subscription') return 'このブラウザは未登録です';
+  if (status === 'permission-denied') return 'ブラウザ通知が拒否されています';
+  if (status === 'unconfigured') return 'VAPID public key が未設定です';
+  if (status === 'unsupported') return 'このブラウザは非対応です';
+  if (status === 'error') return '状態を確認できませんでした';
+  return '未確認';
+}
+
+async function getPushRegistration() {
+  return navigator.serviceWorker.register('/push-sw.js');
+}
+
 export function NotificationMethodsView({ onBack }) {
  const [webhooks, setWebhooks] = useState([]);
-  const [pushSubscriptions, setPushSubscriptions] = useState([]);
  const [vapidPublicKey, setVapidPublicKey] = useState('');
+  const [currentPushStatus, setCurrentPushStatus] = useState('unchecked');
  const [form, setForm] = useState({ alias: '', url: '' });
  const [editingId, setEditingId] = useState('');
  const [permission, setPermission] = useState(
@@ -46,16 +63,58 @@ export function NotificationMethodsView({ onBack }) {
  const [busy, setBusy] = useState(false);
  const { showToast } = useToast();

-  async function loadMethods() {
+  const refreshCurrentPushStatus = useCallback(
+    async (publicKey = vapidPublicKey) => {
+      if (!('serviceWorker' in navigator) || !('PushManager' in window)) {
+        setCurrentPushStatus('unsupported');
+        return;
+      }
+      if (!publicKey) {
+        setCurrentPushStatus('unconfigured');
+        return;
+      }
+      if (typeof Notification === 'undefined') {
+        setCurrentPushStatus('unsupported');
+        return;
+      }
+      setPermission(Notification.permission);
+      if (Notification.permission === 'denied') {
+        setCurrentPushStatus('permission-denied');
+        return;
+      }
+
+      setCurrentPushStatus('checking');
+      try {
+        const registration = await getPushRegistration();
+        const subscription = await registration.pushManager.getSubscription();
+        if (!subscription) {
+          setCurrentPushStatus('no-subscription');
+          return;
+        }
+
+        const data = await request('/api/notification-methods/push-subscription-status', {
+          method: 'POST',
+          body: JSON.stringify({ endpoint: subscription.endpoint }),
+        });
+        setCurrentPushStatus(data.registered ? 'registered' : 'unregistered');
+      } catch (err) {
+        setCurrentPushStatus('error');
+        showToast({ type: 'error', message: err.message });
+      }
+    },
+    [showToast, vapidPublicKey],
+  );
+
+  const loadMethods = useCallback(async () => {
    const data = await request('/api/notification-methods');
    setWebhooks(data.webhooks);
-    setPushSubscriptions(data.pushSubscriptions);
    setVapidPublicKey(data.vapidPublicKey);
-  }
+    await refreshCurrentPushStatus(data.vapidPublicKey);
+  }, [refreshCurrentPushStatus]);

  useEffect(() => {
    loadMethods().catch((err) => showToast({ type: 'error', message: err.message }));
-  }, [showToast]);
+  }, [loadMethods, showToast]);

  async function submitWebhook(event) {
    event.preventDefault();
@@ -110,6 +169,9 @@ export function NotificationMethodsView({ onBack }) {
      if (!vapidPublicKey) {
        throw new Error('VAPID public key が設定されていません');
      }
+      if (typeof Notification === 'undefined') {
+        throw new Error('このブラウザはプッシュ通知に対応していません');
+      }

      const nextPermission = await Notification.requestPermission();
      setPermission(nextPermission);
@@ -117,18 +179,49 @@ export function NotificationMethodsView({ onBack }) {
        throw new Error('ブラウザ通知が許可されませんでした');
      }

-      const registration = await navigator.serviceWorker.register('/push-sw.js');
-      const subscription = await registration.pushManager.subscribe({
-        userVisibleOnly: true,
-        applicationServerKey: urlBase64ToUint8Array(vapidPublicKey),
-      });
+      const registration = await getPushRegistration();
+      const existingSubscription = await registration.pushManager.getSubscription();
+      const subscription =
+        existingSubscription ??
+        (await registration.pushManager.subscribe({
+          userVisibleOnly: true,
+          applicationServerKey: urlBase64ToUint8Array(vapidPublicKey),
+        }));

      await request('/api/notification-methods/push-subscriptions', {
        method: 'POST',
        body: JSON.stringify(subscription.toJSON()),
      });
      showToast({ type: 'success', message: 'プッシュ通知を登録しました' });
-      await loadMethods();
+      await refreshCurrentPushStatus();
+    } catch (err) {
+      showToast({ type: 'error', message: err.message });
+    } finally {
+      setBusy(false);
+    }
+  }
+
+  async function unsubscribePush() {
+    setBusy(true);
+    try {
+      if (!('serviceWorker' in navigator) || !('PushManager' in window)) {
+        throw new Error('このブラウザはプッシュ通知に対応していません');
+      }
+
+      const registration = await getPushRegistration();
+      const subscription = await registration.pushManager.getSubscription();
+      if (!subscription) {
+        await refreshCurrentPushStatus();
+        throw new Error('解除対象のプッシュ通知登録が見つかりません');
+      }
+
+      await request('/api/notification-methods/push-subscriptions', {
+        method: 'DELETE',
+        body: JSON.stringify({ endpoint: subscription.endpoint }),
+      });
+      await subscription.unsubscribe();
+      showToast({ type: 'success', message: 'プッシュ通知を解除しました' });
+      await refreshCurrentPushStatus();
    } catch (err) {
      showToast({ type: 'error', message: err.message });
    } finally {
@@ -239,35 +332,45 @@ export function NotificationMethodsView({ onBack }) {
            </div>
          </div>

+          <div className="method-list">
+            <article className="method-row">
+              <div>
+                <strong>現在のブラウザ</strong>
+                <span>{pushStatusText(currentPushStatus)}</span>
+              </div>
+            </article>
+          </div>
+
          <div className="push-actions">
-            <button
-              className="secondary"
-              type="button"
-              onClick={subscribePush}
-              disabled={busy || !vapidPublicKey}
-            >
-              <BellRing aria-hidden="true" size={18} />
-              このブラウザを登録
-            </button>
+            {currentPushStatus === 'registered' ? (
+              <ConfirmDialog
+                title="プッシュ通知を解除"
+                description="現在のブラウザをプッシュ通知の登録から解除します。"
+                confirmLabel="解除"
+                onConfirm={unsubscribePush}
+                disabled={busy}
+                trigger={
+                  <button className="secondary danger-text" type="button" disabled={busy}>
+                    <BellOff aria-hidden="true" size={18} />
+                    このブラウザを解除
+                  </button>
+                }
+              />
+            ) : (
+              <button
+                className="secondary"
+                type="button"
+                onClick={subscribePush}
+                disabled={busy || !vapidPublicKey}
+              >
+                <BellRing aria-hidden="true" size={18} />
+                このブラウザを登録
+              </button>
+            )}
            {!vapidPublicKey ? (
              <p className="muted">VAPID public key を設定すると登録できます。</p>
            ) : null}
          </div>
-
-          <div className="method-list">
-            {pushSubscriptions.length === 0 ? (
-              <div className="empty">登録済みのブラウザはありません。</div>
-            ) : (
-              pushSubscriptions.map((subscription) => (
-                <article className="method-row" key={subscription.notificationMethodId}>
-                  <div>
-                    <strong>Browser Push</strong>
-                    <span>{subscription.endpoint}</span>
-                  </div>
-                </article>
-              ))
-            )}
-          </div>
        </section>
      </section>
    </main>
--- a/src/client/styles/app.css
+++ b/src/client/styles/app.css
@@ -300,7 +300,8 @@ select:focus {

 .sidebar-brand,
 .sidebar-link,
-.sidebar-user {
+.sidebar-user,
+.sidebar-mobile-user {
  display: flex;
  align-items: center;
  gap: 10px;
@@ -321,6 +322,11 @@ select:focus {
  gap: 8px;
 }

+.sidebar-mobile-user,
+.sidebar-menu-button {
+  display: none;
+}
+
 .sidebar-footer {
  border-top: 1px solid #d9e1de;
  padding-top: 12px;
@@ -344,7 +350,8 @@ select:focus {
  color: #276761;
 }

-.sidebar-user {
+.sidebar-user,
+.sidebar-mobile-user {
  min-width: 0;
  min-height: 38px;
  padding: 0 10px;
@@ -354,6 +361,7 @@ select:focus {
 }

 .sidebar-user span,
+.sidebar-mobile-user span,
 .sidebar-link span,
 .sidebar-brand span {
  overflow: hidden;
@@ -909,31 +917,77 @@ select:focus {

@media (max-width: 720px) {
  .app-frame {
-    grid-template-columns: 64px minmax(0, 1fr);
+    grid-template-columns: 1fr;
+    grid-template-rows: auto minmax(0, 1fr);
  }

  .sidebar {
-    padding: 12px 8px;
-    gap: 12px;
+    z-index: 30;
+    height: auto;
+    grid-template-columns: minmax(0, 1fr) minmax(0, auto) auto;
+    grid-template-rows: auto auto auto;
+    align-items: center;
+    gap: 10px;
+    border-right: 0;
+    border-bottom: 1px solid #d9e1de;
+    padding: 10px 12px;
  }

-  .sidebar-brand,
-  .sidebar-link,
-  .sidebar-user {
-    justify-content: center;
-    padding-left: 0;
-    padding-right: 0;
+  .sidebar-brand {
+    min-width: 0;
+    padding: 0;
  }

-  .sidebar-brand span,
-  .sidebar-link span,
-  .sidebar-user span {
-    position: absolute;
-    width: 1px;
-    height: 1px;
-    overflow: hidden;
-    clip: rect(0, 0, 0, 0);
-    white-space: nowrap;
+  .sidebar-mobile-user {
+    display: flex;
+    justify-content: flex-end;
+    min-width: 0;
+    padding: 0;
+  }
+
+  .sidebar-menu-button {
+    width: 42px;
+    height: 42px;
+    display: grid;
+    place-items: center;
+    border: 1px solid #c9d4d0;
+    border-radius: 6px;
+    background: #ffffff;
+    color: #40504b;
+  }
+
+  .sidebar-menu-button:hover {
+    border-color: #276761;
+    color: #276761;
+  }
+
+  .sidebar-nav,
+  .sidebar-footer {
+    grid-column: 1 / -1;
+    display: none;
+  }
+
+  .sidebar.menu-open .sidebar-nav,
+  .sidebar.menu-open .sidebar-footer {
+    display: grid;
+  }
+
+  .sidebar-nav {
+    border-top: 1px solid #d9e1de;
+    padding-top: 10px;
+  }
+
+  .sidebar-footer {
+    padding-top: 10px;
+  }
+
+  .sidebar-footer .sidebar-user {
+    display: none;
+  }
+
+  .sidebar-link {
+    justify-content: flex-start;
+    padding: 0 10px;
  }

  .topbar {
@@ -942,9 +996,9 @@ select:focus {
  }

  .toast-viewport {
-    top: 172px;
+    top: 76px;
    right: 12px;
-    width: min(360px, calc(100vw - 64px - 24px));
+    width: min(360px, calc(100vw - 24px));
  }

  .site-form {
--- a/src/server/modules/monitoring/monitor.js
+++ b/src/server/modules/monitoring/monitor.js
@@ -3,6 +3,22 @@ import { getCertificateExpiry } from './certificate.js';
 import { deliverNotifications } from './notifications.js';

 const DEFAULT_CONCURRENCY = 4;
+const MISSED_NOTIFICATION_GRACE_HOURS = 1;
+
+function toTimestamp(value) {
+  if (!value) return null;
+  return value instanceof Date ? value.getTime() : new Date(value).getTime();
+}
+
+function isSameCertificateExpiry(left, right) {
+  const leftTimestamp = toTimestamp(left);
+  const rightTimestamp = toTimestamp(right);
+  return leftTimestamp !== null && rightTimestamp !== null && leftTimestamp === rightTimestamp;
+}
+
+function hoursUntilExpiry(certificate) {
+  return (certificate.expiresAt.getTime() - Date.now()) / 3_600_000;
+}

 function alertChannels(condition) {
  const channels = ['app'];
@@ -39,7 +55,11 @@ async function loadMonitoringTargets(client) {
                  'site_alert_condition_id', c.site_alert_condition_id,
                  'threshold_hours', c.threshold_hours,
                  'webhook_method_ids', c.webhook_method_ids,
-                  'push_enabled', c.push_enabled
+                  'push_enabled', c.push_enabled,
+                  'last_notified_certificate_expires_at',
+                    c.last_notified_certificate_expires_at,
+                  'last_notified_at', c.last_notified_at,
+                  'last_notification_skipped_at', c.last_notification_skipped_at
                )
                ORDER BY c.threshold_hours ASC
              ) FILTER (WHERE c.site_alert_condition_id IS NOT NULL),
@@ -124,10 +144,40 @@ async function recordCertificateFailure(client, site, error) {
  );
 }

+async function markConditionNotified(client, condition, certificate) {
+  await client.query(
+    `UPDATE site_alert_conditions
+        SET last_notified_certificate_expires_at = $2,
+            last_notified_at = now(),
+            last_notification_skipped_at = NULL
+      WHERE site_alert_condition_id = $1`,
+    [condition.site_alert_condition_id, certificate.expiresAt],
+  );
+}
+
+async function markConditionSkipped(client, condition, certificate) {
+  await client.query(
+    `UPDATE site_alert_conditions
+        SET last_notified_certificate_expires_at = $2,
+            last_notification_skipped_at = now()
+      WHERE site_alert_condition_id = $1`,
+    [condition.site_alert_condition_id, certificate.expiresAt],
+  );
+}
+
 async function processMatchingCondition(client, site, condition, certificate) {
  if (certificate.hoursUntilExpiry > condition.threshold_hours) {
    return { alerted: false };
  }
+  if (
+    isSameCertificateExpiry(condition.last_notified_certificate_expires_at, certificate.expiresAt)
+  ) {
+    return { alerted: false, alreadyNotified: true };
+  }
+  if (condition.threshold_hours - hoursUntilExpiry(certificate) >= MISSED_NOTIFICATION_GRACE_HOURS) {
+    await markConditionSkipped(client, condition, certificate);
+    return { alerted: false, skipped: true };
+  }

  const message = buildExpiryMessage(site, condition, certificate);
  const webhooks = await loadWebhooks(client, site.user_id, condition.webhook_method_ids);
@@ -149,6 +199,7 @@ async function processMatchingCondition(client, site, condition, certificate) {
    deliveryResult,
    dedupeKey,
  });
+  await markConditionNotified(client, condition, certificate);

  return { alerted: Boolean(alert), dedupeKey };
 }
--- a/src/server/modules/notificationMethods/routes.js
+++ b/src/server/modules/notificationMethods/routes.js
@@ -21,6 +21,10 @@ const pushSubscriptionSchema = z.object({
  }),
 });

+const pushSubscriptionStatusSchema = z.object({
+  endpoint: z.string().trim().url().max(2048),
+});
+
 function serializeWebhook(row) {
  return {
    notificationMethodId: row.notification_method_id,
@@ -31,40 +35,25 @@ function serializeWebhook(row) {
  };
 }

-function serializePushSubscription(row) {
-  return {
-    notificationMethodId: row.notification_method_id,
-    endpoint: row.push_endpoint,
-    createdAt: row.created_at,
-    updatedAt: row.updated_at,
-  };
-}
-
 router.use('*', requireAuth);

 router.get('/', async (c) => {
  const user = c.get('user');
  const result = await query(
    `SELECT notification_method_id,
-            notification_type,
            alias,
            url,
-            push_endpoint,
            created_at,
            updated_at
       FROM notification_methods
      WHERE user_id = $1
+        AND notification_type = 'webhook'
      ORDER BY created_at DESC`,
    [user.user_id],
  );

  return c.json({
-    webhooks: result.rows
-      .filter((row) => row.notification_type === 'webhook')
-      .map(serializeWebhook),
-    pushSubscriptions: result.rows
-      .filter((row) => row.notification_type === 'push')
-      .map(serializePushSubscription),
+    webhooks: result.rows.map(serializeWebhook),
    vapidPublicKey: env.vapidPublicKey,
  });
 });
@@ -150,6 +139,30 @@ router.delete('/webhooks/:methodId', async (c) => {
  return c.json({ ok: true });
 });

+router.post('/push-subscription-status', async (c) => {
+  const body = pushSubscriptionStatusSchema.safeParse(await c.req.json().catch(() => null));
+  if (!body.success) {
+    throw badRequest('購読状態を確認できません', body.error.flatten());
+  }
+
+  const endpoint = new URL(body.data.endpoint);
+  if (endpoint.protocol !== 'https:') {
+    throw badRequest('Push endpoint は HTTPS である必要があります');
+  }
+
+  const result = await query(
+    `SELECT notification_method_id
+       FROM notification_methods
+      WHERE user_id = $1
+        AND notification_type = 'push'
+        AND push_endpoint = $2
+      LIMIT 1`,
+    [c.get('user').user_id, body.data.endpoint],
+  );
+
+  return c.json({ registered: Boolean(result.rows[0]) });
+});
+
 router.post('/push-subscriptions', async (c) => {
  const body = pushSubscriptionSchema.safeParse(await c.req.json().catch(() => null));
  if (!body.success) {
@@ -178,7 +191,43 @@ router.post('/push-subscriptions', async (c) => {
    [user.user_id, body.data.endpoint, body.data.keys.p256dh, body.data.keys.auth],
  );

-  return c.json({ pushSubscription: serializePushSubscription(result.rows[0]) }, 201);
+  return c.json(
+    {
+      pushSubscription: {
+        notificationMethodId: result.rows[0].notification_method_id,
+        createdAt: result.rows[0].created_at,
+        updatedAt: result.rows[0].updated_at,
+      },
+    },
+    201,
+  );
+});
+
+router.delete('/push-subscriptions', async (c) => {
+  const body = pushSubscriptionStatusSchema.safeParse(await c.req.json().catch(() => null));
+  if (!body.success) {
+    throw badRequest('購読情報を確認してください', body.error.flatten());
+  }
+
+  const endpoint = new URL(body.data.endpoint);
+  if (endpoint.protocol !== 'https:') {
+    throw badRequest('Push endpoint は HTTPS である必要があります');
+  }
+
+  const result = await query(
+    `DELETE FROM notification_methods
+      WHERE user_id = $1
+        AND notification_type = 'push'
+        AND push_endpoint = $2
+      RETURNING notification_method_id`,
+    [c.get('user').user_id, body.data.endpoint],
+  );
+
+  if (!result.rows[0]) {
+    throw notFound('Push 購読情報が見つかりません');
+  }
+
+  return c.json({ ok: true });
 });

 export default router;
--- a/tests/apiSecurity.test.js
+++ b/tests/apiSecurity.test.js
@@ -18,6 +18,7 @@ const USER_ID = '11111111-1111-4111-8111-111111111111';
 const SITE_ID = '22222222-2222-4222-8222-222222222222';
 const ALERT_ID = '33333333-3333-4333-8333-333333333333';
 const WEBHOOK_ID = '44444444-4444-4444-8444-444444444444';
+const PUSH_ENDPOINT = 'https://push.example.com/subscription';

 function authCookie() {
  return 'certremind_session=session-1';
@@ -143,6 +144,182 @@ describe('API security boundaries', () => {
    expect(query).toHaveBeenCalledTimes(1);
  });

+  it('does not expose registered push subscription lists', async () => {
+    mockAuthenticatedUser();
+    query.mockImplementationOnce(query.getMockImplementation()).mockImplementationOnce(async (sql, params) => {
+      expect(sql).toContain('FROM notification_methods');
+      expect(sql).toContain("notification_type = 'webhook'");
+      expect(params).toEqual([USER_ID]);
+      return {
+        rows: [
+          {
+            notification_method_id: WEBHOOK_ID,
+            alias: 'Deploy hook',
+            url: 'https://hooks.example.com/',
+            created_at: '2026-05-20T00:00:00.000Z',
+            updated_at: '2026-05-21T00:00:00.000Z',
+          },
+        ],
+      };
+    });
+
+    const app = createApp();
+    const response = await app.request('/api/notification-methods', {
+      headers: {
+        Cookie: authCookie(),
+      },
+    });
+
+    expect(response.status).toBe(200);
+    const data = await response.json();
+    expect(data.webhooks).toHaveLength(1);
+    expect(data).not.toHaveProperty('pushSubscriptions');
+  });
+
+  it('reports the current browser push subscription as registered for the session user', async () => {
+    mockAuthenticatedUser();
+    query.mockImplementationOnce(query.getMockImplementation()).mockImplementationOnce(async (sql, params) => {
+      expect(sql).toContain('FROM notification_methods');
+      expect(sql).toContain("notification_type = 'push'");
+      expect(params).toEqual([USER_ID, PUSH_ENDPOINT]);
+      return { rows: [{ notification_method_id: '66666666-6666-4666-8666-666666666666' }] };
+    });
+
+    const app = createApp();
+    const response = await app.request('/api/notification-methods/push-subscription-status', {
+      method: 'POST',
+      headers: {
+        'Content-Type': 'application/json',
+        Cookie: csrfCookie(),
+        'x-csrf-token': 'csrf-token',
+      },
+      body: JSON.stringify({ endpoint: PUSH_ENDPOINT }),
+    });
+
+    expect(response.status).toBe(200);
+    await expect(response.json()).resolves.toEqual({ registered: true });
+  });
+
+  it('reports push subscriptions for other users or unknown endpoints as unregistered', async () => {
+    mockAuthenticatedUser();
+    query.mockImplementationOnce(query.getMockImplementation()).mockImplementationOnce(async (sql, params) => {
+      expect(sql).toContain('FROM notification_methods');
+      expect(params).toEqual([USER_ID, PUSH_ENDPOINT]);
+      return { rows: [] };
+    });
+
+    const app = createApp();
+    const response = await app.request('/api/notification-methods/push-subscription-status', {
+      method: 'POST',
+      headers: {
+        'Content-Type': 'application/json',
+        Cookie: csrfCookie(),
+        'x-csrf-token': 'csrf-token',
+      },
+      body: JSON.stringify({ endpoint: PUSH_ENDPOINT }),
+    });
+
+    expect(response.status).toBe(200);
+    await expect(response.json()).resolves.toEqual({ registered: false });
+  });
+
+  it('rejects non-HTTPS push subscription status endpoints', async () => {
+    mockAuthenticatedUser();
+
+    const app = createApp();
+    const response = await app.request('/api/notification-methods/push-subscription-status', {
+      method: 'POST',
+      headers: {
+        'Content-Type': 'application/json',
+        Cookie: csrfCookie(),
+        'x-csrf-token': 'csrf-token',
+      },
+      body: JSON.stringify({ endpoint: 'http://push.example.com/subscription' }),
+    });
+
+    expect(response.status).toBe(400);
+    expect(query).toHaveBeenCalledTimes(1);
+  });
+
+  it('requires a CSRF token when deleting push subscriptions', async () => {
+    const app = createApp();
+
+    const response = await app.request('/api/notification-methods/push-subscriptions', {
+      method: 'DELETE',
+      headers: {
+        'Content-Type': 'application/json',
+      },
+      body: JSON.stringify({ endpoint: PUSH_ENDPOINT }),
+    });
+
+    expect(response.status).toBe(403);
+    expect(query).not.toHaveBeenCalled();
+  });
+
+  it('deletes the current user push subscription by endpoint', async () => {
+    mockAuthenticatedUser();
+    query.mockImplementationOnce(query.getMockImplementation()).mockImplementationOnce(async (sql, params) => {
+      expect(sql).toContain('DELETE FROM notification_methods');
+      expect(sql).toContain("notification_type = 'push'");
+      expect(params).toEqual([USER_ID, PUSH_ENDPOINT]);
+      return { rows: [{ notification_method_id: '66666666-6666-4666-8666-666666666666' }] };
+    });
+
+    const app = createApp();
+    const response = await app.request('/api/notification-methods/push-subscriptions', {
+      method: 'DELETE',
+      headers: {
+        'Content-Type': 'application/json',
+        Cookie: csrfCookie(),
+        'x-csrf-token': 'csrf-token',
+      },
+      body: JSON.stringify({ endpoint: PUSH_ENDPOINT }),
+    });
+
+    expect(response.status).toBe(200);
+    await expect(response.json()).resolves.toEqual({ ok: true });
+  });
+
+  it('does not delete push subscriptions owned by other users or unknown endpoints', async () => {
+    mockAuthenticatedUser();
+    query.mockImplementationOnce(query.getMockImplementation()).mockImplementationOnce(async (sql, params) => {
+      expect(sql).toContain('DELETE FROM notification_methods');
+      expect(params).toEqual([USER_ID, PUSH_ENDPOINT]);
+      return { rows: [] };
+    });
+
+    const app = createApp();
+    const response = await app.request('/api/notification-methods/push-subscriptions', {
+      method: 'DELETE',
+      headers: {
+        'Content-Type': 'application/json',
+        Cookie: csrfCookie(),
+        'x-csrf-token': 'csrf-token',
+      },
+      body: JSON.stringify({ endpoint: PUSH_ENDPOINT }),
+    });
+
+    expect(response.status).toBe(404);
+  });
+
+  it('rejects non-HTTPS push subscription delete endpoints', async () => {
+    mockAuthenticatedUser();
+
+    const app = createApp();
+    const response = await app.request('/api/notification-methods/push-subscriptions', {
+      method: 'DELETE',
+      headers: {
+        'Content-Type': 'application/json',
+        Cookie: csrfCookie(),
+        'x-csrf-token': 'csrf-token',
+      },
+      body: JSON.stringify({ endpoint: 'http://push.example.com/subscription' }),
+    });
+
+    expect(response.status).toBe(400);
+    expect(query).toHaveBeenCalledTimes(1);
+  });
+
  it('stores the initial certificate metadata when creating a site', async () => {
    const issuer = 'C = US, O = Example CA, CN = Example Root';
    const issuedAt = new Date('2026-01-01T00:00:00.000Z');
--- a/tests/monitoring.test.js
+++ b/tests/monitoring.test.js
@@ -1,4 +1,4 @@
-import { beforeEach, describe, expect, it, vi } from 'vitest';
+import { afterEach, beforeEach, describe, expect, it, vi } from 'vitest';
 import { runCertificateMonitoring } from '../src/server/modules/monitoring/monitor.js';
 import { pool } from '../src/server/db/pool.js';
 import { getCertificateExpiry } from '../src/server/modules/monitoring/certificate.js';
@@ -30,16 +30,24 @@ vi.mock('../src/server/modules/monitoring/notifications.js', () => ({
 const SITE_ID = '22222222-2222-4222-8222-222222222222';
 const USER_ID = '11111111-1111-4111-8111-111111111111';
 const WEBHOOK_ID = '44444444-4444-4444-8444-444444444444';
+const CONDITION_ID = '55555555-5555-4555-8555-555555555555';
+const NOW = new Date('2026-05-25T00:00:00.000Z');

 describe('certificate monitoring', () => {
  beforeEach(() => {
    vi.clearAllMocks();
+    vi.useFakeTimers();
+    vi.setSystemTime(NOW);
+  });
+
+  afterEach(() => {
+    vi.useRealTimers();
  });

  it('stores the latest certificate expiry and creates an alert when a threshold matches', async () => {
    const issuer = 'C = US, O = Example CA, CN = Example Root';
    const issuedAt = new Date('2026-01-01T00:00:00.000Z');
-    const expiresAt = new Date(Date.now() + 12 * 60 * 60 * 1000);
+    const expiresAt = new Date(Date.now() + 11.5 * 60 * 60 * 1000);

    getCertificateExpiry.mockResolvedValue({
      issuer,
@@ -63,8 +71,8 @@ describe('certificate monitoring', () => {
              alias: 'Example',
              conditions: [
                {
-                  site_alert_condition_id: '55555555-5555-4555-8555-555555555555',
-                  threshold_hours: 24,
+                  site_alert_condition_id: CONDITION_ID,
+                  threshold_hours: 12,
                  webhook_method_ids: [WEBHOOK_ID],
                  push_enabled: true,
                },
@@ -116,6 +124,13 @@ describe('certificate monitoring', () => {
        return { rows: [{ alert_id: '77777777-7777-4777-8777-777777777777' }] };
      }

+      if (sql.includes('UPDATE site_alert_conditions')) {
+        expect(sql).toContain('last_notified_certificate_expires_at');
+        expect(sql).toContain('last_notified_at = now()');
+        expect(params).toEqual([CONDITION_ID, expiresAt]);
+        return { rows: [] };
+      }
+
      throw new Error(`Unexpected query: ${sql}`);
    });

@@ -222,4 +237,257 @@ describe('certificate monitoring', () => {
      results: [{ siteId: SITE_ID, ok: true, alertsCreated: 0 }],
    });
  });
+
+  it('does not notify again when the same certificate expiry was already handled', async () => {
+    const issuer = 'C = US, O = Example CA, CN = Example Root';
+    const issuedAt = new Date('2026-01-01T00:00:00.000Z');
+    const expiresAt = new Date(Date.now() + 11.5 * 60 * 60 * 1000);
+
+    getCertificateExpiry.mockResolvedValue({
+      issuer,
+      issuedAt,
+      expiresAt,
+      hoursUntilExpiry: 12,
+    });
+
+    mocks.client.query.mockImplementation(async (sql, params) => {
+      if (sql.includes('FROM sites s') && sql.includes('LEFT JOIN site_alert_conditions')) {
+        return {
+          rows: [
+            {
+              site_id: SITE_ID,
+              user_id: USER_ID,
+              url: 'https://example.com/',
+              alias: 'Example',
+              conditions: [
+                {
+                  site_alert_condition_id: CONDITION_ID,
+                  threshold_hours: 12,
+                  webhook_method_ids: [WEBHOOK_ID],
+                  push_enabled: true,
+                  last_notified_certificate_expires_at: expiresAt,
+                },
+              ],
+            },
+          ],
+        };
+      }
+
+      if (sql.includes('SET certificate_issuer')) {
+        expect(params).toEqual([SITE_ID, issuer, issuedAt, expiresAt]);
+        return { rows: [] };
+      }
+
+      throw new Error(`Unexpected query: ${sql}`);
+    });
+
+    const result = await runCertificateMonitoring({ concurrency: 1 });
+
+    expect(deliverNotifications).not.toHaveBeenCalled();
+    expect(result).toMatchObject({
+      checkedSites: 1,
+      alertsCreated: 0,
+      results: [{ siteId: SITE_ID, ok: true, alertsCreated: 0 }],
+    });
+  });
+
+  it('marks a condition as handled without notifying when it is more than an hour late', async () => {
+    const issuer = 'C = US, O = Example CA, CN = Example Root';
+    const issuedAt = new Date('2026-01-01T00:00:00.000Z');
+    const expiresAt = new Date(Date.now() + 23 * 60 * 60 * 1000);
+
+    getCertificateExpiry.mockResolvedValue({
+      issuer,
+      issuedAt,
+      expiresAt,
+      hoursUntilExpiry: 23,
+    });
+
+    mocks.client.query.mockImplementation(async (sql, params) => {
+      if (sql.includes('FROM sites s') && sql.includes('LEFT JOIN site_alert_conditions')) {
+        return {
+          rows: [
+            {
+              site_id: SITE_ID,
+              user_id: USER_ID,
+              url: 'https://example.com/',
+              alias: 'Example',
+              conditions: [
+                {
+                  site_alert_condition_id: CONDITION_ID,
+                  threshold_hours: 24,
+                  webhook_method_ids: [WEBHOOK_ID],
+                  push_enabled: true,
+                },
+              ],
+            },
+          ],
+        };
+      }
+
+      if (sql.includes('SET certificate_issuer')) {
+        expect(params).toEqual([SITE_ID, issuer, issuedAt, expiresAt]);
+        return { rows: [] };
+      }
+
+      if (sql.includes('UPDATE site_alert_conditions')) {
+        expect(sql).toContain('last_notification_skipped_at = now()');
+        expect(params).toEqual([CONDITION_ID, expiresAt]);
+        return { rows: [] };
+      }
+
+      throw new Error(`Unexpected query: ${sql}`);
+    });
+
+    const result = await runCertificateMonitoring({ concurrency: 1 });
+
+    expect(deliverNotifications).not.toHaveBeenCalled();
+    expect(result).toMatchObject({
+      checkedSites: 1,
+      alertsCreated: 0,
+      results: [{ siteId: SITE_ID, ok: true, alertsCreated: 0 }],
+    });
+  });
+
+  it('notifies and records handled state when a matching condition is less than an hour late', async () => {
+    const issuer = 'C = US, O = Example CA, CN = Example Root';
+    const issuedAt = new Date('2026-01-01T00:00:00.000Z');
+    const expiresAt = new Date(Date.now() + 23.5 * 60 * 60 * 1000);
+
+    getCertificateExpiry.mockResolvedValue({
+      issuer,
+      issuedAt,
+      expiresAt,
+      hoursUntilExpiry: 23,
+    });
+    deliverNotifications.mockResolvedValue({
+      webhook: [],
+      push: { ok: true },
+    });
+
+    mocks.client.query.mockImplementation(async (sql, params) => {
+      if (sql.includes('FROM sites s') && sql.includes('LEFT JOIN site_alert_conditions')) {
+        return {
+          rows: [
+            {
+              site_id: SITE_ID,
+              user_id: USER_ID,
+              url: 'https://example.com/',
+              alias: 'Example',
+              conditions: [
+                {
+                  site_alert_condition_id: CONDITION_ID,
+                  threshold_hours: 24,
+                  webhook_method_ids: [],
+                  push_enabled: true,
+                },
+              ],
+            },
+          ],
+        };
+      }
+
+      if (sql.includes('SET certificate_issuer')) {
+        expect(params).toEqual([SITE_ID, issuer, issuedAt, expiresAt]);
+        return { rows: [] };
+      }
+
+      if (sql.includes('FROM notification_methods') && sql.includes("notification_type = 'push'")) {
+        expect(params).toEqual([USER_ID]);
+        return { rows: [] };
+      }
+
+      if (sql.includes('INSERT INTO alert_history')) {
+        expect(params[2]).toBe('certificate_expiring');
+        expect(params[4]).toEqual(['app', 'push']);
+        return { rows: [{ alert_id: '77777777-7777-4777-8777-777777777777' }] };
+      }
+
+      if (sql.includes('UPDATE site_alert_conditions')) {
+        expect(sql).toContain('last_notified_at = now()');
+        expect(params).toEqual([CONDITION_ID, expiresAt]);
+        return { rows: [] };
+      }
+
+      throw new Error(`Unexpected query: ${sql}`);
+    });
+
+    const result = await runCertificateMonitoring({ concurrency: 1 });
+
+    expect(deliverNotifications).toHaveBeenCalledOnce();
+    expect(result).toMatchObject({
+      checkedSites: 1,
+      alertsCreated: 1,
+      results: [{ siteId: SITE_ID, ok: true, alertsCreated: 1 }],
+    });
+  });
+
+  it('notifies again when a new certificate expiry is observed', async () => {
+    const issuer = 'C = US, O = Example CA, CN = Example Root';
+    const issuedAt = new Date('2026-01-01T00:00:00.000Z');
+    const previousExpiresAt = new Date('2026-05-30T00:00:00.000Z');
+    const expiresAt = new Date(Date.now() + 11.5 * 60 * 60 * 1000);
+
+    getCertificateExpiry.mockResolvedValue({
+      issuer,
+      issuedAt,
+      expiresAt,
+      hoursUntilExpiry: 12,
+    });
+    deliverNotifications.mockResolvedValue({
+      webhook: [],
+      push: { ok: false, skipped: true },
+    });
+
+    mocks.client.query.mockImplementation(async (sql, params) => {
+      if (sql.includes('FROM sites s') && sql.includes('LEFT JOIN site_alert_conditions')) {
+        return {
+          rows: [
+            {
+              site_id: SITE_ID,
+              user_id: USER_ID,
+              url: 'https://example.com/',
+              alias: 'Example',
+              conditions: [
+                {
+                  site_alert_condition_id: CONDITION_ID,
+                  threshold_hours: 12,
+                  webhook_method_ids: [],
+                  push_enabled: false,
+                  last_notified_certificate_expires_at: previousExpiresAt,
+                },
+              ],
+            },
+          ],
+        };
+      }
+
+      if (sql.includes('SET certificate_issuer')) {
+        expect(params).toEqual([SITE_ID, issuer, issuedAt, expiresAt]);
+        return { rows: [] };
+      }
+
+      if (sql.includes('INSERT INTO alert_history')) {
+        expect(params[2]).toBe('certificate_expiring');
+        expect(params[4]).toEqual(['app']);
+        return { rows: [{ alert_id: '77777777-7777-4777-8777-777777777777' }] };
+      }
+
+      if (sql.includes('UPDATE site_alert_conditions')) {
+        expect(params).toEqual([CONDITION_ID, expiresAt]);
+        return { rows: [] };
+      }
+
+      throw new Error(`Unexpected query: ${sql}`);
+    });
+
+    const result = await runCertificateMonitoring({ concurrency: 1 });
+
+    expect(deliverNotifications).toHaveBeenCalledOnce();
+    expect(result).toMatchObject({
+      checkedSites: 1,
+      alertsCreated: 1,
+      results: [{ siteId: SITE_ID, ok: true, alertsCreated: 1 }],
+    });
+  });
 });