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 비고편집
| 과정 | 설명 | 비고 |
|---|---|---|
| runserver | 어째서인지 비동기 기능을 사용하면 runserver가 느려진다.
일반적인 개발환경에서 asgi를 계속 사용할 필요는 없으니, 다음의 코드로 실행하는 편이 좋다. |
python manage.py runserver --noasgi |
"장고 웹소켓" 분류에 속하는 문서
다음은 이 분류에 속하는 문서 3개 가운데 3개입니다.