html5 - EventSource报错
phpcn_u1582
phpcn_u1582 2017-05-31 10:39:06
[Node.js讨论组]

错误

Error: Can't set headers after they are sent.

at ServerResponse.OutgoingMessage.setHeader (_http_outgoing.js:357:11)
at ServerResponse.header (D:\node\javascript-demo\node_modules\express\lib\response.js:730:10)
at ServerResponse.send (D:\node\javascript-demo\node_modules\express\lib\response.js:170:12)
at Timeout.setInterval [as _onTimeout] (D:\node\javascript-demo\routes\eventsource\eventsource.js:8:8)
at ontimeout (timers.js:384:18)
at tryOnTimeout (timers.js:244:5)
at Timer.listOnTimeout (timers.js:214:5) Program node --debug ./bin/www exited with code 1
    
  
const express = require('express');
const router = express.Router();

router.get('/connect',function(req,resp,next){
    resp.append('Content-Type','text/event-stream');
    console.log(req.method);
    setInterval((data)=>{
        resp.send('hello!');
    },1000,'hello');
});


router.get('/html',(req,resp,next)=>{
    resp.render('./eventsource/msgsend_recevie.html');
});module.exports=router;



<!DOCTYPE html>
<html lang="en">
<head>
    <title>EventSource消息发送</title>
    <style type="text/css">
        *{
            margin:0 auto;
            padding:0;
        }

        p{
            width:440px;
            height:450px;
            border:2px solid;
            margin-top:100px;
        }
</style>
</head>
<body>
    <p>
        <textarea  id="msg_recevie" rows="30" cols="60"></textarea>
    </p>

    <script>
        //使用eventsource发送信息
        var eventSource = new EventSource('/msg_send/connect');
        eventSource.onmessage=function(e){
            var tx=document.getElementsByTagName('textarea')[0];
            tx.value=e.data;
        };

    </script>
</body>    

</html>
    

phpcn_u1582
phpcn_u1582

全部回复(2)
我想大声告诉你

问题已解决,需要给发送的数据加上"data:"前缀,"nn"后缀,即"data"+msg+"nn"
服务端代码修改如下:

const express = require('express');
const router = express.Router();
router.get('/connect',function(req,resp,next){
    resp.writeHead(200,{
        "Content-Type":"text/event-stream",
        "Cache-Control":"no-cache",
        "Connection":"keep-alive"
    });

    setInterval(function(){
 
      resp.write("data:"+Date.now()+"\n\n");
    },1000);

});


router.get('/html',(req,resp,next)=>{
    resp.render('./eventsource/msgsend_recevie.html');
});



module.exports=router;
给我你的怀抱

问题

在express的response已经send后,response不允许再进行header等一系列的操作,setintval是一个定时器,你的逻辑方式没有正确。
你的setintval第一次已经把响应推送出去了,那么后面这个响应已经不能继续操作了,由于http是单向非双向的,所以第二次是无效的操作

解决方案

如果你希望客户端能够接受服务端得事件推送的话,我推荐使用socketio,或者使用ajax轮训去处理。

热门教程
更多>
最新下载
更多>
网站特效
网站源码
网站素材
前端模板
关于我们 免责申明 意见反馈 讲师合作 广告合作 最新更新 English
php中文网:公益在线php培训,帮助PHP学习者快速成长!
关注服务号 技术交流群
PHP中文网订阅号
每天精选资源文章推送
PHP中文网APP
随时随地碎片化学习
PHP中文网抖音号
发现有趣的

Copyright 2014-2025 https://www.php.cn/ All Rights Reserved | php.cn | 湘ICP备2023035733号