时间戳

首页 > 解决方案 > Python http.server 没有响应客户端

javascript - Python http.server 没有响应客户端

问题描述

我正在使用 python 模块 http.server 作为服务器创建一个聊天项目，在客户端我使用 jquery ajax 发送和接收消息......但重要的是客户端能够向服务器发送消息并且服务器正在接收消息（使用打印语句检查）但是当它再次将消息返回给所有客户端时，我认为服务器没有将消息响应给客户端。我没有得到代码有什么问题。如果您发现错误将有很大帮助...

from http.server import BaseHTTPRequestHandler,HTTPServer,ThreadingHTTPServer
import json

class handler(BaseHTTPRequestHandler):
    def do_GET(self):
        
        self.send_response(200)
        self.send_header("Access-Control-Allow-Origin","*")
        self.send_header('Content-type','text/html')
        self.end_headers()

        #just trying
        message = {"room4":1,"room5":1,"room6":1}
        self.wfile.write(json.dumps(message).encode())
    def do_POST(self):
        content_length = int(self.headers['Content-Length'])
        body = self.rfile.read(content_length)
        if content_length:
            data=json.loads(body.decode())
            
            keys=list(data.keys())
            if keys[0]=="message":
                self.send_response(200)
                self.send_header("Access-Control-Allow-Origin","*")
                self.send_header('Content-type','text/html')
                self.send_header('Cache-Control', 'no-store')
                self.end_headers()
                message = {"welcome_msg":"success"}
                print("Data:",data)
                self.wfile.write(json.dumps(message).encode())
            else:
                self.send_response(200)
                self.send_header("Access-Control-Allow-Origin","*")
                self.send_header('Content-type','text/html')
                self.send_header('Cache-Control', 'no-store')
                self.end_headers()
serv=HTTPServer(("localhost",9889),handler)
serv.serve_forever()

javascript代码：

$(document).ready(function(){
    
    load();
    var entereddata;
    $("#submitbtn").click(function(){
        var d=new Date()
        var t=d.getTime()
        var time = d.toLocaleTimeString();
        entereddata=$("#msgarea").val()
        $("#chat").append("<div id='msg' style='background-color:#dcf8c6;padding:5px 10px; border-radius:5px;margin-bottom:8px;width:fit-content' class='container_new' style='margin-left:200px;'>"+"You: "+entereddata+"<p class='time-right'>&emsp;"+time+"</p>"+"</div>")
        //var element = document.getElementById("msgarea");
        //window.scrollTo(0,document.body.scrollHeight-element.clientHeight);
        $.post("http://localhost:9889/",JSON.stringify({
            "message":entereddata,
            "port":location.port,
            })
        )
    })

    function load(){
        //console.log("hhh")
        $.post("http://localhost:9889/",JSON.stringify({
            "port":location.port,
            }),function(data,status){
                console.log("ds")
                console.log(data)
                
            }
        )
    }
    setInterval(load,1000)
    
})

html代码：

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Document</title>
    <script src="https://ajax.googleapis.com/ajax/libs/jquery/3.5.1/jquery.min.js"></script>
    <script src="test.js"></script>
    <style>
        body {
          margin: 0;
          overflow:hidden;
        }
        #chat{
          height:88vh;
          overflow:hidden;
          padding: 10px;;
        }
        .container_new {
          border: 2px solid #dedede;
          background-color: #f1f1f1;
          border-radius: 5px;
          padding: 10px;
          margin: 10px 0;
        }
        
        .darker {
          border-color: #ccc;
          background-color: #ddd;
        }
        
        .container::after {
          content: "";
          clear: both;
          display: table;
        }
        
        .container img {
          float: left;
          max-width: 60px;
          width: 100%;
          margin-right: 20px;
          border-radius: 50%;
        }
        
        .container img.right {
          float: right;
          margin-left: 20px;
          margin-right:0;
        }
        
        .time-right {
          float: right;
          color: #aaa;
        }
        
        .time-left {
          float: left;
          color: #999;
        }
        #form{
          display: flex;
        }
        input{
          font-size:1.2rem;
          padding:10px;
          margin:10px 5px;
          appearance:none;
          border: 1px solid #ccc;
          border-radius: 5px;
        }
        #msgarea{
          flex:2
        }
        #msg{
          background-color: #dcf8c6;
          padding:5px 10px;
          border-radius: 5px;
          margin-bottom: 8px;
        }
        </style>
    <link rel="stylesheet" href="bootstrap.min.css">
</head>
<body id="bod">
    <h2 id="head2"></h2>
    <div class="container-fluid " id="chat"> 
    </div>
    <div id="form">
        <input autofocus  placeholder="Enter Message..." name="" id="msgarea" ></input>
        <input type="button" id="submitbtn" value="Send">
    </div>  
    
</body>
</html>

谢谢

标签： javascriptpythonjqueryajax

解决方案

推荐阅读