Socket.io: 브라우저 새로 고침 시 이전 연결로 내보내고 이전 연결 유지

에 만든 2016년 02월 01일 · 4코멘트 · 출처: socketio/socket.io

안녕,

현재 Date()를 단일 클라이언트로 보내는 간단한 socket.io 서버 테스트 설정이 있습니다.

1초마다 서버는 Date()를 하나의 클라이언트에 보냅니다(방출).

브라우저 창을 새로 고치면 여전히 하나의 연결이 있지만 서버는 두 개의 연결을 내보냅니다.

브라우저 창을 새로 고치면 여전히 하나의 연결이 있지만 서버는 세 개의 연결을 내보냅니다.

브라우저 창을 새로 고치면 여전히 하나의 연결이 있지만 서버는 4개의 연결을 내보냅니다.

등등 등등...

몇 시간이 지난 후에도 연결이 끊긴 클라이언트는 여전히 서버에서 내보내고 있습니다.

클라이언트가 연결되지 않은 상태에서 서버가 이전 연결을 끊거나 닫을 것으로 예상했습니다.

이것은 예상된 동작입니까?

Node v5.4.1과 함께 Socket.io v1.4.5를 사용하고 있습니다.

다음은 코드 샘플입니다.

io.on('connection', function (socket) {

  // console.log(socket.connected);
  console.log('===================');

  setInterval(() => {
    console.log(socket.conn.id);
    socket.emit('data', { ts: new Date() });
  }, 1000);

});

다음은 2초마다 브라우저를 새로 고칠 때의 console.log 출력입니다.

각 브라우저 새로 고침에 대한 socket.conn.id가 내보내지는 것을 볼 수 있습니다.

❯ node app.js                                                                                                                                       ⏎
===================
kkizbfn-82gNOsyAAAAA
kkizbfn-82gNOsyAAAAA
===================
kkizbfn-82gNOsyAAAAA
m_ft38Y4XEY7W97VAAAB
kkizbfn-82gNOsyAAAAA
m_ft38Y4XEY7W97VAAAB
===================
kkizbfn-82gNOsyAAAAA
m_ft38Y4XEY7W97VAAAB
xH09a5Olle4A-HSNAAAC
kkizbfn-82gNOsyAAAAA
m_ft38Y4XEY7W97VAAAB
xH09a5Olle4A-HSNAAAC
===================
m_ft38Y4XEY7W97VAAAB
xH09a5Olle4A-HSNAAAC
kkizbfn-82gNOsyAAAAA
_GmZXIXg8VgUrdKlAAAD
m_ft38Y4XEY7W97VAAAB
xH09a5Olle4A-HSNAAAC
kkizbfn-82gNOsyAAAAA
_GmZXIXg8VgUrdKlAAAD

많은 시간이 지난 후에도 연결된 클라이언트(브라우저)가 없어도 이전 연결이 계속 내보내지고 있습니다.

출처

rudijs

가장 유용한 댓글

@StevenBock 아 알았어 .. 네 다 좋습니다 - 감사합니다!

이 다른 예와 동일한 문제가 있습니다.

파일에 꼬리를 붙이고 각 새 줄을 클라이언트에 보내고 싶습니다.

npm 'tail' 모듈을 사용하면 이 코드는 정상적으로 작동하지만 이전 연결 문제를 유지하는 데 문제가 있습니다.

const io = require('socket.io')(8080);

const Tail = require('tail').Tail;
const tailTmpFile = new Tail("./tmp.txt");

io.on('connection', function (socket) {

  console.log(socket.conn.id);

  tailTmpFile.on("line", function (data) {
      console.log('emitting Yes: ', socket.conn.id);
      socket.emit('file', { data: data, ts: Date() });
  });

});

어떻게든 소켓 연결이 끊길 때 꼬리 이벤트(tailTmpFile.on)를 처리해야 합니다.

rudijs 에 2016년 02월 01일

❤1 😕1 🎉1 😄1

모든 4 댓글

clearInterval을 사용하여 연결 해제 시 간격을 지워야 합니다.

var oneSecondInterval = setInterval(() => {
    console.log(socket.conn.id);
    socket.emit('data', { ts: new Date() });
  }, 1000);

socket.on('disconnect', function(){
    clearInterval(oneSecondInterval);
});

이렇게 하면 이전 연결을 유지하지 못하게 됩니다.

StevenBock 에 2016년 02월 01일

@StevenBock 아 알았어 .. 네 다 좋습니다 - 감사합니다!

이 다른 예와 동일한 문제가 있습니다.

파일에 꼬리를 붙이고 각 새 줄을 클라이언트에 보내고 싶습니다.

npm 'tail' 모듈을 사용하면 이 코드는 정상적으로 작동하지만 이전 연결 문제를 유지하는 데 문제가 있습니다.

const io = require('socket.io')(8080);

const Tail = require('tail').Tail;
const tailTmpFile = new Tail("./tmp.txt");

io.on('connection', function (socket) {

  console.log(socket.conn.id);

  tailTmpFile.on("line", function (data) {
      console.log('emitting Yes: ', socket.conn.id);
      socket.emit('file', { data: data, ts: Date() });
  });

});

어떻게든 소켓 연결이 끊길 때 꼬리 이벤트(tailTmpFile.on)를 처리해야 합니다.

rudijs 에 2016년 02월 01일

❤1 😕1 🎉1 😄1

@StevenBock 좋습니다. 알겠습니다.

이 코드는 연결 해제 시 이벤트 리스너를 제거합니다.

io.on('connection', function (socket) {

  console.log(socket.conn.id);

  var emitLine = function () {
    var callback = function (data) {
      socket.emit('file', { data: data, ts: Date() });
    }
    tailTmpFile.on("line", callback);

    // dispose function
    return function() {
      tailTmpFile.removeListener('line', callback);
    }
  }();

  socket.on('disconnect', function () {
    // dispose tail file listener
    emitLine();
  });

});

시간을 내어 답변해 주셔서 감사합니다. 정말 올바른 방향으로 안내해 주었습니다.

건배.

rudijs 에 2016년 02월 01일

도움이 되어 기쁩니다!

StevenBock 에 2016년 02월 01일

이 페이지가 도움이 되었나요?

0 / 5 - 0 등급

Socket.io: 브라우저 새로 고침 시 이전 연결로 내보내고 이전 연결 유지

가장 유용한 댓글

모든 4 댓글

관련 문제