C.W.K.
Stream
Lesson 04 of 08 · published

Notification 시스템

~10 min · app, notifications

Level 0Poller
0 XP0/60 lessons0/10 achievements
0/120 XP to next level120 XP to go0% complete

Push, poll 아니라

Notification 이 server push 의 가장 깔끔한 케이스. User 가 안 묻고 있어; 서버에 news. typed message 로 push; 클라 UI 가 toast, badge, sound 중 골라.

Multi-device fan-out

같은 user 가 폰 + 노트북 + 아이패드 열고 있으면 셋 다에 보여야 함 (구현하면 'device 어느 거든 ack 하면 다 clear'). Track 4 의 multi-device-aware manager 가 한 줄 코드.

Notification feed 는 SSE 로 충분

Notification 은 server-to-client 만. SSE 가 단순함에서 이김. 같은 connection 이 다른 양방향 flow 도 처리하면 그때 WebSocket.

Code

서버: user 한테 notification push·python
import uuid
from datetime import datetime

async def notify(manager, user_id: str, *, title: str, body: str,
                  level: str = 'info', url: str | None = None):
    msg = {
        'type': 'notification',
        'data': {
            'id':    str(uuid.uuid4()),
            'title': title,
            'body':  body,
            'level': level,
            'url':   url,
            'ts':    datetime.utcnow().isoformat() + 'Z',
        },
    }
    sent = await manager.send_to_user(user_id, msg)
    if sent == 0:
        # User offline; persist for delivery on next connect.
        await db.notifications.insert(user_id, msg)
클라: toast + badge·javascript
ws.on('notification', (data) => {
  showToast({
    title:   data.title,
    body:    data.body,
    level:   data.level,           // info / warning / success / error
    onClick: () => data.url && (location.href = data.url),
  });
  unread += 1;
  setBadge(unread);
});

External links

Exercise

notify() 서버 함수 + 클라 toast 짜. REST endpoint (POST /admin/notify) 에서 trigger. 같은 user 의 브라우저 탭 셋 + 다른 user 탭 하나 — 매칭 user 만 셋 다 에서 toast 봐야 함.

Progress

Progress is local-only — sign in to sync across devices.
이 페이지에서 버그를 발견하셨거나 피드백이 있으세요?문제 신고

댓글 0

🔔 답글 알림 (로그인 필요)
로그인댓글을 남기려면 로그인해 주세요.

아직 댓글이 없어요. 첫 댓글을 남겨보세요.