why the EventSourcePolyfill error message did not output any information

672 Views Asked by At

I have defined the EventSourcePolyfill "event-source-polyfill": "^1.0.31" client to recieved sse message like this:

import { IChatAsk } from '../../models/chat/ChatAsk';
import { EventSourcePolyfill } from 'event-source-polyfill';
import { v4 as uuid } from 'uuid';

export function doSseChatAsk(params: IChatAsk, onSseMessage: (msg: string) => void,) {
  let eventSource: EventSourcePolyfill;
  const accessToken = localStorage.getItem("x-access-token");
  eventSource = new EventSourcePolyfill('/ai/stream/chat/ask?question=hello', {
    headers: {
      'x-access-token': accessToken ?? "",
      'x-request-id': uuid(),
    }
  });
  eventSource.onopen = () => {
    console.log("onopen....")
  }
  eventSource.onerror = (error) => {
    console.log("onerror",error)
    if(eventSource){
      eventSource.close();
    }
  }
  eventSource.onmessage = e => {
    onSseMessage(e.data);
  };

  eventSource.addEventListener('complete', () => {
    console.log('Transfer of data is complete');
  });
  
}

when this code runs into the onerror code block, did not output any valid message. the output message like this:

enter image description here

what should I do to get the valid error message from the context? I have alread using the curl command to test the server side like this:

➜  ~ curl -X GET -H 'Content-Type: application/json' -H 'x-request-id:1' -H 'Cache-Control:no-cache'  -H 'x-access-token: eyJhbGciOiJIJ9.eyJZTDkiLC2Nzk.G9Ddi5sBMmiKNaD_vKni-gzN5kdT6426ruo1EDDV29SCFwI0CqlS5hKg6D7Q' -N https://ai.example.top/ai/stream/chat/ask\?question\=1

data:{"id": "cmpl-6xtZ5KyFfDfa97NJrGHqq2DdsXJQE", "object": "text_completion", "created": 1679732963, "choices": [{"text": " world", "index": 0, "logprobs": null, "finish_reason": null}], "model": "text-davinci-003"}

data:{"id": "cmpl-6xtZ5KyFfDfa97NJrGHqq2DdsXJQE", "object": "text_completion", "created": 1679732963, "choices": [{"text": "\n", "index": 0, "logprobs": null, "finish_reason": null}], "model": "text-davinci-003"}

data:{"id": "cmpl-6xtZ5KyFfDfa97NJrGHqq2DdsXJQE", "object": "text_completion", "created": 1679732963, "choices": [{"text": "\n", "index": 0, "logprobs": null, "finish_reason": null}], "model": "text-davinci-003"}

data:{"id": "cmpl-6xtZ5KyFfDfa97NJrGHqq2DdsXJQE", "object": "text_completion", "created": 1679732963, "choices": [{"text": "Hello", "index": 0, "logprobs": null, "finish_reason": null}], "model": "text-davinci-003"}

data:{"id": "cmpl-6xtZ5KyFfDfa97NJrGHqq2DdsXJQE", "object": "text_completion", "created": 1679732963, "choices": [{"text": " world", "index": 0, "logprobs": null, "finish_reason": null}], "model": "text-davinci-003"}

data:{"id": "cmpl-6xtZ5KyFfDfa97NJrGHqq2DdsXJQE", "object": "text_completion", "created": 1679732963, "choices": [{"text": "!", "index": 0, "logprobs": null, "finish_reason": null}], "model": "text-davinci-003"}

data:{"id": "cmpl-6xtZ5KyFfDfa97NJrGHqq2DdsXJQE", "object": "text_completion", "created": 1679732963, "choices": [{"text": " It", "index": 0, "logprobs": null, "finish_reason": null}], "model": "text-davinci-003"}

data:{"id": "cmpl-6xtZ5KyFfDfa97NJrGHqq2DdsXJQE", "object": "text_completion", "created": 1679732963, "choices": [{"text": "'s", "index": 0, "logprobs": null, "finish_reason": null}], "model": "text-davinci-003"}

data:{"id": "cmpl-6xtZ5KyFfDfa97NJrGHqq2DdsXJQE", "object": "text_completion", "created": 1679732963, "choices": [{"text": " nice", "index": 0, "logprobs": null, "finish_reason": null}], "model": "text-davinci-003"}

data:{"id": "cmpl-6xtZ5KyFfDfa97NJrGHqq2DdsXJQE", "object": "text_completion", "created": 1679732963, "choices": [{"text": " to", "index": 0, "logprobs": null, "finish_reason": null}], "model": "text-davinci-003"}

data:{"id": "cmpl-6xtZ5KyFfDfa97NJrGHqq2DdsXJQE", "object": "text_completion", "created": 1679732963, "choices": [{"text": " meet", "index": 0, "logprobs": null, "finish_reason": null}], "model": "text-davinci-003"}

data:{"id": "cmpl-6xtZ5KyFfDfa97NJrGHqq2DdsXJQE", "object": "text_completion", "created": 1679732963, "choices": [{"text": " you", "index": 0, "logprobs": null, "finish_reason": null}], "model": "text-davinci-003"}

data:{"id": "cmpl-6xtZ5KyFfDfa97NJrGHqq2DdsXJQE", "object": "text_completion", "created": 1679732963, "choices": [{"text": ".", "index": 0, "logprobs": null, "finish_reason": null}], "model": "text-davinci-003"}

I have made a minimal reproduce example, seems the server issue:

<!DOCTYPE html>
<html>
  <head>
    <title>SSE Client</title>
  </head>
  <body>
    <div id="sse"></div>
    <script>
      const sse = new EventSource('https://ai.example.top/ai/stream/chat/ask?question=1');

      sse.onmessage = event => {
        const data = JSON.parse(event.data);
        document.getElementById('sse').innerText = data.message;
      };
      sse.onerror = event => {
        console.log(event);
      }
    </script>
  </body>
</html>
0

There are 0 best solutions below