在多个客户端之间使用paperJS创建唯一路径时遇到问题

Question

因此，我刚刚开始使用Web套接字，并且我试图让多个人从各自的浏览器在同一画布上绘制。

问题是，（通常）在浏览器2中启动新的paperJS路径的情况往往（总是）会连接到在浏览器1中绘制的路径的结尾。

var colors = ['black', 'green', 'red', 'pink', 'orange', 'purple', 'magenta', 'cyan', 'blue', 'gray'];

    var selfPath = new paper.Path();
  var publicPath = new paper.Path();

  var randomIndex = Math.floor((Math.random() * 10000) % colors.length);
    selfPath.strokeColor = colors[randomIndex];
    publicPath.strokeColor = colors[randomIndex];

  tool.onMouseDown = function(event) {
    selfPath = new paper.Path();
    publicPath = new paper.Path();
    selfPath.strokeColor = colors[randomIndex];
    selfPath.add(event.point);
    console.log(selfPath);
  }

  tool.onMouseDrag = function(event) {
    selfPath.add(event.point);

       var d = JSON.stringify(event.point);
      d = d.substring(0, d.length -1);
      d = d + ',"' + colors[randomIndex] + '"]';
      socket.send(d);

  }

  tool.onMouseUp = function(event) {
    selfPath = new paper.Path();
    publicPath = new paper.Path();

  }

    socket.onmessage = function(data) {
      var c = JSON.parse(data.data);
      publicPath.strokeColor = c[3];
      publicPath.add(new paper.Point(c[1], c[2]));
      //publicPath = new paper.Path();

    }

这是问题的图像：

在右侧浏览器中第二条画出了蓝线，如您所见，在左侧浏览器中自动连接了从青色线的末端到蓝色开始的路径。

我一直在研究这个问题，试图弄清楚它并没有取得任何进展，希望能朝着正确的方向前进！谢谢！