From 4eb39a55ad1e9771fb63a6a94501bd1761e3e158 Mon Sep 17 00:00:00 2001
From: arthuridea w <2337583+arthuridea@users.noreply.github.com>
Date: Tue, 19 Mar 2024 16:14:47 +0800
Subject: [PATCH] feat:add frontier page SSE support.

---
 src/LLMServiceHub/Pages/Index.cshtml      |   9 +-
 src/LLMServiceHub/bundleconfig.json       |   6 +
 src/LLMServiceHub/package-lock.json       |  72 +---
 src/LLMServiceHub/package.json            |   4 +
 src/LLMServiceHub/wwwroot/js/index.js     | 204 +++++++---
 src/LLMServiceHub/wwwroot/js/index.min.js |  11 +-
 src/LLMServiceHub/wwwroot/js/sse.js       | 434 ++++++++++++++++++++++
 src/LLMServiceHub/wwwroot/js/sse.min.js   |   1 +
 8 files changed, 619 insertions(+), 122 deletions(-)
 create mode 100644 src/LLMServiceHub/wwwroot/js/sse.js
 create mode 100644 src/LLMServiceHub/wwwroot/js/sse.min.js

diff --git a/src/LLMServiceHub/Pages/Index.cshtml b/src/LLMServiceHub/Pages/Index.cshtml
index 7738b25..afe68a8 100644
--- a/src/LLMServiceHub/Pages/Index.cshtml
+++ b/src/LLMServiceHub/Pages/Index.cshtml
@@ -42,6 +42,12 @@
         }
         .llm-model-config{font-size:0.8rem;color:darkgoldenrod;}
         .btn-icon-center svg{margin-right:0 !important;}
+
+
+        ::-webkit-scrollbar { width: 8px; height: 8px; }
+        ::-webkit-scrollbar-track { border-radius: 10px !important; margin-block: 5px; }
+        ::-webkit-scrollbar-thumb { border-radius: 10px !important; }
+        * { scrollbar-width: thin; }
     </style>
 }
 
@@ -188,7 +194,7 @@
                         <div class="card m-0 me-2 ms-2">
                             <div class="card-body p-2">
                                 <div class="input-group input-group-flat">
-                                    <textarea id="ipt-message" type="text" class="form-control vh-10" autocomplete="off" rows="3" placeholder="输入要发送的消息，按“回车键”发送"></textarea>
+                                    <textarea id="ipt-message" type="text" class="form-control vh-10" autocomplete="off" rows="3" placeholder="输入要发送的消息，按“Ctrl + 回车键”发送"></textarea>
                                     <span class="input-group-text">
                                         <div class="dropup-center dropup">
                                             <a href="#" class="btn-icon-center link-secondary btn btn-link pt-2 pb-2" data-bs-toggle="dropdown" data-bs-auto-close="outside">
@@ -399,6 +405,7 @@
 
     @if (User.Identity.IsAuthenticated)
     {
+        <script src="~/js/sse.js" asp-append-version="true" ></script>
         <script src="~/lib/marked/marked.min.js"></script>
         <script src="~/lib/easy-typer-js/easy-typer-min.js"></script>
         <script>
diff --git a/src/LLMServiceHub/bundleconfig.json b/src/LLMServiceHub/bundleconfig.json
index a8c7969..cbba524 100644
--- a/src/LLMServiceHub/bundleconfig.json
+++ b/src/LLMServiceHub/bundleconfig.json
@@ -5,6 +5,12 @@
       "wwwroot/js/index.js"
     ]
   },
+  {
+    "outputFileName": "wwwroot/js/sse.min.js",
+    "inputFiles": [
+      "wwwroot/js/sse.js"
+    ]
+  },
   {
     "outputFileName": "wwwroot/js/paint.min.js",
     "inputFiles": [
diff --git a/src/LLMServiceHub/package-lock.json b/src/LLMServiceHub/package-lock.json
index f233dd6..8c6c5ca 100644
--- a/src/LLMServiceHub/package-lock.json
+++ b/src/LLMServiceHub/package-lock.json
@@ -3575,18 +3575,6 @@
         "url": "https://github.com/sponsors/sindresorhus"
       }
     },
-    "node_modules/eslint/node_modules/glob-parent": {
-      "version": "6.0.2",
-      "resolved": "https://registry.npmjs.org/glob-parent/-/glob-parent-6.0.2.tgz",
-      "integrity": "sha512-XxwI8EOhVQgWp6iDL+3b0r86f4d6AX6zSU55HfB4ydCEuXLXc5FcYeOu+nnGftS4TEju/11rt4KJPTMgbfmv4A==",
-      "dev": true,
-      "dependencies": {
-        "is-glob": "^4.0.3"
-      },
-      "engines": {
-        "node": ">=10.13.0"
-      }
-    },
     "node_modules/eslint/node_modules/globals": {
       "version": "13.24.0",
       "resolved": "https://registry.npmjs.org/globals/-/globals-13.24.0.tgz",
@@ -4341,15 +4329,15 @@
       }
     },
     "node_modules/glob-parent": {
-      "version": "5.1.2",
-      "resolved": "https://registry.npmjs.org/glob-parent/-/glob-parent-5.1.2.tgz",
-      "integrity": "sha512-AOIgSQCepiJYwP3ARnGx+5VnTu2HBYdzbGP45eLw1vr3zB3vZLeyed1sC9hnbcOc9/SrMyM5RPQrkGz4aS9Zow==",
+      "version": "6.0.2",
+      "resolved": "https://registry.npmjs.org/glob-parent/-/glob-parent-6.0.2.tgz",
+      "integrity": "sha512-XxwI8EOhVQgWp6iDL+3b0r86f4d6AX6zSU55HfB4ydCEuXLXc5FcYeOu+nnGftS4TEju/11rt4KJPTMgbfmv4A==",
       "dev": true,
       "dependencies": {
-        "is-glob": "^4.0.1"
+        "is-glob": "^4.0.3"
       },
       "engines": {
-        "node": ">= 6"
+        "node": ">=10.13.0"
       }
     },
     "node_modules/glob-stream": {
@@ -4373,28 +4361,6 @@
         "node": ">= 0.10"
       }
     },
