입력 중 표시 및 온라인 상태
Spring에서 STOMP 이벤트, 하트비트, 상태 추적을 사용해 채팅 앱에 실시간 입력 중 표시와 온라인 상태를 추가하는 방법을 익혀 보세요.
입력 중 표시 및 온라인 상태은(는) CoddyKit의 무료 WebSockets & Real-Time Systems with Spring 강의입니다. 이것은 4개 중 4번째 강의입니다. 아래에서 전체 강의를 무료로 읽을 수 있으며, 내장 코드 에디터와 24/7 AI 튜터와 함께 브라우저에서 직접 실습할 수 있습니다. 이 강의는 WebSockets & Real-Time Systems with Spring 학습 경로의 일부이며, 진행 상황이 웹과 CoddyKit 앱에 동기화됩니다. WebSockets & Real-Time Systems with Spring 강의에는 총 4개의 강의가 포함되어 있습니다.
이 강의의 일부는 아직 번역되지 않았으며 영어로 표시됩니다.
Beyond Messages
Great chat apps do more than deliver messages. Typing indicators and online presence make conversations feel live and responsive.
This lesson adds both features on top of your existing STOMP chat.
What Is Presence?
Presence tells users who is currently online, away, or offline. It is updated in real time as users connect and disconnect, giving the social cue that someone is available to chat.
Tracking Connections
Spring publishes SessionConnectedEvent and SessionDisconnectEvent. Listen for them to maintain a live set of online users.
@EventListener
public void onConnect(SessionConnectedEvent event) {
String user = userFrom(event);
onlineUsers.add(user);
broadcastPresence(user, 'ONLINE');
}Handling Disconnects
When a user disconnects, remove them and notify others so the presence list stays accurate.
@EventListener
public void onDisconnect(SessionDisconnectEvent event) {
String user = userFrom(event);
onlineUsers.remove(user);
broadcastPresence(user, 'OFFLINE');
}Broadcasting Presence
Send presence updates to a shared topic so every connected client can update its UI.
private void broadcastPresence(String user, String status) {
Map<String, String> event = new HashMap<>();
event.put('user', user);
event.put('status', status);
messagingTemplate.convertAndSend('/topic/presence', event);
}A Typing Event Model
Typing indicators are lightweight events, not stored messages. Define a small payload carrying the sender, the room, and whether they started or stopped typing.
{
"type": "TYPING",
"room": "general",
"sender": "alice",
"typing": true
}Receiving Typing Events
Map a destination for typing events and relay them to the room topic without persisting them.
@MessageMapping('/chat.typing')
public void typing(TypingEvent event) {
messagingTemplate.convertAndSend(
'/topic/room.' + event.getRoom() + '.typing', event);
}Debouncing on the Client
Clients should not send a typing event for every keystroke. Debounce: send 'typing' once, then send 'stopped' after a short idle period. This reduces traffic dramatically.
let timer = null;
function onKeyPress() {
sendTyping(true);
clearTimeout(timer);
timer = setTimeout(function () { sendTyping(false); }, 2000);
}Heartbeats for Stale Sessions
Network drops do not always fire a disconnect event. Use STOMP heartbeats so the server can detect dead connections and mark those users offline, keeping presence accurate.
Scaling Presence
With multiple server instances, presence must be shared. Store online users in a central store like Redis and broadcast changes across instances so every client sees a consistent presence list.
Privacy Considerations
Presence and typing reveal user activity. Let users control visibility, and only share presence with people who should see it (for example, contacts or members of the same room), not everyone on the server.
Quick Check
Test your understanding of presence and typing indicators.
Recap
You learned to add online presence using Spring's session connect and disconnect events and typing indicators as lightweight, non-persisted STOMP events. Debouncing, heartbeats, a shared store for scaling, and privacy controls make these features production-ready.
AI 튜터와 함께 WebSockets & Real-Time Systems with Spring을(를) 배우세요 — 무료
브라우저에서 실제 코드를 작성하고 실행하며, 24/7 AI 튜터로부터 즉각적인 도움을 받고, 웹이나 앱에서 중단한 부분부터 계속 학습하세요.
- 코스
- 12
- 레슨
- 48
자주 묻는 질문
“입력 중 표시 및 온라인 상태” 강의는 무료인가요?
네 — “입력 중 표시 및 온라인 상태” 전체 내용을 이 웹사이트에서 무료로 읽을 수 있습니다. 인터랙티브하게 실습하려면(내장 코드 에디터와 24/7 AI 튜터), CoddyKit PRO로 업그레이드하면 WebSockets & Real-Time Systems with Spring 강의 전체를 잠금 해제할 수 있습니다. WebSockets & Real-Time Systems with Spring 강의에는 총 4개의 강의가 포함되어 있습니다.
“입력 중 표시 및 온라인 상태”에서 뭘 배우나요?
Spring에서 STOMP 이벤트, 하트비트, 상태 추적을 사용해 채팅 앱에 실시간 입력 중 표시와 온라인 상태를 추가하는 방법을 익혀 보세요. 브라우저에서 직접 실행하는 실습 코드로 WebSockets & Real-Time Systems with Spring을(를) 배우며, 24/7 AI 튜터가 강의를 진행하면서 질문에 답변해줍니다.
WebSockets & Real-Time Systems with Spring을(를) 시작하는 데 경험이 필요한가요?
사전 경험은 필요하지 않습니다. CoddyKit의 WebSockets & Real-Time Systems with Spring은(는) 초급자부터 고급 학습자까지를 위해 구성되어 있으므로, 여기서 시작하거나 처음부터 시작할 수 있으며 자신의 속도대로 진행할 수 있습니다. 이것은 4개 중 4번째 강의입니다.
“입력 중 표시 및 온라인 상태” 강의는 얼마나 걸리나요?
대부분의 CoddyKit 강의는 약 5~10분이 소요됩니다. 각 강의는 간결하고 인터랙티브하여 꾸준한 진행이 가능하며, 웹과 앱에서 중단한 부분부터 바로 시작할 수 있습니다.
이 WebSockets & Real-Time Systems with Spring 강의에서 코드를 작성하고 실행할 수 있나요?
네. 모든 WebSockets & Real-Time Systems with Spring 강의에는 내장 코드 에디터가 포함되어 있으므로, 브라우저에서 바로 실제 코드를 작성하고 실행한 후 즉시 AI 피드백을 받을 수 있습니다 — 로컬 설정이 필요 없습니다.
이 강의의 모든 강의
- 채팅 메시지 모델 설계
- 공개 채팅방 구현
- STOMP를 사용한 비공개 메시징
- 입력 중 표시 및 온라인 상태