Meteor 中文文档 (PS: Reactive Programming 用中文怎么说？)
发布于 2年前 作者 DavidXuQQ839305878 3608 次浏览

GitHub: https://github.com/aleechou/meteor-doc-cn/blob/master/document.md

（求个NAE邀请码）

Meteor 是一个建立现代网站的极简单环境. 在过去即使使用最好的工具，也需要数周的时间，使用Meteor只需要几个小时。

Web 最早在70年代专门为大型机所设计. 应用服务器渲染完整个屏幕，然后在网络上发送给哑终端. 无论用户做什么事情，服务器都会重新渲染整个屏幕. 在过去的十几年中，这个模式在 Web 上工作得很好. 它成就了 LAMP, Rails, Django, PHP 等技术。

但是现在，一些优秀的团队，他们拥护充足的预算和时间，开始在客户端使用Javascript 构建应用程序. 这些应用程序的界面是固定的. 它们不重新载入页面. 它们具有“反应性”（reactive）: 改变会从某个客户端立即显示到所有人的屏幕上.

他们构建这些采取了困难的方案. Meteor 可以使之变得非常简单和有趣. 你可以选择在周末，或是弥漫着咖啡香气的黑客聚会上，来构建一个完整的应用. 你再也不需要准备服务器资源, 在云上部署API端点, 管理数据库, 争论是否使用ORM层, 在前端JavaScript和后Ruby之间反复交换, 以及当数据失效时广播给所有客户端.

Meteor 是一项正在开展的工作, 我们希望它能够展现出我们所思考的方向. 我们乐于听到你的反馈意见.

— Geoff, Nick, Matt, David, Avital, and David

快速开始！

接下来的任务，所有的支持的平台。

安装 Meteor：

$ curl https://install.meteor.com | /bin/sh

新建一个项目：

$ meteor create myapp

在本地运行：

$ cd myapp
$ meteor
Running on: http://localhost:3000/

释放到 world (我们提供的免费服务器)上：

$ meteor deploy myapp.meteor.com

七项“纪律”

  • 数据上线。不要在网络上发送HTML。发送数据，然后让客户端决定如何渲染它们。
  • 统一语言。在服务器端和客户端统一使用 JavaScript 语言。
  • 数据库随处可用。在客户端或服务器使用相同的透明API来访问你的数据库。
  • 延迟补偿。在客户端使用预取和模型模拟，以使数据库连接看上去是零延时的。
  • Full Stack Reactivity。使默认是实时的。所有的层，从数据库到模板，应该是有有效的事件驱动接口。
  • 拥抱社区。Meteor 开放源代码，并且整合而不是替代已存的开源工具和框架。
  • 简单等同效率。让事情看上去简单的最好的办法，就是让它根本就很简单。通过干净、经典、优美的API来达成。

开发者资源

如果 Metero 已经引起了你的兴趣，我们希望你能参与到项目中来

STACK OVERFLOW

提出（还有解答！）技术问题最好的地方就是Stack Overflow.记得在你的问题上加个“meteor”标签。

邮件列表

我们有两个邮件列表。meteor-talk@googlegroups.com 用于常见问题，请求帮助，和新项目公告。meteor-core@googlegroups.com 用于 Meteor 内部讨论和建议调整。

IRC

irc.freenode.net 上的 #meteor 频道。开发者们挂在这里随时回答你的问题，尽其所能。

GITHUB

代码放在GitHub上。为 Metero 打个补丁最好的办法，就是在 GitHub 上发送个“求拉“”请求。记录一个bug的最好方式，就是用 GitHub 的 bug tracker。

#概念 我们靠手工写单页的 JavaScript 应用。写一个完整的应用，用同一种语言(JavaScript)，同一种数据格式(JSON)，是一件相当有趣的事。Meteor 就是我们写这些应用所需要的全部。

构造你的应用程序

