feat: async load

.gitignore

@@ -1,3 +1,4 @@
 .history/
 .vscode/
 __pycache__/
+keys/

main.py

@@ -212,28 +212,27 @@ async def chat_stream(data = Depends(validate_token)):
         chunk_size = 1024
         chunk_body = ""
         total_tokens = 0
-        yield json.dumps({"type": "role", "role": "assistant"})
+        yield '{"type": "role", "role": "assistant", "content": "'
         for chunk in response:
+            
             delta = chunk["choices"][0]["delta"]
-            total_tokens += 1
-            if "content" not in delta: continue
+            if chunk["choices"][0]["finish_reason"] != "stop":
+                total_tokens += 1
+                if "content" not in delta: continue
 
-            chunk_body += delta["content"]
-            # if "``" not in chunk_body:
-            #     chunk_body = re.sub(r'`([^`]+)`', r'<b>\1</b>', chunk_body)
+                chunk_body += delta["content"]
+                if "``" not in chunk_body and "`" in chunk_body:
+                    chunk_body = re.sub(r'`([^`]+)`', r'<b>\1</b>', chunk_body)
 
-            if len(chunk_body) < chunk_size:
-                continue
+                if len(chunk_body) < chunk_size:
+                    continue
 
-            
             if "`" in chunk_body:
                 try:
                     chunk_body += next(response)["choices"][0]["delta"]["content"]
                 except StopIteration as e:
                     pass
 
-
-                
             if "``" in chunk_body:
                 while not re.findall(r'(```[^`]+```)', chunk_body):
                     try:
@@ -242,16 +241,12 @@ async def chat_stream(data = Depends(validate_token)):
                         break
                 
                 codigo = re.findall(r'(```[^`]+```)', chunk_body)[0]
-                print("codigo:", codigo)
                 chunk_body = chunk_body.replace(codigo, procesar_codigo(codigo))
                 
-                
-            #chunk_body = re.sub(r'`([^`]+)`', r'<b>\1</b>', chunk_body)
-
-            yield json.dumps({"type": "content", "content": chunk_body})
+            yield json.dumps(chunk_body)[1:-1]
             chunk_body = ""
 
-        yield json.dumps({"type": "config", "token": token, "config":config, "tokens":total_tokens})
+        yield f'", "token": "{token}", ' + '"config":' + json.dumps(config) +', ' + f'"tokens":{total_tokens}' +'}'
             
-    return StreamingResponse(__streamer())
+    return StreamingResponse(__streamer(), media_type="application/json")
     

static/js/main.js

