javascript Vue.js + Node.js -客户端未收到SSE

56lgkhnf  于 2023-09-29  发布在  Java
关注(0)|答案(1)|浏览(148)

我正在编写一个Web应用程序,它分为客户端(Vue.js)和后端(Node.js)。
我已经实现了一个SSE-Endpoint到我的端点:

Node.js

module.exports = (request: Request, response: Response) => {

    // create utilities class
    let util: RequestUtilities = new RequestUtilities(request);

    try {

        // get request parameters
        let clientId = util.getParameter('clientId');

        // respose write head
        response.writeHead(status, {
            'Content-Type': 'text/event-stream',
            'Cache-Control': 'no-cache',
            'Content-Encoding': 'none',
            'Connection': 'keep-alive',
            'Access-Control-Allow-Origin': '*'
        })
        //response.flushHeaders()

        // response write
        response.write('TEST')
        response.flush();

        // text message
        setInterval(() => {
            //response.write('event: message\n');
            response.write(`data: ${clientId}\n`);
            response.flush()
        }, 5000);

        // request close
        request.on('close', () => {
            response.end('OK')            
        });

此端点通过/api/v2/events调用,并需要名为clientId的GET参数
服务器使用npm模块compression
当我通过浏览器调用此端点时,SSE消息被成功接收。但是当我通过Postman或我的Web应用程序调用此端点时,不会收到SSE消息。
我使用的是EventSource或VueSSE(Vue.use(VueSSE),npm vue-sse)

Vue组件

<template>...</template>
<script>
let sseClient;

export default {
    methods: {
         buttonClick() {

              // using EventSource
              let evtSrc = new EventSource(localhost/api/v2/events?clientId=test)
              evtSrc.onmessage = (msg) => { console.log(msg) }
              evtSrc.addEventListener('progress', (evt) => { console.log(evt) })
              evtSrc.addEventListener('', (evt) => { console.log(evt) })
              evtSrc.onerror = (err) => { console.log(err) }

              // using vue-sse
              sseClient.connect()
                  .then(a => { console.log(a) })
                  .catch(e => { console.log(e) })

         }
    },
    mounted() {
        this.getProcessingStatusArray();
        sseClient = this.$sse.create("http://localhost:3060/api/v2/events?clientId=sadf");
        sseClient.on('error', (e) => { console.log(`ERROR: ${e}`) })
        sseClient.on('message', (m) => { console.log(`MESSAGE: ${m}`) })
        sseClient.on('', (m) => { console.log(`MESSAGE: ${m}`) })

    },
}
</script>

EventSource和Vue-SSE模块都被成功调用,但没有从我的节点服务器收到任何响应。
我错过了什么吗?我找了好几个小时,但没有找到任何解决办法。
Thanks in advance

eni9jsuy

eni9jsuy1#

请求的格式错误,并且在消息末尾缺少2个换行符
而不是

`data: ${clientId}\n`

`data: ${clientId}`

它应该是:

`data: ${clientId}\n\n`

相关问题