Socket.io 多个页面

Question

我正在尝试使用 socket.io 创建聊天，我遇到了问题。

我想知道是否可以在我的项目的不同页面中重用我的 socket.id 而不会丢失我的套接字连接？

Answer 1

给定的 socket.io 连接仅属于一个特定页面。当用户浏览到新页面时（假设您没有使用单页应用程序 (SPA) 架构将新内容动态加载到同一母版页中），socket.io 连接关闭，新页面可以然后打开一个新的 socket.io 连接（会有不同的 socket.id）。

I want to know if it is possible to reuse my socket.id in my different pages of my project to not lose the connection of my socket?

不，当浏览器实际将整个新页面加载到当前 window/tab 时不会。

创建从一个页面转到下一个页面时持久化的某种 ID 的常用方法是将 ID 放入 cookie 中，然后该 cookie 将在用户浏览的每个新页面上可用，并且从一页到下一页将保持一致。

如果您在服务器上使用 express，您可以使用 express-session 为每个新用户自动创建一个持久会话，您甚至可以将数据存储在该会话对象中，该对象将在用户请求的每个页面上可用.

Answer 2

在页面刷新和导航时，您的套接字将断开连接，因此您可以使用此 trick.it 在我的场景中工作

假设你有一个多页面应用程序，在这里你可以做一个技巧，当你的套接字在页面加载时第一次连接时，你可以将会话 ID 分配给该特定连接，如 this.and然后将该连接绑定到该会话。

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

 socket.on('start-session', function(data) {
            console.log("============start-session event================")
            console.log(data)
            if (data.sessionId == null) {
                var session_id = uuidv4(); //generating the sessions_id and then binding that socket to that sessions 
                socket.room = session_id;
                socket.join(socket.room, function(res) {
                    console.log("joined successfully ")
                    socket.emit("set-session-acknowledgement", { sessionId: session_id })


            } else {
                socket.room = data.sessionId;  //this time using the same session 
                socket.join(socket.room, function(res) {
                    console.log("joined successfully ")
                    socket.emit("set-session-acknowledgement", { sessionId: data.sessionId })
                })
            }
        });

现在您已经将套接字连接绑定到一个会话，现在您也在客户端发送一个确认。您可以做的是像这样将会话 ID 存储到 Web 浏览器会话存储中

在客户端代码

 socket.on("set-session-acknowledgement", function(data) {
  sessionStorage.setItem('sessionId', data.sessionId);

 })

当页面从 page1 导航到 page2 等时，这会将会话 ID 存储在浏览器会话 storage.Now 中。然后将该会话 ID 发送到服务器，这样您就可以像这样在逻辑上连接到同一个会话

  var session_id;
            // Get saved data from sessionStorage
            let data = sessionStorage.getItem('sessionId');
            console.log(data)
            if (data == null) {
                session_id = null//when we connect first time 
                socket.emit('start-session', {  sessionId: session_id })
            } else {
                session_id = data//when we connect n times 
                socket.emit('start-session', {  sessionId: session_id })
            }

所以基本上背后的逻辑是我们可以通过这样做为多个套接字连接使用相同的会话，因为每次套接字将仅加入那个特定的房间并发出您可以在服务器端监听的事件，反之亦然反之亦然。

Socket.io 多个页面

Socket.io multiple pages

chat

node.js

socket.io