1 개요
웹소켓의 역사적 맥락은 다음 글을 참고하자. HTTP에서부터 WEBSOCKET까지
2 작동방식
2.1 처음 접속
| 과정 | 설명 | 비고 |
|---|---|---|
| 웹소켓 생성 | 자바스크립트에서 웹소켓을 생성한다. | const ws = new WebSocket(SOCKET_HOST + `/ws/users/`);
|
| 신호 전달 | /ws로 시작하는 요청은 asgi > routing을 거쳐 컨슈머의 connect()에 전달된다.
|
|
| 컨슈머
connect() |
인증과정을 거쳐 해당 유저를 적절한 그룹, 레이어에 속하게 한다. |
2.2 메시지 전달
| 과정 | 설명 | 비고 |
|---|---|---|
| 컨슈머
receive() |
자바스크립트에서 웹소켓을 통해 전동한 메시지를 받는다. | async def receive(self, text_data):
text_data_json = json.loads(text_data) # 받은 객체를 변환해야 한다.
message = text_data_json['message']
|
| 장고에서 프론트로 전송 | # 현재 소켓으로 접속한 유저에게 전송
await self.send(text_data=json.dumps({
'message': message,
}))
# 현재 소켓으로 접속한 유저와 그가 속한 층에 전송
await self.channel_layer.group_send(
self.room_group_name,
{
'type': 'chat_message',
'message': message,
}
)
|
2.3 웹소켓 종료
| 과정 | 설명 | 비고 |
|---|---|---|
| 컨슈머
disconnect() |
웹소켓 종료 신호를 받으면 응답받는 메소드.
ws.onclose = function (e) {
console.log(e)
notification.open({
message: "채팅이 종료되었습니다.",
description: "새로운 채팅을 시작하세요",
icon: <CloseCircleOutlined style={{ color: "red" }} />,
});
};
|
django에서 프론트쪽으로 종료신호를 보내고 싶다면 self.close() 메소드
await self.channel_layer.group_send(
GROUP_NAME,
{
'type': 'websocket.close',
}
)
|
"장고 웹소켓" 분류에 속하는 문서
다음은 이 분류에 속하는 문서 3개 가운데 3개입니다.