javascript - meteor :识别客户端并将数据发送到该特定客户端 - 在其他客户端上创建 block 元素

Question

我的 meteor 应用程序必须由同一用户在多台电脑上使用，但我必须防止同时使用该应用程序。问题是，用户会频繁地更换工作场所，因此每次用户更换电脑时都登录和注销并不是一个好主意。我想到使用临时注销/阻止屏幕:

示例:有五台 PC。用户已在所有五台 PC 上登录该应用程序。现在他想在 PC 1 上工作:在所有其他四台 PC 上，该应用程序将通过显示透明覆盖层而被暂时阻止。如果他要使用 PC 2，他可以通过键入一个小 PIN 来删除覆盖层(这比完全登录更快)，然后他就可以在这台 PC 上工作。

PC 1 将同时被阻止。

叠加层可能如下所示:

<div id="overlay" class="{{tempLogout}}">
    <input type="text" id="pin">
</div>

#overlay {
    display: none;
    position: fixed;
    width: 100%;
    height: 100%;
    background-color: rgba(0,0,0,0.8);
}

#overlay.logout {
    display: block !important;
}

在我的助手中我会这样做:

Template.anything.helper({
    tempLogout: function() {
        return (Session.get('currentClient') == clientID) ? '' : 'logout';
    }
});

现在，如果 Session 变量为 false，将显示叠加层。

我的问题是如何让不同的客户端知道用户当前正在使用哪个客户端。而且这些信息必须是 react 性的。

因此，在我的概念中，我会为每台 PC 创建一个随机 ID(也许已经存在任何选项来识别每个客户端？)并将此 ID 保存到 body 元素上的数据属性中:

$('body').attr('data-id', Random.id());

通过输入正确的 PIN，该 ID 将保存到用户集合中:

var clientID = $('body').attr('data-id');
Session.set('currentClient', clientID);
Users.update({ _id: Meteor.id() }, { $set: { 'currentClient': clientID } });

通过将 Session 变量设置为新的客户端 ID，所有其他客户端都将被阻止，因为 Session 变量是 react 性的。在这里，我不知道必须使用哪个存储: session 或集合。

也许有人有更聪明的主意来完成这件事。特别是我认为将 clientID 存储在数据属性中有点...... hacky？我如何将客户端 ID 获取到帮助程序中 - 因为必须检查 currentClient 是否相同，然后是 clientID...

Answer 1

我认为你的想法应该可行。您应该使用 Meteor.user()，这样您就不必订阅任何内容(在您的示例中，您使用通用集合 Users)。

您应该使用全局 clientID 并避免将其插入 html 中。像这样的东西:

  //on client
    clientID = Random.id(); //in Meteor a variable without var is global


Template.anything.helper({
    tempLogout: function() {
        return Meteor.user().profile.clientID == clientID ? '' : 'logout';
    }
});

插入正确的引脚时:

   Meteor.users.update({_id: Meteor.userId()}, {$set: {'profile.clientID':clientID}});

如果您想要启用/禁用多个模板，则必须使用 session 或全局模板助手。