@@ -5,7 +5,7 @@ let config = {
     temperature: 1.0,
     frequency_penalty: 0.0,
     presence_penalty: 0.0,
-    stream: false
+    stream: true
 } 
 $(document).ready(function() {
 
@@ -27,7 +27,7 @@ $(document).ready(function() {
     $("#input-text").keypress(function(event){
         if (!event.shiftKey && event.keyCode === 13) {
             event.preventDefault();
-            if(stream){
+            if(config.stream){
                 sendMessageStream();
             }else{
                 sendMessage();
@@ -38,7 +38,7 @@ $(document).ready(function() {
 
     $("#input-send").click(function(event) {
         event.preventDefault();
-        if(stream){
+        if(config.stream){
             sendMessageStream();
         }else{
             sendMessage();
@@ -53,7 +53,7 @@ $(document).ready(function() {
             temperature: 1.0,
             frequency_penalty: 0.0,
             presence_penalty: 0.0,
-            stream: false
+            stream: true
         } 
         $("#input-text").val("");
         recaularTextbox();
@@ -193,16 +193,16 @@ function sendMessage() {
             config: config
         }),
         success: function(data) {
-            token = data.token;
             let clone = template.clone();
             clone.find("div p").html(data.messages.slice(-1)[0].content);
             clone.removeAttr("id");
             chatbox.append(clone);
             chatbox.scrollTop(chatbox[0].scrollHeight);
-
+            
             $("button").prop("disabled", false);
             $("#input-text").prop("disabled", false);
-
+            
+            token = data.token;
             messages = data.messages;
             localStorage.setItem("messages", JSON.stringify(messages));
             Prism.highlightAll();
@@ -258,6 +258,10 @@ function sendMessageStream(){
     chatbox.scrollTop(chatbox[0].scrollHeight);
     messages.push({role:"user", content:message});
 
+    clone = template.clone();
+    clone.removeAttr("id");
+    clone.find("div p").html("Cargando...");
+    chatbox.append(clone);
 
     fetch("/chat_stream", {
             method: "POST",
@@ -271,13 +275,7 @@ function sendMessageStream(){
             }
     })
     .then(response => {
-        //Verifica el código de estado de la respuesta
-        let clone = template.clone();
-        clone.removeAttr("id");
-        clone.find("div p").html("Cargando...");
-        chatbox.append(clone);
-        chatbox.scrollTop(chatbox[0].scrollHeight);
-
+        
         if (response.status !== 200) {
             switch (response.status) {
                 case 404:
@@ -286,7 +284,6 @@ function sendMessageStream(){
                     break;
                 case 408:
                     clone.find("div p").html(response);
-                    console.log(response)
                     clone.addClass("warning");
                     messages.pop();
                     $("button").prop("disabled", false);
@@ -298,47 +295,42 @@ function sendMessageStream(){
                     clone.addClass("error");
                     break;
             }
-            chatbox.append(clone);
             chatbox.scrollTop(chatbox[0].scrollHeight);
             return false
         }
-        // console.log("response")
-        // console.log(response)
-        // response.headers.forEach((value,key) => console.log("header:",key,value))
-        // console.log("------")
-        //Obtiene el objeto de lectura de la respuesta
+        console.log("response")
+        console.log(response)
+        response.headers.forEach((value,key) => console.log("header:",key,value))
+        console.log("------")
+
         let reader = response.body.getReader();
         let decoder = new TextDecoder();
-        let outdata = "";
         return readChunk();
 
-        function readChunk() {
+        function readChunk(data="") {
             return reader.read().then( result => {
                 if (!result.done) {
-                    let chunk = JSON.parse(decoder.decode(result.value))
-                    // console.log('got chunk of', chunk.length, 'bytes')
-                    // console.log(chunk);
-                    // console.log("*******")
-                    // console.log('recursing')
-                    if(chunk.type == "content"){
-                        outdata += chunk.content;
-                        clone.find("div p").html(outdata);
-                        chatbox.scrollTop(chatbox[0].scrollHeight);
-                        Prism.highlightAll();
-                    }else if(chunk.type == "config"){
-                        token = chunk.token ;
-                    }
-                    return readChunk();
-
+                    let chunk = decoder.decode(result.value)
+                    console.log('got chunk of', chunk.length, 'bytes')
+                    console.log(chunk);
+                    console.log("*******")
+                    console.log('recursing')
+                    data += chunk;
+                    return readChunk(data);
                 } else {
-                    messages.push({role:"user", content:outdata});
+                    data = JSON.parse(data);
+                    clone.find("div p").html(data.content);
                     chatbox.scrollTop(chatbox[0].scrollHeight);
+            
                     $("button").prop("disabled", false);
                     $("#input-text").prop("disabled", false);
-                    $("#input-text").focus();
-                    
-                    // console.log('end')
                     
+                    token = data.token;
+                    messages.push({role: data.role, content: data.content}) ;
+                    localStorage.setItem("messages", JSON.stringify(messages));
+                    Prism.highlightAll();
+                    $("#input-text").focus();
+                    return data;
                 }
             });
         }
@@ -351,5 +343,6 @@ function sendMessageStream(){
         chatbox.append(clone);
         chatbox.scrollTop(chatbox[0].scrollHeight);
         console.log('Error: ', error);
+        return false
     });
 }