【即时通讯】轮询方式实现

技术栈

• LayUI、jQuery实现前端效果。
• django4.2、django-ninja实现后端接口。
  代码仓 - 后端
  代码仓 - 前端

实现功能

• 首次访问页面并发送消息时需要设置昵称
• 发送内容为空时要提示用户不能发送空消息
• 前端定时获取消息，然后展示在页面上。

效果展示

• 首次发送需要设置昵称
  
• 发送消息与消息展示
  
• 提示用户不能发送空消息
  

后端接口

• 发送消息

DB = []
@router.post("/poll/send/message")
def send_message_api(request: WSGIRequest, message: MessageSchema) -> JsonResponse:"""轮询通讯接收消息接口:param request: WSGIRequest:param message: MessageSchema:return: JsonResponse"""message_info = message.dict()DB.append(message_info)return JsonResponse({"ok": True})

• 获取消息

@router.get("/poll/get/messages")
def get_messages_api(request: WSGIRequest, startIndex: int) -> JsonResponse:"""轮询通讯获取消息接口:param request: WSGIRequest:param startIndex: int 上次获取聊天记录的最后位置"""context = {"data": DB[startIndex:],"maxIndex": len(DB)}return JsonResponse(context)