-    "node_modules/glob-stream/node_modules/glob-parent": {
-      "version": "3.1.0",
-      "resolved": "https://registry.npmjs.org/glob-parent/-/glob-parent-3.1.0.tgz",
-      "integrity": "sha512-E8Ak/2+dZY6fnzlR7+ueWvhsH1SjHr4jjss4YS/h4py44jY9MhK/VFdaZJAWDz6BbL21KeteKxFSFpq8OS5gVA==",
-      "dev": true,
-      "dependencies": {
-        "is-glob": "^3.1.0",
-        "path-dirname": "^1.0.0"
-      }
-    },
-    "node_modules/glob-stream/node_modules/is-glob": {
-      "version": "3.1.0",
-      "resolved": "https://registry.npmjs.org/is-glob/-/is-glob-3.1.0.tgz",
-      "integrity": "sha512-UFpDDrPgM6qpnFNI+rh/p3bUaq9hKLZN8bMUWzxmcnZVS3omf4IPK+BrewlnWjO1WmUsMYuSjKh4UJuV4+Lqmw==",
-      "dev": true,
-      "dependencies": {
-        "is-extglob": "^2.1.0"
-      },
-      "engines": {
-        "node": ">=0.10.0"
-      }
-    },
     "node_modules/glob-watcher": {
       "version": "5.0.5",
       "resolved": "https://registry.npmjs.org/glob-watcher/-/glob-watcher-5.0.5.tgz",
@@ -4546,28 +4512,6 @@
         "node": ">= 4.0"
       }
     },
-    "node_modules/glob-watcher/node_modules/glob-parent": {
-      "version": "3.1.0",
-      "resolved": "https://registry.npmjs.org/glob-parent/-/glob-parent-3.1.0.tgz",
-      "integrity": "sha512-E8Ak/2+dZY6fnzlR7+ueWvhsH1SjHr4jjss4YS/h4py44jY9MhK/VFdaZJAWDz6BbL21KeteKxFSFpq8OS5gVA==",
-      "dev": true,
-      "dependencies": {
-        "is-glob": "^3.1.0",
-        "path-dirname": "^1.0.0"
-      }
-    },
-    "node_modules/glob-watcher/node_modules/glob-parent/node_modules/is-glob": {
-      "version": "3.1.0",
-      "resolved": "https://registry.npmjs.org/is-glob/-/is-glob-3.1.0.tgz",
-      "integrity": "sha512-UFpDDrPgM6qpnFNI+rh/p3bUaq9hKLZN8bMUWzxmcnZVS3omf4IPK+BrewlnWjO1WmUsMYuSjKh4UJuV4+Lqmw==",
-      "dev": true,
-      "dependencies": {
-        "is-extglob": "^2.1.0"
-      },
-      "engines": {
-        "node": ">=0.10.0"
-      }
-    },
     "node_modules/glob-watcher/node_modules/is-binary-path": {
       "version": "1.0.1",
       "resolved": "https://registry.npmjs.org/is-binary-path/-/is-binary-path-1.0.1.tgz",
@@ -6753,12 +6697,6 @@
         "node": ">=0.10.0"
       }
     },
-    "node_modules/path-dirname": {
-      "version": "1.0.2",
-      "resolved": "https://registry.npmjs.org/path-dirname/-/path-dirname-1.0.2.tgz",
-      "integrity": "sha512-ALzNPpyNq9AqXMBjeymIjFDAkAFH06mHJH/cSBHAgU0s4vfpBn6b2nf8tiRLvagKD8RbTpq2FKTBg7cl9l3c7Q==",
-      "dev": true
-    },
     "node_modules/path-exists": {
       "version": "4.0.0",
       "resolved": "https://registry.npmjs.org/path-exists/-/path-exists-4.0.0.tgz",
diff --git a/src/LLMServiceHub/package.json b/src/LLMServiceHub/package.json
index 471a420..64621f0 100644
--- a/src/LLMServiceHub/package.json
+++ b/src/LLMServiceHub/package.json
@@ -42,6 +42,10 @@
     "bootstrap": "5.3.1",
     "jquery": "^3.7.0"
   },
