TogetherJS 是一个免费、开源的 JavaScript 库,来自 Mozilla 实验室,可以实现基于 Web 的在线协作功能。把 TogetherJS 添加到您的网站中,您的用户可以在实时的互相帮助!当然还有很多其它的可以应用的场合,值得一试。
TogetherJS 是由 Mozilla 打造的一款可以给网站添加实时协作功能的 JavaScript 库,TogetherJS 免费并且开源,遵循 MPL 2.0 开源协议,并且托管在 Mozilla 服务器上。
1、把下面这段 JavaScript 代码拷贝到源码中:
- <script src="https://togetherjs.com/togetherjs-min.js"></script>
2、添加 HTML Button 按钮
把上面那段代码拷贝到源码后,再拷贝下面这段代码到网站中:
- <button onclick="TogetherJS(this); return false;">Start TogetherJS</button>
TogetherJS 分为两大部分,一个是 hu 文件夹中的服务端;另外一个是 TogetherJS 文件夹中的 Together.JS 文件,包含了所有的网页文字、语音等操作。
需要预先安装Node.js,可以百度到。
1、去 Githu 中下载 TogetherJS 最新的代码。
2、解压之后,在 cmd 的窗口中进入文件夹,假设解压后文件夹是 togetherjs,则 cd togetherjs
3、输入 npm install websocket optimist,下载 websocket 的库,此处需要 Node.js 支持
4、输入node hub/server.js 启动服务,即启动 hu 文件夹中的 server.js
5、官方的体验方式是,在 HTML 中加入以下两段,则可以体验试用:
- <script src="https://togetherjs.com/togetherjs-min.js"></script>
- <button onclick="TogetherJS(this); return false;">Start TogetherJS</button>
即引用一个 JS,在新建一个 Button 调用函数。如果本地部署,需要在引用 JavaScript 之前先加一段
- <script>
- TogetherJSConfig_hubBase = "http://localhost:8080";
- //这个是你本地服务器地址
- </script>
此外 Script 的引用 src 也要改成本地文件夹内的 together.js
6、然后打开浏览器的开发者工具,把 JS 里面的一些资源路径全部改好。(原来的资源路径、扩展名等都是乱的)
7、最后还是会报 assert 错误,打开 together.js 文件,把 https://togetherjs.com/togetherjs-min.js 里面的 togetherjs-min.js 下载下来,用对比工具对比一下,发现时 baseUrl 这个参数的初始值有问题。在 min.js 里面,会从他官网服务器上加载一个 togetherjsPackage.js,但是本地服务器没有,(通过开发者工具找到地址)拷贝下来放到本地服务器,并修改 baseUrl 的地址为本地服务器的。
8、此时打开网页,已经能在本地部署访问了。
9、想抽取语音、视频聊天部分出来,可以去 togetherjsPackage.js 里面找,所有的操作都在这个 JS 里面完成的。