fixing websocket

main.py

@@ -21,8 +21,6 @@ import re
 import urllib.request
 from fastapi.responses import FileResponse
 from websocket import create_connection
-import asyncio
-import websockets
 from fastapi.middleware.cors import CORSMiddleware
 import dataset
 from datetime import datetime
@@ -64,6 +62,7 @@ class request(BaseModel):
     text_content: List[str]
     image_urls: List[str]
     avatar: str
+    client_id :str
 
 
 class ConnectionManager:
@@ -158,38 +157,21 @@ async def make_anchor_video_v2(req:request):
     time_stamp = datetime.fromtimestamp(time.time())
     time_stamp = time_stamp.strftime("%Y-%m-%d %H:%M:%S")
     pk = log_table.insert({'name':req.name,'text_content':txt_content_seperate_by_dot,'image_urls':img_urls_seperate_by_dot,'timestamp':time_stamp})
-    x = threading.Thread(target=anchor_video_v2, args=(req.name, req.text_content, req.image_urls,int(req.avatar)))
+    x = threading.Thread(target=anchor_video_v2, args=(req.name, req.text_content, req.image_urls,int(req.avatar),client_id))
     x.start()
     return {"msg":"製作影片需要時間，請您耐心等候  稍後可以在www.choozmo.com:8168/"+req.name+".mp4 中觀看"} 
 
-@app.post("/make_anchor_video_v33")
-async def make_anchor_video_v33(req:request):
-    db = dataset.connect('mysql://choozmo:pAssw0rd@db.ptt.cx:3306/AI_anchor?charset=utf8mb4')
-    log_table = db['history_input']
-    txt_content_seperate_by_dot = ''
-    for txt in req.text_content:
-        txt_content_seperate_by_dot += txt+","
-    txt_content_seperate_by_dot = txt_content_seperate_by_dot[:-1]
-    img_urls_seperate_by_dot = ''
-    for iurl in req.image_urls:
-        img_urls_seperate_by_dot += iurl+","
-    img_urls_seperate_by_dot = img_urls_seperate_by_dot[:-1]
-    time_stamp = datetime.fromtimestamp(time.time())
-    time_stamp = time_stamp.strftime("%Y-%m-%d %H:%M:%S")
-    pk = log_table.insert({'name':req.name,'text_content':txt_content_seperate_by_dot,'image_urls':img_urls_seperate_by_dot,'timestamp':time_stamp})
-    x = threading.Thread(target=anchor_video_v3333, args=(req.name, req.text_content, req.image_urls))
-    x.start()
-    return {"msg":"製作影片需要時間，請您耐心等候  稍後可以在www.choozmo.com:8168/"+req.name+".mp4 中觀看"} 
 manager = ConnectionManager()
-@app.websocket("/progress")
-async def websocket_endpoint(websocket: WebSocket):
+@app.websocket("/progress/{client_id}")
+async def websocket_endpoint(websocket: WebSocket, client_id: int):
     await manager.connect(websocket)
     try:
         while True:
             data = await websocket.receive_text()
-            await manager.broadcast(data)
+            await manager.send_personal_message(f"You wrote: {data}", websocket)
     except WebSocketDisconnect:
         manager.disconnect(websocket)
+        
 
 @app.get("/history_input")
 async def history_input():
@@ -490,40 +472,31 @@ def generate_subtitle_image(name_hash,text_content):
             img_list[idx]+=[{"count":len(sub),"path":sv_path}]
     return img_list
 
+def sendProgress(progress,client_id):
+    ws = create_connection("ws://www.choozmo.com:8888/progress/"+client_id)
+    ws.send(progress)
+    ws.close()
 
-
-
-
-async def hello(uri):
-    async with websockets.connect(uri) as websocket:
-        await websocket.send(100)
-        print(f"(client) send to server: Jimmy")
-        name = await websocket.recv()
-        print(f"(client) recv from server {name}")
-
-#asyncio.get_event_loop().run_until_complete(
-#    hello('ws://www.choozmo.com:8888/progress'))
-
-def anchor_video_v2(name,text_content, image_urls,avatar):
-    asyncio.get_event_loop().run_until_complete(
-    hello('ws://www.choozmo.com:8888/progress'))
+def anchor_video_v2(name,text_content, image_urls,avatar,client_id):
+    
     progress = 0
+    sendProgress(progress,client_id)
     name_hash = str(time.time()).replace('.','')
     
     print('sub image made')
     file_prepare_v2(name, name_hash, text_content,image_urls)
     progress = 10
-    #await manager.broadcast(progress)
+    sendProgress(progress,client_id)
     sub_list=generate_subtitle_image(name_hash,text_content)
     progress = 20
-    #await manager.broadcast(progress)
+    sendProgress(progress,client_id)
     
     progress_per_video = int(40/len(text_content))
     for fname in range(len(text_content)):
         call_achor_video_v2(name_hash+"/"+str(fname),avatar)
         progress += progress_per_video
         print('step finish')
-        #await manager.broadcast(progress)
+        sendProgress(progress,client_id)
     print('called............................................')
 
     ck=cKey(0,254,0,270)
@@ -608,7 +581,7 @@ def anchor_video_v2(name,text_content, image_urls,avatar):
         idx+=1
 
     progress+=10
-    #await manager.broadcast(progress)
+    sendProgress(progress,client_id)
     
     LOGO_ED = openshot.FFmpegReader(dir_video+"LOGO_ED.avi")
     LOGO_ED.Open()
@@ -659,7 +632,7 @@ def anchor_video_v2(name,text_content, image_urls,avatar):
         f=t.GetFrame(n)
         w.WriteFrame(f)
     progress = 100
-    #await manager.broadcast(progress)
+    sendProgress(progress,client_id)
     notify_group(name+"的影片已經產生完成囉! www.choozmo.com:8168/"+name_hash+".mp4")
     t.Close()
     w.Close()

script_msg.js

@@ -96,16 +96,11 @@ var myModal = new bootstrap.Modal(document.getElementById('history'), {
       
     }
 
-	var ws = new WebSocket('ws://www.choozmo.com:8888/progress');
-          ws.onmessage = function(event) {
-              console.log(event.data);
+    var client_id = Date.now()
+            var ws = new WebSocket(`ws://www.choozmo.com:8888/progress/${client_id}`);
+            ws.onmessage = function(event) {
               var elem = document.getElementById("myBar");
               elem.style.width = event.data + "%";
               elem.innerHTML = event.data  + "%";
-          };
-          function sendMessage(event) {
-              var input = document.getElementById("messageText")
-              ws.send(input.value)
-              input.value = ''
-              event.preventDefault()
-          }
+            };
+