codestates / codestates/luca

[Error Handling] 웹 소켓 중복 렌더링

Open
#85 0 comments 0 reactions 1 assignee Claimed by @QuatoHub View on GitHub
Bug
Dominant language
JavaScript
Stars
3
Forks
2
PR merge metrics
No merged PRs in 30d

Description

# 어떤 에러인가요?
- 서버에서 보낸 데이터를 클라이언트에서 렌더링하는 과정에서 2번, 4번, 8번, ... 중복된 액션이 발생했다.
# 에러 메시지
```
별도의 메시지 없음
```
# 에러 핸들링 방법
- useEffect을 사용하여 추가적인 리스너가 등록되는 것을 방지하면 정상적으로 한번만 렌더링이 된다.
```js
// 카드를 추가한다.
const createCard = () => {
socket.emit("createCard", userId, "data", roomName);
}
// 배열이 업데이트될 때마다 계속해서 추가로 리스너가 등록되는 것을 방지하기 위해 useEffect 사용)
useEffect(() => {
socket.on("createCard", (data) => {
dispatch(setCardList(data));
console.log(data);
});
}, [])
```
# 에러 핸들링을 위해 참고한 레퍼런스 링크
[[Node.js] 웹 소켓으로 실시간 랜덤 채팅 구현 중 메시지 중복 버그 해결과정](https://im-developer.tistory.com/170)

Contributor guide

No contributing guide indexed for this repository

Assessment

This issue has not been assessed yet.

Get new issues in your inbox

A short digest of beginner-friendly GitHub issues.