TogetherJS

要添加到您的Web应用程序的实时协作?Mozilla的 togetherjs值得一看。

当Tim Berners Lee发明了万维网超过20年前,他在那个物理学家能够合作很容易与另一个在互联网上的希望了。此后,网络已经演变成一种新的媒体处理一切从报纸到金融。

然而,虽然我们可以惊叹的事情我们可以做大量时下网络上,最初的想法,把它所有的合作,仍然是一个梦想。当然,我们有点像 GitHub,这 Git版本控制系统提供一个网络接口。当然,我们有很多的写作系统,如 WordPress,让许多人创造(出版)。还有脸谱网,有时可以被视为协同。

但如果你真的想一想,我们还没有无缝协作的那种我们原本以为可以通过网络。当然,我可以工作的东西,交给别人,然后再当他们做它,但它仍然是比较少见有协同工具。

也许最为复杂和广泛的实时,基于Web的协作是谷歌Docs(现称,我认为,谷歌驱动。这是真的,谷歌的应用程序有可能使存储您的文件在云中,现在人们喜欢说。当然也能方便地读取文件和写你的任何地方,只要你有一个Web浏览器。但真实的力量我,谷歌Docs是许多不同的人合作。可以工作在同一个文件,他们可以这样做甚至。我发现这种合作是宝贵当我不得不和其他几个人的工作放在几年前一个项目的预算。事实上,我们都可以,从我们自己的电脑,在房时间编辑同一个电子表格是非常有用的。

有一些开源的替代谷歌的Word 处理器以及。Etherpad是作为一个开源项目发布后其作者几年前谷歌收购。你可以下载和安装你自己 EtherPad,或者你可以利用一个现有 EtherPad服务器在线。另一个有趣的应用是 ACE,令人印象深刻的协同能力的基于浏览器的程序编辑器。

现在,我不认为所有的合作需要在房时间。有人交流开源世界的许多例子和合作的情况,使用电子邮件和Git 往往相当有效地一起工作,没有实时协作似乎提供的钟声和口哨声。

然而,对我们大多数人来说,没有一个实时构件合作总是缺了点什么。这将是伟大的我不仅要能够谈论一个网站的人,也要看它(和编辑内容)与他们相处,实时。是的,有屏幕共享系统,如VNC,Join.me和screenhero,但他们要求您在您的计算机上安装的东西,你激活它。

这就是为什么我成为一个项目的 Mozilla基金会称为togetherjs赞助感兴趣。顾名思义, togetherjs是基于JavaScript的,实时协作。的印象最深刻的一件事,在我看来,是多少togetherjs提供开箱,很少或没有配置。它可以让你添加一些简单的元素每一页,使你的网站更协同。

所以在这篇文章中,我想看看TogetherJS所做的,你怎么可以将它添加到自己的网站,你甚至可以把你的应用它,创建你自己定制的合作经验。

TogetherJS是什么?

togetherjs项目是Mozilla基金会的赞助(最好著称的Firefox浏览器和Thunderbird电子邮件客户端)。 Mozilla已经开发工具在过去数和释放越来越多的有趣的开源年,其中 togetherjs是最近的一个。(在最近几个月,对实例,Mozilla还发布了角色,试图让你登录到多个网站使用一个单一的身份,没有把它营利性公司。)togetherjs发布了“Mozilla 实验室”,,从名字和描述,表明这是Mozilla 提供了新的思路和技术实验。

在技术层面上,togetherjs是客户端-服务器系统。的客户端是一个JavaScript库,或者更准确地说,一套 JavaScript库加载到一个网页,然后连接到一个服务器。服务器所发送,在 togetherjs的说法称为“枢纽”,运行在Node.js JavaScript的服务器系统,在过去几年变得相当流行。轮毂作为一个简单的接线员,运行WebSockets,低开销的协议设计的实时。因此,如果有十人使用togetherjs,分成五对的合作者,他们都可以用同样的枢纽,但中心将确保传递信息仅对合适的合作者。

安装togetherjs网站上是非常容易的。你首先需要加载的togetherjs库到你的网页。这是通过在Web应用程序中添加以下行做:

<script src="https://togetherjs.com/togetherjs-min.js"></script>

当然,你也可以举办的JavaScript文件放到自己的服务器上,要么因为你想保持它的私有或内部,或者如果你是修改它,或者如果你只是不喜欢它每次升级 Mozilla发布了一个新的。

JavaScript文件实际上并没有做太多的自己。相反,它查看是否你想下载一个最小化的版本的代码。基础上,决定是否下载所有的代码在单个文件中或在单独的。无论你如何下载 togetherjs,上述线路确保JavaScript组件是准备工作。

当然,它没有足够的安装脚本。有人需要激活并使用它,这意味着安装一个按钮网站会这样做。再次,由于 togetherjs的构建方式,这是很简单的。你可以安装以下:


<button id="start-togetherjs" type="button"
        onclick="TogetherJS(this); 
    ↪return false">Start TogetherJS</button>

换句话说,你创建一个按钮,点击后调用 togetherjs功能。当用户点击这个按钮,他们将被添加到TogetherJS 。现在,这真的很无聊;如果你 togetherjs自己运行,它不会似乎做的很。一旦你点击togetherjs按钮,通过单击和首次推出后,你马上会给出一个链接,标记为“邀请朋友”。在我看来,运行这8000我的端口服务器,我得到 HTTP:/ / 8000 / togetherjs勒纳。il:HTML #和togetherjs =。

你可以看到,TogetherJS特别邀请URL结合你自己的网页的URL ,随着令牌的唯一标识会话。这让人多套合作相同的页面,每个集合在它自己的存在,孤立的环境。

例如,togetherjs.html(清单1)是一个文件,我把我的服务器上。我开了两个单独的浏览器,页面上,一经直接URL和二利用上面显示完整的URL,以具体确认令牌。一旦浏览器指向网站,一旦用户已经确认他们在合作,利用togetherjs兴趣,我发现无论是用户可以修改的“文本”标签的内容,而不管是谁的打字,变化立即反映在其他人的计算机。此外,每次点击鼠标图形显示。如果一个用户进入一个不同的网页(假设togetherjs图书馆在其他页面一样), togetherjs会问其他用户如果他或她想。

清单1。togetherjs.html

<!DOCTYPE html>
<html>
  <head>
    <h3>Collaborate!</h3>
  </head>
  <body>
    <h1>Collaborate!</h1>
    <textarea>Hello out there!</textarea>
    <script src="https://togetherjs.com/togetherjs-min.js">
    ↪</script>
    <div id="togetherjs-div">
      <button id="start-togetherjs" type="button"
              onclick="TogetherJS(this); return false"
              data-end-togetherjs-html="End TogetherJS">Start
               ↪TogetherJS</button>
    </div>
  </body>
</html>

配置和定制

它的伟大和神奇,TogetherJS这么好,在立即安装它。不过,也有方法可以配置 togetherjs,所以它会反映你的需求。因为 togetherjs加载的方式,建议在togetherjs你让这些配置设置已加载。对于例子:

<script>
    var TogetherJSConfig_siteName = "Reuven's page";
</script>
<script src="https://togetherjs.com/togetherjs-min.js">

所有的配置变量开始togetherjsconfig_和的名字是相当的描述。一个完整的列表,在 togetherjs遗址http:/ / togetherjs。COM /文档/ #配置togetherjs,但你也可以通过together.js代码,其中包含描述什么配置变量做评论。

例如,如果你决定你想运行自己的中心(即一个消息传递,WebSockets基于服务器),你必须告诉 togetherjs看在不同的位置,用togetherjsconfig_hubbase

其他有用的配置变量:

  • togetherjsconfig_useminimizedcode:下载最小化 JavaScript文件为TogetherJS其它。

  • togetherjsconfig_invitefromroom:让你觉得协作站点范围的基础上。

  • togetherjsconfig_youtube:当设置,这意味着,如果一个个人看法的一个YouTube视频,每个人都会,他们将同步。

但是,togetherjs提供的不仅仅配置和使用它的能力。你也可以扩展它。同样的消息传递系统, togetherjs使用本身是提供给开发者。因此,你可以发送任意短信,任意的事件,所有的人目前这个系统之间的合作。

为了发送任意JSON消息,各方涉及需要同意的消息“型”,字符串的使用来确定你的消息。各方也需要登记接收该型信息的兴趣和定义一个回调函数将火时的消息发送。虽然这样做有意义的在应用程序中的HTML或 JavaScript,在你的浏览器的JavaScript控制台做也有可能。

首先,告诉togetherjs,每当收到一个从轮毂某种类型的信息在你的对象你感兴趣的登记(使用togetherjs.hub.on方法),它应该火一个特定的回调:

TogetherJS.hub.on("reuvenTest",
        function (msg) {
            console.log("message received: " + msg)
 }
);

现在,这是真的,因为你的消息是一个对象,它将印有“[对象]“Web控制台,这真是太坏。如果你喜欢,你可以选择从对象的各个领域,但可以肯定你的领域你会知道。

发送邮件时,只需调用togetherjs.send随着一个JSON 对象将这个通道发送到所有其他togetherjs用户。有没有办法将消息发送到一个特定的计算机;这样的模式是类似于你可能看到 Web实时更新推pubnub去年。

发送邮件时,可以使用以下:

TogetherJS.send({type: "reuvenTest", foo: 
 ↪'foofoo', bar: 'barbar'});

我应该注意到,这两个方法都返回未定义的来电。通常情况下,这不是一个问题,但是如果你在控制台工作,你可能不会想到这样一个响应。

当然,这个通信信道的功率是你想传达什么决定,和发生在通信是怎么。当消息到达时,你想改变什么显示在接收者的屏幕的方式吗?做你想做的为用户显示一个消息?

结论

TogetherJS是比较新的,和我仍然在早期阶段的用它在我的应用程序的实时协作的需要。说,TogetherJS是一个有趣的应用程序在其本身,,它被设计为一个平台,将继续发展和扩大。与togetherjs,我们是一个额外的步骤接近使用Web 为新的和不同的。

资源

对于togetherjs主页http://togetherjs.com,但GitHub 页https://github.com/mozilla/togetherjs。你可以使用 togetherjs与任何现代浏览器,这基本上意味着它的不支持Internet Explorer。我可以让它与火狐,Chrome和Safari(OS X)没有任何问题。注: togetherjs明确表示它不支持互联网探险家很好,包括最新的版本,这意味着,如果你工作在一个混合的是环境,它可能不是一个好。





  • 1
    点赞
  • 1
    收藏
    觉得还不错? 一键收藏
  • 0
    评论

“相关推荐”对你有帮助么?

  • 非常没帮助
  • 没帮助
  • 一般
  • 有帮助
  • 非常有帮助
提交
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值