如何防止socket.io顺序/自动发出事件?

时间:2017-06-01 08:27:16

标签: javascript jquery node.js sockets

我刚开始在node.js-server上使用socket.io。每当我通过点击按钮向服务器发出请求时,我只想发出一个事件。问题是,当我加载页面时,事件已经被释放,然后将再次每两分钟发出一次。为什么会发生这种情况?如何防止这种情况发生?我只想在点击按钮后触发一次事件。

server.js

const express = require('express')
const app = express()
const server = require('http').createServer(app)
const io = require('socket.io')(server)

app.post('/event', function (req, res, next) {
  console.log('emit event')
  io.emit('event')
})

app.use(express.static(__dirname + '/public'))

server.listen(8085)

的index.html

<html>
    <body>
        <div class="container">
        </div>
        <button type="submit" id="fire">Fire!</button>
        <script src="/socket.io/socket.io.js"></script>
        <script src="jquery-3.2.1.js"></script>
        <script src="index.js"></script>
    </body>
</html>

index.js

$('#fire').on('click', function () {
  console.log('fire!')
  $.ajax({
    url: '/event',
    method: 'POST'
  }).done(function (data) {
    console.log('done')
    alert(data)
  }).fail(function (data) {
    console.log('fail')
    alert(data)
  })
})

$(function () {
  var socket = io.connect('http://localhost:8085')
  var container = $('.container')

  socket.on('event', function (bcevent) {
    console.log('got event')
    var newItem = '<p>EVENT</p>'
    container.append(newItem)
  })

  var jqxhr = $.post('/event', function () {
        // alert( "success" );
  })
        .done(function () {
            // alert( "second success" );
        })
        .fail(function () {
            // alert( "error" );
        })
        .always(function () {
            // alert( "finished" );
        })
})

非常感谢您的时间和精力。

2 个答案:

答案 0 :(得分:1)

问题是两件事的结果:

  1. 您在加载页面时发出请求:

    var jqxhr = $ .post('/ event',function(){

  2. 如果某些浏览器(包括Chrome)失败或未返回,则可能每两分钟重试一次请求。确保服务器中没有断点,服务器发送代码为200的响应。

答案 1 :(得分:1)

您的端点不会向客户端返回任何内容。在这种情况下,有些浏览器正在重试请求。

确保在发出事件后将一些结果返回给客户端,例如:

app.post('/event', function (req, res, next) {
  console.log('emit event');
  io.emit('event');
  res.status(200).send();
});