一个 Meteor 应用程序，混合了运行在客户端浏览器中的JavaScript，运行在 Meteor 服务器 Node.js 容器内的 JavaScript，以及所有 HTML 片段，CSS 规则，以及其他的静态资源。Meteor自动打包和传输这些不同内容。并且，你可以在你的文件树中相当灵活地组织这些内容。

唯一的服务器资源就是 JavaScript 。Meteor 聚合你的所有 JavaScript 文件，除了 client 和 public 子目录下的文件，然后将他们集中在一起加载到 Node.js 服务器实例中。在 Meteor 中，你的服务器端代码针对每一个请求都运行在一个单线程中，而不是典型的Node风格的异步回调函数中。我们发现在 Metero 应用程序里，线性的执行模式更适合典型的服务器代码。

考虑到客户端有很多资源。Meteor 为客户端将你目录树里所有 server 和 public 子目录以外的 JavaScript 文件聚在一起。它会最小化捆绑并发送给新访问的客户端。你可以为你的应用程序自由选择，使用一个单文件 JavaScript ，或彼此独立的文件，或者两者之间的形式。

client、server 和 tests 以外的文件，在客户端和服务器端两边都会被加载！那是定义模型和其他函数的地方。Meteor 提供了两个变量 isClient 和 isServer，这样你的代码可以根据他们是运行在客户端还是服务器来改变行为。（名为 tests 目录内的文件不会加载到任何地方。）

任何你不希望发送给客户端的代码，例如包含了密码或认证机制的代码，都应该保持在 server 目录内。

另外 CSS 文件会被集中在一起：客户端会得到一个含有你的目录树下的所有CSS文件的“捆绑”（不包括 server 和 public 子目录）。

在开发模式下，JavaScript 和 CSS 文件会为了调试方便而单独发送。

HTML文件在 Meteor 应用程序中被处理的方式和普通服务器端框架稍有不同。Meteor 扫描你目录内所有HTML文件中的3个顶层元素：<head>,<body>,和<template>。head 和 body 区会分别包含到初始载入页面的head 和 body 中，并发送给客户端。

模板区则会被转换成 Template命名空间下的 JavaScript 函数。这是一个将 HTML 传递给客户端的非常方便的方式。参考后面的模板章节。

最后，Meteor 会伺服 public 目录下的任何文件，和 Rails 或 Django 项目一样。这是放图片、favicon.ico、robots.txt 和其他文件的地方。

It is best to write your application in such a way that it is insensitive to the order in which files are loaded，例如使用 Meteor.startup，或者将加载顺序敏感的代码放到智能包中，它能明确地控制它们的内容的加载顺序，已经它们所依赖的包的加载顺序。不过有时候在你的应用程序中，加载顺序依赖仍然是无法避免的。应用程序中的 JavaScript 和 CSS 文件的加载顺序依据以下规则：

  • 应用程序根目录下的 lib 目录里的文件最先加载。
  • 然后是所有文件名匹配 main.* 的文件。
  • 子目录里的文件在父目录之前加载，所以先加载最深层的文件，根目录下的文件最后加载。
  • 在一个目录中，文件按照文件名的字母顺序加载。

这些规则叠加作用，就是说，举个栗子，在 lib 目录内，文件首先都是按照文件名的字母顺序来加载的，然后有一些 main.js 文件，在这些文件当中，子目录下的会加载得早一些。

数据和安全

Meteor能使分布在客户端的代码，简化到就像访问本地数据库一样。干净、简单，并且安全，不需要实现一个个 RPC 端点，人为地在客户端缓存数据以避免和服务器之间来回传递，当数据发生变化时小心地协调所有的客户端。

在 Meteor 中，客户端和服务器共享相同的数据库API。完全相同的应用程序代码——例如校验器和计算好的属性——常常能在两个地方运行。但是代码在服务器上运行时，是直接访问数据库，而在客户端则不是。这个差异是 Meteor 的数据安全模式的基础。

一个新的 Meteor 应用默认包含了 autopublic 和 insecure 包，它们模拟客户端拥有对服务器数据库的完全读/写能力。这是个有用的原型工具，但是对于发布级产品并不合适。你在发布之前应该删除这两个包。

每个Meteor客户端都包含一份保留在内存中的数据库缓存。服务器发布JSON文档集合(sets of JSON documents)，客户端订阅这些文档集合，以管理客户端的缓存。当集合中的文档发生变化时，服务器发送“补丁”给每个客户端缓存。

每个文档集合都由客户端上的“发布”函数(publish function)定义。每当有一个新的客户端订阅文档集合时就执行“发布”函数。文档集合中的数据可以来自任何地方，但是最常见的情况是发布(publish)一个数据库查询。

// 服务器: 发布所有房间的文档
Meteor.publish("all-rooms", function () {
  return Rooms.find(); // everything
);

// 服务器: 发布给定房间的所有消息
Meteor.publish("messages", function (roomId) {
  return Messages.find({room: roomId});
});

// 服务器: 发布登陆用户能看到的所有聚会的集合
Meteor.publish("parties", function () {
  return Parties.find({$or: [{"public": true},
                   {invited: this.userId},
                   {owner: this.userId}]});
});

发布函数可以给每个客户端提供不同的结果。在上面的例子当中，登陆用户只能看到公开的、用户拥有的，和用户被邀请的聚会。

一旦订阅，客户端使用它的缓存就像高速本地数据库一样，代码简单得出奇。读取时从来不需要在服务器的往返之间消耗。缓存中的内容会被限制：在客户端查询表(collection)中的文档时，只有服务器发布给客户端的文档会被返回。

// 客户端：开始一个聚会订阅
Meteor.subscribe("parties");

// 客户端：返回这个客户端能够读取的聚会数组
return Parties.find().fetch(); // 同步的!

完备的客户端能开启或关闭订阅，以控制如何保持缓存和管理网络流量。当一个订阅被关闭，它的所有文档都会从缓存中删除，除非另一个激活的订阅提供了相同的文档。

当客户端改变了一个或多个文档，它会发送一个消息到服务器来请求这个改动。服务器通过一个你以JavaScript函数形式写的允许/拒绝规则集，来检查这个改变提议。只有当所有规则都通过时，服务器才接受改变。

// 服务器: 不允许客户端插入一个聚会
Parties.allow({
  insert: function (userId, party) {
    return false;
  }
});

// 客户端: 这个操作会失败
var party = { ... };
Parties.insert(party);

如果服务器接受改变，就会讲变化应用到数据库，并且自动将改变散布给其他订阅了受影响文档的客户端。如果不接受，更新操作失败，服务器上的数据库不变，也没有其他客户端会看到更新。

Meteor 有个聪明的机制。当客户端提议写入服务器，它就会立刻更新自己的本地缓存，不需要等待服务器的回应。这意味着屏幕会立刻重绘。如果服务器接受改变——在行为合理的客户端中大部分情况下都会如此——客户端更新屏幕不需要等待服务器。如果服务器拒绝改变，Metero 用服务器的结果来修正客户端的缓存。

言而总之，这些技巧实现了延迟补偿。客户端用户它所需的最新数据，并且从来不需要等待和服务器之间的往返。当客户端修改数据，这些改动会在本地立即执行而不会等待来自服务器的确认，但服务器对改变请求给出最终定夺。

Meteor包含了Meteor账户，一个文艺范儿的认证系统。主要体现在登陆密码所使用远程安全密码协议(Secure Remote Password protocol)，外部服务整合，包括Facebook，GitHub，Google，Twitter，还有新浪微博。Meteor账户定义了一个名为Meteor.users的表(collection)，开发者可以在里面存放一些应用程序特定的用户数据。

Meteor还为一些通常的任务预建了表单，例如登陆，注册，修改密码，用邮箱来修改密码。你能用一行代码就添加一个账户界面到你的应用中。账户界面甚至还明智地打包了一个配置向导，来引导你在你的应用里安装外部登陆服务。

Meteor 当前版本支持 MongoDB，流行的文档数据库，这儿有使用[]MongoDB API](http://www.mongodb.org/display/DOCS/Manual)的例子。未来会支持其他数据库。

Reactivity

Meteor 拥抱无功编程(reactive programming)的概念。这意味着，你可以以简单的命令风格写代码，然后结果自动重新计算当你的代码依赖的数据变化时。

Meteor.autosubscribe(function () {
  Meteor.subscribe("messages", Session.get("currentRoomId"));
});

这个例子（来自聊天室客户端）装置了一个基于会话(session)变量 currentRoomId 的数据订阅。Session.get(“currentRoomId”) 因为任何原因发生变化，函数就会自动重新运行，装置一个新的订阅来替换之前的。

自动重计算靠 会话(Sessiong)和 Meteor.autosubscribe 的合作来实现。Meteor.autosubscribe这类方法在其跟踪的数据依赖项内安置一个“reactive 上下文(context)”，然后准备重新执行所需的必备参数。另一方面，数据提供者例如Session，在这个上下文中记录下他们被谁调用和哪些数据被请求，然后准备好当数据改变时发送一个失效信号。

这个简单的模式（reactive上下文 + reactive数据源）用途广泛。程序员不必写取消订阅/重新订阅的调用代码，也能保证在正确的时候被调用。一般来讲，Meteor能避免你去写各种数据传播代码，它们是会对应用程序造成影响的容易出错的逻辑。

下列Meteor函数会在reactive上下文中运行你的代码：

  • Templates
  • Meteor.render 和 Meteor.renderList
  • Meteor.autosubscribe
  • Meteor.autorun

能够触发变化的reactive数据源：

  • Session variables
  • Database queries on Collections
  • Meteor.status
  • Meteor.user
  • Meteor.userId
  • Meteor.loggingIn

Meteor 的reactive实现短小精悍，只有大约50行代码。你可以用Meteor.deps模块“勾入”到里面，以增加新的reactive上下文和数据源。

活动HTML（Live HTML）

HTML 模板是web应用程序的中心。通过Meteor的活动页面更新技术，你可以reactive地渲染HTML，就是说它会跟踪生成它的数据里的变化来自动更新。

这个可选的特性能跟任何HTML模板库工作，甚至你在JavaScript中手动生成的HTML。这里有个例子：

var fragment = Meteor.render(
  function () {
    var name = Session.get("name") || "Anonymous";
    return "<div>Hello, " + name + "</div>";
  });
document.body.appendChild(fragment);

Session.set("name", "Bob"); // 页面自动更新！

Meteor.render接收一个渲染函数，就是说，用一个函数来返回字符串格式的HTML。它会返回一个自动更新的 DocumentFragment 。当有一个渲染函数用过的数据发生变化时，它就会重新运行。DocumentFragment里的DOM元素不管插入在页面上的何处，都能在他们所在的位置更新。这完全是自动的。Meteor.render根据reactive上下文来发现那些被渲染函数所使用的数据。

大部分时间，虽然你不会直接访问这些函数——你只需要使用你喜欢的模板库，例如Handlebars或Jade。render 和 renderList 函数是为实现新模板系准备的。

Meteor 只在你的代码不做处理的情况下，批量执行所有必要的更新。所以，你不必担心DOM会不受你控制。有时你也需要相反的行为。例如，你只是插入了一条记录到数据库，你可能想强制DOM更新，一遍使用类如jQuery的工具找到新元素。在这种情况下，使用Meteor.flush使DOM立刻更新。

手写应用程序的另一个烦恼是元素保留。假设用户正在向<input>元素输入文本，然后页面中包含这个元素的区域发生了重绘。用户停留的界面部分会抖动，失去焦点，光标位置，已经输入的文本部分都会在重建<input>后丢失。

这个问题Meteor已经为你解决了。你可以在模板上用preserve指令来指定需要在模板重新渲染后保留的元素。Meteor会保留这些元素，哪怕包含他们的文档已经重新渲染，但是仍然会更新他们的成员，并将所有发生变化的属性复制过来。

模板

Meteor可以很容易使你喜欢的HTML模板语言，例如Handlebars或Jade，独立于Meteor的活动页面更新技术。你只要正常编写模板，Meteor会小心处理在正确的时候更新它们。

使用这个特性，在你的项目内创建扩展名为.html的文件。这文件中，建一个<template>标签，然后给一个name属性。在标签内写模板内容。Meteor将会预编译这个模板，传送到客户端，然后作为全局对象Template下的一个函数。

目前，被打包道Meteor中的模板系统只有Handlebars。告诉我们你想在Meteor中使用何种模板系统。同时，也可以参考Handlebar文档和Meteor Handlebar扩展

一个名为hello的模板通过调用函数 Template.hello来渲染，并传递一些数据给模板：

<template name="hello">
  <div class="greeting">Hello there, {{first}} {{last}}!</div>
</template>

// 在 JavaScript 控制台里
> Template.hello({first: "Alyssa", last: "Hacker"});
 => "<div class="greeting">Hello there, Alyssa Hacker!</div>"

这会返回一个字符串。在活动HTML系统之外使用模板，使DOM元素在适当的地方自动更新，使用Meteor.render:

Meteor.render(function () {
  return Template.hello({first: "Alyssa", last: "Hacker"});
})
  => 自动更新的 DOM 元素

在模板里取得数据最简单的办法就是在JavaScript里定义helper函数。只要在Tempate.[模板名称]对象下直接添加函数即可。例如，在这个模板里：

<template name="players">
  {{#each topScorers}}
    <div>{{name}}</div>
  {{/each}}
</template>

我们可以定义一个函数在Template.players里，来代替传入 topScorers 数据：

Template.players.topScorers = function () {
  return Users.find({score: {$gt: 100}}, {sort: {score: -1}});
};

这样，数据便来自数据库查询。一旦数据库的指针传递给了#each，就会根据数据库的查询结果添加和移动DOM节点。

helper 能够带参数，他们接收自当前模板里的数据：

// 在JavaScript文件里
Template.players.leagueIs = function (league) {
    return this.league === league;
} ;

.

<template name="players">
  {{#each topScorers}}
    {{#if leagueIs "junior"}}
      <div>Junior: {{name}}</div>
    {{/if}}
    {{#if leagueIs "senior"}}
      <div>Senior: {{name}}</div>
    {{/if}}
  {{/each}}
</template>

Handlebars 注意：能够用{{#if leagueIs "junior"}}是因为有一个能够允许将helper嵌入到块级helper里的Meteor扩展。（if 和 leagueIs 都是同样的 helper，普通的Handlerbars是不能在这个位置调用leagueIs的。）

helper也可以传入常量：

// 同样在 {{#each sections}} 里工作
Template.report.sections = ["Situation", "Complication", "Resolution"];

最后，你可以在模板函数上使用events声明，来安装事件处理句柄。格式在Event Maps。事件句柄函数中的this是触发事件元素的数据上下文。

<template name="scores">
  {{#each player}}
    {{> playerScore}}
  {{/each}}
</template>

<template name="playerScore">
  <div>{{name}}: {{score}}
    <span class="givePoints">Give points</span>
  </div>
</template>

.

Template.playerScore.events({
  'click .givePoints': function () {
    Users.update({_id: this._id}, {$inc: {score: 2}});
  }
});

归总起来，这有一个例子演示了如何塞入各种数据到模板里，然后只要这些数据发生变化，界面就自动更新。详见上面的 活动HTML 部分。

<template name="forecast">
  <div>It'll be {{prediction}} tonight</div>
</template>

.

// JavaScript: reactive helper function
Template.forecast.prediction = function () {
  return Session.get("weather");
};

.

> Session.set("weather", "cloudy");
> document.body.appendChild(Meteor.render(Template.forecast));
In DOM:  <div>It'll be cloudy tonight</div>

> Session.set("weather", "cool and dry");
In DOM:  <div>It'll be cool and dry tonight</div>

智能包

Meteor有一个出奇给力的包系统。目前为止，你读到的所有功能，都是通过标准的Meteor包来实现的。

Meteor包很聪明：包本身就是JavaScript程序。它们可以注入代码到客户端或服务器端，或者勾入一个新的函数到 hundler 里，所它们能以各种方式来扩展Meteor的环境。例如说：

  • coffeescript包扩展了 bundler，自动编译你的目录树下的.coffee文件。加入之后，你就可以用CoffeeScript来替代javaScript了。
  • jQuery 和 Backbone 包是用Meteor来打包客户端库的例子。你自己复制JavaScript文件到你的目录下也可以实现同样的效果，但是用智能包更快。
  • underscore 包扩展了服务器端和客户端的环境。很多Meteor的核心特性，包括Minimongo，Session对象，reactive Handlebars 模板，都作为内置包自动包含在每个Meteor应用程序里了。

用 meteor list 命令和可以看到所有能用的包的清单。 用 meteor add 将包添加道你的项目中，用 meteor remove 移除。

查看已有的包。

部署

Meteor 是一个完整的服务器端应用程序。我们包含了所有将应用程序部署到网络上所需要的东西：你只好提供JavaScript,HTML,和CSS。

在 Meteor 的设施（云）上运行

部署应用程序最简单的办法就是使用命令 meteor deploy 。我们提供这个服务的原因，是我们自己经常需要：有一种简单的方式，让我们可以在周末实现一个创意，并开放给全世界访问，而没有任何东西能阻挡创造力。

meteor deploy myapp.meteor.com

你的应用程序就在 myapp.meteor.com 上了。如果这是第一次在这个域名上部署，meteor会为你的应用程序创建一个空数据库。如果是部署一些更新，Meteor会保留数据库，只是更新代码。

你也可以使用自己的域名。只要给你想要用的域名设置一个CNAME记录到 origin.meteor.com ，就可以了。

meteor deploy www.myapp.com

我们是免费提供这个服务器的，你可以用它来试用Meteor。这对于建立内部beta，demo这些东西是很有帮助的。

在你自己的设施上运行

你也可以在你自己的设施上运行，例如向 Heroku 提供的服务。

执行即可：

$ meteor bundle myapp.tgz

这个命令会以tarball的形式生成一个包含Node.js的应用程序。执行这个应用程序，需要安装Node.js 0.8和MongoDB服务器。你可以用node来调用这个应用程序，指定HTTP端口，和MongoDB的连接点。如果你没有MongoDB服务器，我们推荐我们兄弟单位的提供服务： MongoHQ。

$ PORT=3000 MONGO_URL=mongodb://localhost:27017/myapp node bundle/main.js

有些包需要另外一些环境变量（例如，email包需要 MAIL_URL 环境变量）。

目前为止，bundle只能在创建它的家平台上运行。到其他平台上，你需要将 bundle 里包含的原生包（native package）重建一下。确保 npm 可用，然后运行:

$ cd bundle/server/node_modules
rm -r fibers
npm install fibers[@0](/user/0).6.9
6 回复

赞一个！lz有计划翻译之后的API吗?

等平台完善及各大云支持运行了，可以学学

这个工程量巨大啊，是边学边翻译？

感谢啊，我本来想翻译，水平不行。在，https://groups.google.com/forum/?fromgroups=#!forum/cn-meteor-js meteor中文论坛上有我们工作时写的一些心得，欢迎

reactive programming:响应式编程，现在比较热门的一个方向

thinks :)

回到顶部