+  "overrides": {
+    "glob-parent": "6.0.2",
+    "urllib": "3.22.2"
+  },
   "repository": {
     "type": "git",
     "url": "git+https://github.com/arthuridea/NetCore.AIGC.git"
diff --git a/src/LLMServiceHub/wwwroot/js/index.js b/src/LLMServiceHub/wwwroot/js/index.js
index e52a71c..64bf7d5 100644
--- a/src/LLMServiceHub/wwwroot/js/index.js
+++ b/src/LLMServiceHub/wwwroot/js/index.js
@@ -26,6 +26,7 @@ function dateFormat(fmt, date) {
 
 
 //模型设置
+let useSSE = true;
 let m_t = 0.95;
 let m_tp = 0.8;
 let m_ps = 1.0;
@@ -44,7 +45,7 @@ let conversations = {
         "temperature": m_t || 0.95,
         "top_p": m_tp || 0.8,
         "penalty_score": m_ps || 1.0,
-        "stream": false,
+        "stream": useSSE,
         "conversation_id": "conv-turbo",
         "message": "",
         "model": 2,
@@ -54,17 +55,17 @@ let conversations = {
         "temperature": m_t || 0.95,
         "top_p": m_tp || 0.8,
         "penalty_score": m_ps || 1.0,
-        "stream": false,
         "conversation_id": "conv-3_5",
         "message": "",
         "model": 1,
+        "stream": useSSE,
         "user_id": "7ffe3194-2bf0-48ba-8dbd-e888d7d556d3"
     },
     ConvErnie4_0: {
         "temperature": m_t || 0.95,
         "top_p": m_tp || 0.8,
         "penalty_score": m_ps || 1.0,
-        "stream": false,
+        "stream": useSSE,
         "conversation_id": "conv-4_0",
         "message": "",
         "model": 3,
@@ -118,11 +119,11 @@ $('.btn-discard-llm-setting').on('click', function (e) {
 
 
 
-let sendBtnClickEventHandler = function (e) {
+let sendBtnClickEventHandler = async function (e) {
     let msg = $('#ipt-message').val();
     $('#ipt-message').val('');
     //console.log(msg);
-    $(Object.keys(conversations)).each(function (index, key) {
+    $(Object.keys(conversations)).each(async function (index, key) {
         console.log(`key->${key}`);
         var availableLLM = $('#chk-' + key).is(':checked');
         console.log(`MODEL: ${key} -> ${availableLLM}`);
@@ -135,7 +136,7 @@ let sendBtnClickEventHandler = function (e) {
         let wrapperId = "#wrapper_" + key;
         request.message = msg;
         if (_con_id[key] != '') {
-            console.log(`convid found: ${_con_id[key]}`)
+            console.log(`conversation_id found: ${_con_id[key]}`)
             request.conversation_id = _con_id[key];
         }
         else {
@@ -202,6 +203,7 @@ let sendBtnClickEventHandler = function (e) {
                                          </div>
                                          <div class="chat-bubble-body" id='reply_${replyId}'>
                                          </div>
+                                         <input type='hidden' id='reply_hid_${replyId}' value='' />
                                      </div>
                                  </div>
                              </div>
@@ -220,56 +222,160 @@ let sendBtnClickEventHandler = function (e) {
             console.log('sending request with:');
             console.log(request);
 
-            $.ajax(apiEndpoint, {
-                method: 'POST',
-                dataType: 'json',
-                contentType: 'application/json',
-                data: JSON.stringify(request)
-            }).done(function (data, status, xhr) {
-                console.log(data);
-                if (data) {
-                    $(`#reply_time_${replyId}`).html(dateFormat('HH:MM:SS', new Date()));
-                    var markdeownResult = data.aigc_message;
-                    const typing = new EasyTyper({
-                        output: '',
-                        isEnd: false,
-                        speed: 20,
-                        singleBack: false,
-                        sleep: 0,
-                        type: 'normal',
-                        backSpeed: 40,
-                        sentencePause: true,
-                    },
-                    marked.parse(markdeownResult),
-                    instance => {
-                        // 回调函数
-                        // 此回调一般用于获取新的数据然后循环输出
-                        // instance { 实例EasyTyper }
-                        //console.log(instance); // 打印出实例对象
-
-                        //var result = marked.parse(markdeownResult);
-                        //$('#reply_' + replyId).html(result);
-
-                    }, (output, instance) => {
-                        // 钩子函数
-                        // output { 当前帧的输出内容 }
-                        // instance { 实例EasyTyper }
-                        // 通过钩子函数动态更新dom元素
-                        $('#reply_' + replyId).html(`${output}`);
-
-                        let _scrollItem = $(wrapper).closest('.scrollable');
+            /*
+            if (!useSSE) {
+                // normal ajax request
+                $.ajax(apiEndpoint, {
+                    method: 'POST',
+                    dataType: 'json',
+                    contentType: 'application/json',
+                    data: JSON.stringify(request)
+                }).done(function (data, status, xhr) {
+                    console.log(data);
+                    if (data) {
+                        $(`#reply_time_${replyId}`).html(dateFormat('HH:MM:SS', new Date()));
+                        var markdeownResult = data.aigc_message;
+                        const typing = new EasyTyper({
+                            output: '',
+                            isEnd: false,
+                            speed: 20,
+                            singleBack: false,
+                            sleep: 0,
+                            type: 'normal',
+                            backSpeed: 40,
+                            sentencePause: true,
+                        },
+                            marked.parse(markdeownResult),
+                            instance => {
+                                // 回调函数
+                                // 此回调一般用于获取新的数据然后循环输出
+                                // instance { 实例EasyTyper }
+                                //console.log(instance); // 打印出实例对象
+
+                                //var result = marked.parse(markdeownResult);
+                                //$('#reply_' + replyId).html(result);
+
+                            }, (output, instance) => {
+                                // 钩子函数
+                                // output { 当前帧的输出内容 }
+                                // instance { 实例EasyTyper }
+                                // 通过钩子函数动态更新dom元素
+                                $('#reply_' + replyId).html(`${output}`);
+
+                                let _scrollItem = $(wrapper).closest('.scrollable');
+                                //console.log(_scrollItem);
+                                let scrollTopVal = $(_scrollItem).prop('scrollTop') + $('#reply_' + replyId).height();
+                                //console.log(scrollTopVal);
+                                $(_scrollItem).scrollTop(scrollTopVal);
+                            });
+                    }
+                })
+                    .fail(function (data, status, xhr) {
+                        console.log(data);
+                        $('#reply_' + replyId).html('发生错误');
+                    });
+            }
+            else {
+                
+            }
+            */
+
+            // sse request
+            var firstLineRecieved = false;
+            var chunktimeout = 120000;
+            var chunkQueue = [];
+            var curChunkIndex = 0;
+            var curCharIndex = 0;
+            var lastSentence = -1;
+            var chunkTimer = null;
+            var itv = 50;
+            var timeelapsed = 0;
+
+            var typeChunk = function () {
+                if (timeelapsed > chunktimeout) {
+                    //console.log(`timeout: ${timeelapsed}`);
+                    clearInterval(chunkTimer);
+                }
+                var curChunk = chunkQueue[curChunkIndex];
+                if (!curChunk) return;
+                var cur_sentence = curChunk.chunk || '';
+
+                if (lastSentence > 0 && ((curChunkIndex == lastSentence) || !cur_sentence)) {
+                    //console.log('>>>>>>>> end');
+                    clearInterval(chunkTimer);
+                    curChunkIndex = 0;
+                    return;
+                }
+                var sl = 0;
+                if (cur_sentence) {
+                    sl = cur_sentence.length || 0;
+                    var ch = cur_sentence[curCharIndex] || '';
+                    if (ch) {
+                        var reply = ($(`#reply_hid_${replyId}`).val() || '') + ch;
+                        $(`#reply_hid_${replyId}`).val(reply);
+                        $(`#reply_${replyId}`).html(marked.parse(reply));
+                        //$(`#reply_${replyId}`).html(reply);
+
+                        // set scroll position
+                        var _scrollItem = $(wrapper).closest('.scrollable');
                         //console.log(_scrollItem);
-                        let scrollTopVal = $(_scrollItem).prop('scrollTop') + $('#reply_' + replyId).height();
+                        var scrollTopVal = $(_scrollItem).prop('scrollTop') + $('#reply_' + replyId).height();
                         //console.log(scrollTopVal);
                         $(_scrollItem).scrollTop(scrollTopVal);
+                    }
+                }
+                curCharIndex++;
+                if (curCharIndex == sl) {
+                    //console.log(cur_sentence);
+                    //console.log(`[${curChunkIndex}][${curCharIndex}] | lastsentence: ${lastSentence}`);
+                    curCharIndex = 0;
+                    curChunkIndex++;
+                }
+                timeelapsed += itv;
+            };
+
+            EventSource = SSE;
+            var source = new SSE(apiEndpoint, {
+                headers: { 'Content-Type': 'application/json' },
+                payload: JSON.stringify(request),
+                withCredentials: true,
+                debug: false,
+                start: false,
+                method: 'POST'
+            });
+            //source.addEventListener('status', function (e) {
+            //    console.log('\n>>>>>>>>>>>>>>>[status]>>>>>>>>>>>>>>>>>>\n' + e.data);
+            //});
+            source.addEventListener('message', function (e) {
+                // Assuming we receive JSON-encoded data payloads:
+                var ret = useSSE ? e.data : e.source.chunk;
+                var data = JSON.parse(ret);
+                //console.log(`-------------${botId} message in ↓-------------`);
+                //console.log(data);
+                if (data) {
+                    var chunk = data.aigc_message;
+                    //chunkQueue.push(Array.from(chunk));
+                    chunkQueue.push({
+                        row: data.llm_response_data.sentence_id,
+                        chunk: chunk.split('')
                     });
+                    //markdownResult += chunk;
+
+                    if (!firstLineRecieved) {
+                        $(`#reply_time_${replyId}`).html(dateFormat('HH:MM:SS', new Date()));
+                        //typeChunk();
+                        chunkTimer = setInterval(typeChunk, itv);
+                        firstLineRecieved = true;
+                    }
+
+                    if (data.llm_response_data.is_end) {
+                        lastSentence = data.llm_response_data.sentence_id;
+                    }
                 }
-            })
-            .fail(function (data, status, xhr) {
-                console.log(data);
-                $('#reply_' + replyId).html('发生错误');
             });
 
+            source.stream();            
+            
         }
     });
     e.preventDefault();
diff --git a/src/LLMServiceHub/wwwroot/js/index.min.js b/src/LLMServiceHub/wwwroot/js/index.min.js
index 2ddfb3b..bc2f358 100644
--- a/src/LLMServiceHub/wwwroot/js/index.min.js
+++ b/src/LLMServiceHub/wwwroot/js/index.min.js
@@ -1,4 +1,4 @@
-function dateFormat(n,t){let i;const r={"Y+":t.getFullYear().toString(),"m+":(t.getMonth()+1).toString(),"d+":t.getDate().toString(),"H+":t.getHours().toString(),"M+":t.getMinutes().toString(),"S+":t.getSeconds().toString()};for(let t in r)i=new RegExp("("+t+")").exec(n),i&&(n=n.replace(i[1],i[1].length==1?r[t]:r[t].padStart(i[1].length,"0")));return n}function syncCurrentVal(n,t){$(`#${n}-val`).val(t);conversations.ConvErnieTurbo[n]=parseFloat(t);conversations.ConvErnie3_5[n]=parseFloat(t);conversations.ConvErnie4_0[n]=parseFloat(t);$(".llm-model-config").each(function(n,t){let r=$(t).data("llm-name"),i=conversations[r];$(t).html(`温度:${i.temperature};多样性:${i.top_p};惩罚系数:${i.penalty_score};`)})}function exportBlob(n,t){const u=new Blob([n],{type:"text/plain"}),r=URL.createObjectURL(u),i=document.createElement("a");i.href=r;i.download=t;document.body.appendChild(i);i.click();document.body.removeChild(i);URL.revokeObjectURL(r)}let m_t=.95,m_tp=.8,m_ps=1,_con_id={ConvErnie3_5:"",ConvErnieTurbo:"",ConvErnie4_0:""},conversations={ConvErnieTurbo:{temperature:m_t||.95,top_p:m_tp||.8,penalty_score:m_ps||1,stream:!1,conversation_id:"conv-turbo",message:"",model:2,user_id:"7ffe3194-2bf0-48ba-8dbd-e888d7d556d3"},ConvErnie3_5:{temperature:m_t||.95,top_p:m_tp||.8,penalty_score:m_ps||1,stream:!1,conversation_id:"conv-3_5",message:"",model:1,user_id:"7ffe3194-2bf0-48ba-8dbd-e888d7d556d3"},ConvErnie4_0:{temperature:m_t||.95,top_p:m_tp||.8,penalty_score:m_ps||1,stream:!1,conversation_id:"conv-4_0",message:"",model:3,user_id:"7ffe3194-2bf0-48ba-8dbd-e888d7d556d3"}};$("#r-temperature").val(m_t);$("#temperature-val").val(m_t);$("#r-top_p").val(m_tp);$("#top_p-val").val(m_tp);$("#r-penalty_score").val(m_ps);$("#penalty_score-val").val(m_ps);$(".llm-model-config").html(`温度:${m_t};多样性:${m_tp};惩罚系数:${m_ps};`);$(".llm-range-picker").on("change",function(){let n=$(this),t=$(n).val(),i=$(n).data("sync-key");syncCurrentVal(i,t)});$(".btn-discard-llm-setting").on("click",function(){let i=$(this),n=$(i).data("val"),t=$(i).data("rel-key");console.log(n);console.log(t);$(`#r-${t}`).val(n);syncCurrentVal(t,n)});let sendBtnClickEventHandler=function(n){let t=$("#ipt-message").val();$("#ipt-message").val("");$(Object.keys(conversations)).each(function(n,i){console.log(`key->${i}`);var f=$("#chk-"+i).is(":checked");if(console.log(`MODEL: ${i} -> ${f}`),f){let e=Math.random().toString(36).slice(-8),r=conversations[i],o="#wrapper_"+i;r.message=t;_con_id[i]!=""?(console.log(`convid found: ${_con_id[i]}`),r.conversation_id=_con_id[i]):(r.conversation_id=`${r.conversation_id}_${e}`,_con_id[i]=r.conversation_id);let u=$(o);if(u){let s=dateFormat("HH:MM:SS",new Date),n=`rpl_${e}`,f;switch(i){case"ConvErnieTurbo":f="ernie_turbo";break;case"ConvErnie3_5":f="ernie_3_5";break;case"ConvErnie4_0":f="ernie_4_0"}const h=`
+function dateFormat(n,t){let i;const r={"Y+":t.getFullYear().toString(),"m+":(t.getMonth()+1).toString(),"d+":t.getDate().toString(),"H+":t.getHours().toString(),"M+":t.getMinutes().toString(),"S+":t.getSeconds().toString()};for(let t in r)i=new RegExp("("+t+")").exec(n),i&&(n=n.replace(i[1],i[1].length==1?r[t]:r[t].padStart(i[1].length,"0")));return n}function syncCurrentVal(n,t){$(`#${n}-val`).val(t);conversations.ConvErnieTurbo[n]=parseFloat(t);conversations.ConvErnie3_5[n]=parseFloat(t);conversations.ConvErnie4_0[n]=parseFloat(t);$(".llm-model-config").each(function(n,t){let r=$(t).data("llm-name"),i=conversations[r];$(t).html(`温度:${i.temperature};多样性:${i.top_p};惩罚系数:${i.penalty_score};`)})}function exportBlob(n,t){const u=new Blob([n],{type:"text/plain"}),r=URL.createObjectURL(u),i=document.createElement("a");i.href=r;i.download=t;document.body.appendChild(i);i.click();document.body.removeChild(i);URL.revokeObjectURL(r)}let useSSE=!0,m_t=.95,m_tp=.8,m_ps=1,_con_id={ConvErnie3_5:"",ConvErnieTurbo:"",ConvErnie4_0:""},conversations={ConvErnieTurbo:{temperature:m_t||.95,top_p:m_tp||.8,penalty_score:m_ps||1,stream:useSSE,conversation_id:"conv-turbo",message:"",model:2,user_id:"7ffe3194-2bf0-48ba-8dbd-e888d7d556d3"},ConvErnie3_5:{temperature:m_t||.95,top_p:m_tp||.8,penalty_score:m_ps||1,conversation_id:"conv-3_5",message:"",model:1,stream:useSSE,user_id:"7ffe3194-2bf0-48ba-8dbd-e888d7d556d3"},ConvErnie4_0:{temperature:m_t||.95,top_p:m_tp||.8,penalty_score:m_ps||1,stream:useSSE,conversation_id:"conv-4_0",message:"",model:3,user_id:"7ffe3194-2bf0-48ba-8dbd-e888d7d556d3"}};$("#r-temperature").val(m_t);$("#temperature-val").val(m_t);$("#r-top_p").val(m_tp);$("#top_p-val").val(m_tp);$("#r-penalty_score").val(m_ps);$("#penalty_score-val").val(m_ps);$(".llm-model-config").html(`温度:${m_t};多样性:${m_tp};惩罚系数:${m_ps};`);$(".llm-range-picker").on("change",function(){let n=$(this),t=$(n).val(),i=$(n).data("sync-key");syncCurrentVal(i,t)});$(".btn-discard-llm-setting").on("click",function(){let i=$(this),n=$(i).data("val"),t=$(i).data("rel-key");console.log(n);console.log(t);$(`#r-${t}`).val(n);syncCurrentVal(t,n)});let sendBtnClickEventHandler=async function(n){let t=$("#ipt-message").val();$("#ipt-message").val("");$(Object.keys(conversations)).each(async function(n,i){var o,c;if(console.log(`key->${i}`),o=$("#chk-"+i).is(":checked"),console.log(`MODEL: ${i} -> ${o}`),o){let l=Math.random().toString(36).slice(-8),r=conversations[i],w="#wrapper_"+i;r.message=t;_con_id[i]!=""?(console.log(`conversation_id found: ${_con_id[i]}`),r.conversation_id=_con_id[i]):(r.conversation_id=`${r.conversation_id}_${l}`,_con_id[i]=r.conversation_id);let u=$(w);if(u){let d=dateFormat("HH:MM:SS",new Date),n=`rpl_${l}`,o;switch(i){case"ConvErnieTurbo":o="ernie_turbo";break;case"ConvErnie3_5":o="ernie_3_5";break;case"ConvErnie4_0":o="ernie_4_0"}const g=`
                         <div class="chat-item">
                             <div class="row align-items-end justify-content-end">
                                 <div class="col col-lg-8">
@@ -6,7 +6,7 @@ function dateFormat(n,t){let i;const r={"Y+":t.getFullYear().toString(),"m+":(t.
                                         <div class="chat-bubble-title">
                                             <div class="row">
                                                 <div class="col chat-bubble-author pb-2">${"我"}</div>
-                                                <div class="col-auto chat-bubble-date">${s}</div>
+                                                <div class="col-auto chat-bubble-date">${d}</div>
                                             </div>
                                         </div>
                                         <div class="chat-bubble-body">
@@ -19,7 +19,7 @@ function dateFormat(n,t){let i;const r={"Y+":t.getFullYear().toString(),"m+":(t.
                                 </div>
                             </div>
                         </div>
-                        `,c=`
+                        `,nt=`
                          <div class="chat-item">
                              <div class="row align-items-end">
                                  <div class="col-auto">
@@ -29,17 +29,18 @@ function dateFormat(n,t){let i;const r={"Y+":t.getFullYear().toString(),"m+":(t.
                                      <div class="chat-bubble">
                                          <div class="chat-bubble-title">
                                              <div class="row">
-                                                 <div class="col chat-bubble-author pb-2">${f}</div>
+                                                 <div class="col chat-bubble-author pb-2">${o}</div>
                                                  <div class="col-auto chat-bubble-date" id='reply_time_${n}'></div>
                                              </div>
                                          </div>
                                          <div class="chat-bubble-body" id='reply_${n}'>
                                          </div>
+                                         <input type='hidden' id='reply_hid_${n}' value='' />
                                      </div>
                                  </div>
                              </div>
                          </div>
-                         `;$(h).appendTo($(u));$(c).appendTo($(u));let o=$(u).closest(".scrollable"),l=$(o).height();$(o).scrollTop(l);console.log("sending request with:");console.log(r);$.ajax(apiEndpoint,{method:"POST",dataType:"json",contentType:"application/json",data:JSON.stringify(r)}).done(function(t){if(console.log(t),t){$(`#reply_time_${n}`).html(dateFormat("HH:MM:SS",new Date));var i=t.aigc_message;const r=new EasyTyper({output:"",isEnd:!1,speed:20,singleBack:!1,sleep:0,type:"normal",backSpeed:40,sentencePause:!0},marked.parse(i),()=>{},t=>{$("#reply_"+n).html(`${t}`);let i=$(u).closest(".scrollable"),r=$(i).prop("scrollTop")+$("#reply_"+n).height();$(i).scrollTop(r)})}}).fail(function(t){console.log(t);$("#reply_"+n).html("发生错误")})}}});n.preventDefault()};$(document).on("keyup",function(n){var t=n||window.event,i=t.which||t.keyCode||t.charCode;i==13&&t.ctrlKey&&sendBtnClickEventHandler(n)});$(".btn-send-message").on("click",sendBtnClickEventHandler);$(".btn-export").on("click",function(){let t=dateFormat("YYYYmmddHHMMSS",new Date),r=$(this).closest(".card"),u=$(this).data("key")+"-"+t+".txt",f=$(r).find(".chat-bubble"),n=[];n.push(`--------------${t}-------------
+                         `;$(g).appendTo($(u));$(nt).appendTo($(u));let w=$(u).closest(".scrollable"),tt=$(w).height();$(w).scrollTop(tt);console.log("sending request with:");console.log(r);var a=!1,b=12e4,v=[],f=0,e=0,s=-1,h=null,y=50,p=0,k=function(){var i,t,r,o,c,l,a;if(p>b&&clearInterval(h),i=v[f],i){if(t=i.chunk||"",s>0&&(f==s||!t)){clearInterval(h);f=0;return}r=0;t&&(r=t.length||0,o=t[e]||"",o&&(c=($(`#reply_hid_${n}`).val()||"")+o,$(`#reply_hid_${n}`).val(c),$(`#reply_${n}`).html(marked.parse(c)),l=$(u).closest(".scrollable"),a=$(l).prop("scrollTop")+$("#reply_"+n).height(),$(l).scrollTop(a)));e++;e==r&&(e=0,f++);p+=y}};EventSource=SSE;c=new SSE(apiEndpoint,{headers:{"Content-Type":"application/json"},payload:JSON.stringify(r),withCredentials:!0,debug:!1,start:!1,method:"POST"});c.addEventListener("message",function(t){var u=useSSE?t.data:t.source.chunk,i=JSON.parse(u),r;i&&(r=i.aigc_message,v.push({row:i.llm_response_data.sentence_id,chunk:r.split("")}),a||($(`#reply_time_${n}`).html(dateFormat("HH:MM:SS",new Date)),h=setInterval(k,y),a=!0),i.llm_response_data.is_end&&(s=i.llm_response_data.sentence_id))});c.stream()}}});n.preventDefault()};$(document).on("keyup",function(n){var t=n||window.event,i=t.which||t.keyCode||t.charCode;i==13&&t.ctrlKey&&sendBtnClickEventHandler(n)});$(".btn-send-message").on("click",sendBtnClickEventHandler);$(".btn-export").on("click",function(){let t=dateFormat("YYYYmmddHHMMSS",new Date),r=$(this).closest(".card"),u=$(this).data("key")+"-"+t+".txt",f=$(r).find(".chat-bubble"),n=[];n.push(`--------------${t}-------------
 `);$(f).each(function(t,i){let r=$(i).find(".chat-bubble-author").text(),u=$(i).find(".chat-bubble-date").text(),f=$(i).find(".chat-bubble-body").text();n.push(`[${r}]  ${u}
 
 `);n.push(f.trim());n.push("\r\n-------------------------------\r\n")});let i=n.join("");console.log(i);exportBlob(i,u)});
\ No newline at end of file
diff --git a/src/LLMServiceHub/wwwroot/js/sse.js b/src/LLMServiceHub/wwwroot/js/sse.js
new file mode 100644
index 0000000..7c60469
--- /dev/null
+++ b/src/LLMServiceHub/wwwroot/js/sse.js
@@ -0,0 +1,434 @@
+/**
+ * sse.js - A flexible EventSource polyfill/replacement.
+ * https://github.com/mpetazzoni/sse.js
+ *
+ * Copyright (C) 2016-2024 Maxime Petazzoni <maxime.petazzoni@bulix.org>.
+ * All rights reserved.
+ *
+ * Licensed under the Apache License, Version 2.0 (the "License");
+ * you may not use this file except in compliance with the License.
+ * You may obtain a copy of the License at
+ *
+ *     http://www.apache.org/licenses/LICENSE-2.0
+ *
+ * Unless required by applicable law or agreed to in writing, software
+ * distributed under the License is distributed on an "AS IS" BASIS,
+ * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+ * See the License for the specific language governing permissions and
+ * limitations under the License.
+ */
+
+
+/**
+ * @type SSE
+ * @param {string} url
+ * @param {SSEOptions} options
+ * @return {SSE}
+ */
+var SSE = function (url, options) {
+    if (!(this instanceof SSE)) {
+        return new SSE(url, options);
+    }
+
+    /** @type {number} */
+    this.INITIALIZING = -1;
+    /** @type {number} */
+    this.CONNECTING = 0;
+    /** @type {number} */
+    this.OPEN = 1;
+    /** @type {number} */
+    this.CLOSED = 2;
+
+    /** @type {string} */
+    this.url = url;
+
+    options = options || {};
+    this.headers = options.headers || {};
+    this.payload = options.payload !== undefined ? options.payload : '';
+    this.method = options.method || (this.payload && 'POST' || 'GET');
+    this.withCredentials = !!options.withCredentials;
+    this.debug = !!options.debug;
+
+    /** @type {string} */
+    this.FIELD_SEPARATOR = ':';
+
+    /** @type { {[key: string]: [EventListener]} } */
+    this.listeners = {};
+
+    /** @type {XMLHttpRequest} */
+    this.xhr = null;
+    /** @type {number} */
+    this.readyState = this.INITIALIZING;
+    /** @type {number} */
+    this.progress = 0;
+    /** @type {string} */
+    this.chunk = '';
+    /** @type {string} */
+    this.lastEventId = '';
+
+    /**
+     * @type AddEventListener
+     */
+    this.addEventListener = function (type, listener) {
+        if (this.listeners[type] === undefined) {
+            this.listeners[type] = [];
+        }
+
+        if (this.listeners[type].indexOf(listener) === -1) {
+            this.listeners[type].push(listener);
+        }
+    };
+
+    /**
+     * @type RemoveEventListener
+     */
+    this.removeEventListener = function (type, listener) {
+        if (this.listeners[type] === undefined) {
+            return;
+        }
+
+        const filtered = [];
+        this.listeners[type].forEach(function (element) {
+            if (element !== listener) {
+                filtered.push(element);
+            }
+        });
+        if (filtered.length === 0) {
+            delete this.listeners[type];
+        } else {
+            this.listeners[type] = filtered;
+        }
+    };
+
+    /**
+     * @type DispatchEvent
+     */
+    this.dispatchEvent = function (e) {
+        if (!e) {
+            return true;
+        }
+
+        if (this.debug) {
+            console.debug(e);
+        }
+
+        e.source = this;
+
+        const onHandler = 'on' + e.type;
+        if (this.hasOwnProperty(onHandler)) {
+            this[onHandler].call(this, e);
+            if (e.defaultPrevented) {
+                return false;
+            }
+        }
+
+        if (this.listeners[e.type]) {
+            return this.listeners[e.type].every(function (callback) {
+                callback(e);
+                return !e.defaultPrevented;
+            });
+        }
+
+        return true;
+    };
+
+    /** @private */
+    this._setReadyState = function (state) {
+        const event = new CustomEvent('readystatechange');
+        event.readyState = state;
+        this.readyState = state;
+        this.dispatchEvent(event);
+    };
+
+    this._onStreamFailure = function (e) {
+        const event = new CustomEvent('error');
+        event.data = e.currentTarget.response;
+        this.dispatchEvent(event);
+        this.close();
+    }
+
+    this._onStreamAbort = function () {
+        this.dispatchEvent(new CustomEvent('abort'));
+        this.close();
+    }
+
+    /** @private */
+    this._onStreamProgress = function (e) {
+        if (!this.xhr) {
+            return;
+        }
+
+        if (this.xhr.status !== 200) {
+            this._onStreamFailure(e);
+            return;
+        }
+
+        if (this.readyState === this.CONNECTING) {
+            this.dispatchEvent(new CustomEvent('open'));
+            this._setReadyState(this.OPEN);
+        }
+
+        const data = this.xhr.responseText.substring(this.progress);
+
+        this.progress += data.length;
+        const parts = (this.chunk + data).split(/(\r\n\r\n|\r\r|\n\n)/g);
+
+        /*
+         * We assume that the last chunk can be incomplete because of buffering or other network effects,
+         * so we always save the last part to merge it with the next incoming packet
+         */
+        const lastPart = parts.pop();
+        parts.forEach(function (part) {
+            if (part.trim().length > 0) {
+                this.dispatchEvent(this._parseEventChunk(part));
+            }
+        }.bind(this));
+        this.chunk = lastPart;
+    };
+
+    /** @private */
+    this._onStreamLoaded = function (e) {
+        this._onStreamProgress(e);
+
+        // Parse the last chunk.
+        this.dispatchEvent(this._parseEventChunk(this.chunk));
+        this.chunk = '';
+    };
+
+    /**
+     * Parse a received SSE event chunk into a constructed event object.
+     *
+     * Reference: https://html.spec.whatwg.org/multipage/server-sent-events.html#dispatchMessage
+     */
+    this._parseEventChunk = function (chunk) {
+        if (!chunk || chunk.length === 0) {
+            return null;
+        }
+
+        if (this.debug) {
+            console.debug(chunk);
+        }
+
+        const e = { 'id': null, 'retry': null, 'data': null, 'event': null };
+        chunk.split(/\n|\r\n|\r/).forEach(function (line) {
+            const index = line.indexOf(this.FIELD_SEPARATOR);
+            let field, value;
+            if (index > 0) {
+                // only first whitespace should be trimmed
+                const skip = (line[index + 1] === ' ') ? 2 : 1;
+                field = line.substring(0, index);
+                value = line.substring(index + skip);
+            } else if (index < 0) {
+                // Interpret the entire line as the field name, and use the empty string as the field value
+                field = line;
+                value = '';
+            } else {
+                // A colon is the first character. This is a comment; ignore it.
+                return;
+            }
+
+            if (!(field in e)) {
+                return;
+            }
+
+            // consecutive 'data' is concatenated with newlines
+            if (field === 'data' && e[field] !== null) {
+                e['data'] += "\n" + value;
+            } else {
+                e[field] = value;
+            }
+        }.bind(this));
+
+        if (e.id !== null) {
+            this.lastEventId = e.id;
+        }
+
+        const event = new CustomEvent(e.event || 'message');
+        event.id = e.id;
+        event.data = e.data || '';
+        event.lastEventId = this.lastEventId;
+        return event;
+    };
+
+    this._checkStreamClosed = function () {
+        if (!this.xhr) {
+            return;
+        }
+
+        if (this.xhr.readyState === XMLHttpRequest.DONE) {
+            this._setReadyState(this.CLOSED);
+        }
+    };
+
+    /**
+     * starts the streaming
+     * @type Stream
+     * @return {void}
+     */
+    this.stream = function () {
+        if (this.xhr) {
+            // Already connected.
+            return;
+        }
+
+        this._setReadyState(this.CONNECTING);
+
+        this.xhr = new XMLHttpRequest();
+        this.xhr.addEventListener('progress', this._onStreamProgress.bind(this));
+        this.xhr.addEventListener('load', this._onStreamLoaded.bind(this));
+        this.xhr.addEventListener('readystatechange', this._checkStreamClosed.bind(this));
+        this.xhr.addEventListener('error', this._onStreamFailure.bind(this));
+        this.xhr.addEventListener('abort', this._onStreamAbort.bind(this));
+        this.xhr.open(this.method, this.url);
+        for (let header in this.headers) {
+            this.xhr.setRequestHeader(header, this.headers[header]);
+        }
+        if (this.lastEventId.length > 0) {
+            this.xhr.setRequestHeader("Last-Event-ID", this.lastEventId);
+        }
+        this.xhr.withCredentials = this.withCredentials;
+        this.xhr.send(this.payload);
+    };
+
+    /**
+     * closes the stream
+     * @type Close
+     * @return {void}
+     */
+    this.close = function () {
+        if (this.readyState === this.CLOSED) {
+            return;
+        }
+
+        this.xhr.abort();
+        this.xhr = null;
+        this._setReadyState(this.CLOSED);
+    };
+
+    if (options.start === undefined || options.start) {
+        this.stream();
+    }
+};
+
+/*
+// Export our SSE module for npm.js
+if (typeof exports !== 'undefined') {
+    exports.SSE = SSE;
+}
+
+// Export as an ECMAScript module
+export { SSE };
+*/
+
+/**
+ * @typedef { {[key: string]: string} } SSEHeaders
+ */
+/**
+ * @typedef {Object} SSEOptions
+ * @property {SSEHeaders} [headers] - headers
+ * @property {string} [payload] - payload as a string
+ * @property {string} [method] - HTTP Method
+ * @property {boolean} [withCredentials] - flag, if credentials needed
+ * @property {boolean} [start] - flag, if streaming should start automatically
+ * @property {boolean} [debug] - debugging flag
+ */
+/**
+ * @typedef {Object} _SSEvent
+ * @property {string} id
+ * @property {string} data
+ */
+/**
+ * @typedef {Object} _ReadyStateEvent
+ * @property {number} readyState
+ */
+/**
+ * @typedef {Event & _SSEvent} SSEvent
+ */
+/**
+ * @typedef {SSEvent & _ReadyStateEvent} ReadyStateEvent
+ */
+/**
+ * @callback AddEventListener
+ * @param {string} type
+ * @param {function} listener
+ * @returns {void}
+ */
+/**
+ * @callback RemoveEventListener
+ * @param {string} type
+ * @param {function} listener
+ * @returns {void}
+ */
+/**
+ * @callback DispatchEvent
+ * @param {string} type
+ * @param {function} listener
+ * @returns {boolean}
+ */
+/**
+ * @callback Stream
+ * @returns {void}
+ */
+/**
+ * @callback Close
+ * @returns {void}
+ */
+/**
+ * @callback OnMessage
+ * @param {SSEvent} event
+ * @returns {void}
+ */
+/**
+ * @callback OnOpen
+ * @param {SSEvent} event
+ * @returns {void}
+ */
+/**
+ * @callback OnLoad
+ * @param {SSEvent} event
+ * @returns {void}
+ */
+/**
+ * @callback OnReadystatechange
+ * @param {ReadyStateEvent} event
+ * @returns {void}
+ */
+/**
+ * @callback OnError
+ * @param {SSEvent} event
+ * @returns {void}
+ */
+/**
+ * @callback OnAbort
+ * @param {SSEvent} event
+ * @returns {void}
+ */
+/**
+ * @typedef {Object} SSE
+ * @property {SSEHeaders} headers - headers
+ * @property {string} payload - payload as a string
+ * @property {string} method - HTTP Method
+ * @property {boolean} withCredentials - flag, if credentials needed
+ * @property {boolean} debug - debugging flag
+ * @property {string} FIELD_SEPARATOR
+ * @property {Record<string, Function[]>} listeners
+ * @property {XMLHttpRequest | null} xhr
+ * @property {number} readyState
+ * @property {number} progress
+ * @property {string} chunk
+ * @property {-1} INITIALIZING
+ * @property {0} CONNECTING
+ * @property {1} OPEN
+ * @property {2} CLOSED
+ * @property {AddEventListener} addEventListener
+ * @property {RemoveEventListener} removeEventListener
+ * @property {DispatchEvent} dispatchEvent
+ * @property {Stream} stream
+ * @property {Close} close
+ * @property {OnMessage} onmessage
+ * @property {OnOpen} onopen
+ * @property {OnLoad} onload
+ * @property {OnReadystatechange} onreadystatechange
+ * @property {OnError} onerror
+ * @property {OnAbort} onabort
+ */
\ No newline at end of file
diff --git a/src/LLMServiceHub/wwwroot/js/sse.min.js b/src/LLMServiceHub/wwwroot/js/sse.min.js
new file mode 100644
index 0000000..7274674
--- /dev/null
+++ b/src/LLMServiceHub/wwwroot/js/sse.min.js
@@ -0,0 +1 @@
+var SSE=function(n,t){if(!(this instanceof SSE))return new SSE(n,t);this.INITIALIZING=-1;this.CONNECTING=0;this.OPEN=1;this.CLOSED=2;this.url=n;t=t||{};this.headers=t.headers||{};this.payload=t.payload!==undefined?t.payload:"";this.method=t.method||this.payload&&"POST"||"GET";this.withCredentials=!!t.withCredentials;this.debug=!!t.debug;this.FIELD_SEPARATOR=":";this.listeners={};this.xhr=null;this.readyState=this.INITIALIZING;this.progress=0;this.chunk="";this.lastEventId="";this.addEventListener=function(n,t){this.listeners[n]===undefined&&(this.listeners[n]=[]);this.listeners[n].indexOf(t)===-1&&this.listeners[n].push(t)};this.removeEventListener=function(n,t){if(this.listeners[n]!==undefined){const i=[];this.listeners[n].forEach(function(n){n!==t&&i.push(n)});i.length===0?delete this.listeners[n]:this.listeners[n]=i}};this.dispatchEvent=function(n){if(!n)return!0;this.debug&&console.debug(n);n.source=this;const t="on"+n.type;return this.hasOwnProperty(t)&&(this[t].call(this,n),n.defaultPrevented)?!1:this.listeners[n.type]?this.listeners[n.type].every(function(t){return t(n),!n.defaultPrevented}):!0};this._setReadyState=function(n){const t=new CustomEvent("readystatechange");t.readyState=n;this.readyState=n;this.dispatchEvent(t)};this._onStreamFailure=function(n){const t=new CustomEvent("error");t.data=n.currentTarget.response;this.dispatchEvent(t);this.close()};this._onStreamAbort=function(){this.dispatchEvent(new CustomEvent("abort"));this.close()};this._onStreamProgress=function(n){if(this.xhr){if(this.xhr.status!==200){this._onStreamFailure(n);return}this.readyState===this.CONNECTING&&(this.dispatchEvent(new CustomEvent("open")),this._setReadyState(this.OPEN));const t=this.xhr.responseText.substring(this.progress);this.progress+=t.length;const i=(this.chunk+t).split(/(\r\n\r\n|\r\r|\n\n)/g),r=i.pop();i.forEach(function(n){n.trim().length>0&&this.dispatchEvent(this._parseEventChunk(n))}.bind(this));this.chunk=r}};this._onStreamLoaded=function(n){this._onStreamProgress(n);this.dispatchEvent(this._parseEventChunk(this.chunk));this.chunk=""};this._parseEventChunk=function(n){if(!n||n.length===0)return null;this.debug&&console.debug(n);const t={id:null,retry:null,data:null,event:null};n.split(/\n|\r\n|\r/).forEach(function(n){const r=n.indexOf(this.FIELD_SEPARATOR);let i,u;if(r>0){const t=n[r+1]===" "?2:1;i=n.substring(0,r);u=n.substring(r+t)}else if(r<0)i=n,u="";else return;i in t&&(i==="data"&&t[i]!==null?t.data+="\n"+u:t[i]=u)}.bind(this));t.id!==null&&(this.lastEventId=t.id);const i=new CustomEvent(t.event||"message");return i.id=t.id,i.data=t.data||"",i.lastEventId=this.lastEventId,i};this._checkStreamClosed=function(){this.xhr&&this.xhr.readyState===XMLHttpRequest.DONE&&this._setReadyState(this.CLOSED)};this.stream=function(){if(!this.xhr){this._setReadyState(this.CONNECTING);this.xhr=new XMLHttpRequest;this.xhr.addEventListener("progress",this._onStreamProgress.bind(this));this.xhr.addEventListener("load",this._onStreamLoaded.bind(this));this.xhr.addEventListener("readystatechange",this._checkStreamClosed.bind(this));this.xhr.addEventListener("error",this._onStreamFailure.bind(this));this.xhr.addEventListener("abort",this._onStreamAbort.bind(this));this.xhr.open(this.method,this.url);for(let n in this.headers)this.xhr.setRequestHeader(n,this.headers[n]);this.lastEventId.length>0&&this.xhr.setRequestHeader("Last-Event-ID",this.lastEventId);this.xhr.withCredentials=this.withCredentials;this.xhr.send(this.payload)}};this.close=function(){this.readyState!==this.CLOSED&&(this.xhr.abort(),this.xhr=null,this._setReadyState(this.CLOSED))};(t.start===undefined||t.start)&&this.stream()};
\ No newline at end of file