Question

我有一个使用node.js和socket.io进行实时鼠标移动的简单示例。

当我想将它包含在任何html网站上时，我必须连接到node.js服务器：

<script src="/socket.io/socket.io.js"></script>

var socket = io.connect('http://localhost:3000');

$(document).mousemove(function(e) {
  socket.emit('movement', {
    'id': socket.id,
    ..
  });
});

// more code later..

我想提供其他人跟踪他们的网站。大多数应用程序都需要插入这样的代码（当然是异步 - 不是这么简单）：

<script src="http://localhost:3000/connect.js"></script>

这也是我想要处理它的方式。我应该将socket.io.js +我的代码的内容复制并粘贴到connect.js中吗？

这是一种很好的方法，或者将随机网站连接到我的node.js服务器的更好方法是什么？

Answer 1

您正在寻找的是允许Web客户端连接到您的Web套接字服务器的脚本。

您可以创建一个文件：

加载一些库，如jQuery和/或socket.io（其他网站可能没有加载这些库）
然后执行您的应用程序逻辑

因此，您需要在应用程序逻辑之前加载库。

像这样：

// embedded-script.js

// You can use this simple function to load the libraries you need
function loadScripts(scripts, complete) {
    var loadScript = function( src ) {
        var xmlhttp, next;
        if (window.XMLHttpRequest)  {
            xmlhttp = new XMLHttpRequest();
        } else {
            try {
                 xmlhttp = new ActiveXObject("Microsoft.XMLHTTP");
            } catch(e) {
                return;
            }
        }
        xmlhttp.onreadystatechange = function() {
            if (xmlhttp.readyState == 4 && xmlhttp.status == 200) {
                eval(xmlhttp.responseText);
                next = scripts.shift();
                if ( next ) {
                    loadScript(next);
                } else if ( typeof complete == 'function' ) {
                    complete();
                }
            }
        }
        xmlhttp.open("GET", src , true);
        xmlhttp.send();
    };
    loadScript( scripts.shift() );
}

// load the libraries you need
loadScripts([
  "https://cdnjs.cloudflare.com/ajax/libs/jquery/2.2.0/jquery.min.js", // assuming you need jQuery
  "https://cdnjs.cloudflare.com/ajax/libs/socket.io/1.5.0/socket.io.min.js"
], function() {
   // libraries loaded.
   // your application logic here
});

然后给网站所有者这个嵌入代码：

<script src="http://your-domain.com/embedded-script.js"></script>

一些注意事项：

在CDN中分发您的脚本
如果您的应用程序逻辑涉及大量文件，那么您可能需要一个模块加载器来处理脚本。例如。 requirejs
我建议你不要在mousemove上发出socket消息！这对你的服务器来说太过分了。您应该使用较便宜的东西更改鼠标跟踪逻辑，例如，使用a throttle or a debouncer包裹发射或只需跟踪鼠标点击。

通过外部js实时跟踪鼠标

1 个答案: