javascript - 使用导入，服务器如何与客户端通信？

Question

我对如何将位于/imports/server 下的 [Publish] 函数和 [MeteorMethods] 导入 Blaze 客户端(在/imports/client/ui 中，甚至在 app-name/client 下)感到困惑.

经典的方法是仅使用发布或 meteor 方法，所有内容都由客户端使用，无需导入。但是，如果所有内容都位于/imports 目录下(包括 Blaze 模板)，那它是如何工作的呢？有真实的例子吗？

插图:

//导入/server/publishing/test.js

Meteor.publish('publish.test', function() {
  if (this.userId) return TestCollection.find({});
  return self.ready();
});

//导入/client/ui/test.js

import { Template } from "meteor/templating";
import { ReactiveDict } from "meteor/reactive-dict";
import { Mongo } from 'meteor/mongo';
import TestCollection from '../../imports/collections/test.js';

import "./test.html";

Template.Test.onCreated(function() {
  this.state = new ReactiveDict();

  this.autorun(() => {
    const subscription = this.subscribe('publish.test');
     ...
    }
  });
});

仅服务器端的内容如何在新的导入开发方式中到达客户端？

更新1:

回复答案1，这样的东西有用吗？另外，客户端看起来还好吗？

//应用程序名称/imports/server/trades-pubs.js

  // This code only runs on the server
  Meteor.publish('trades', function tradesPublication() {
    return Trades.find({},{sort: {timestamp: -1}, limit: 1000});
  });

//应用程序名称/imports/server/trades-methods.js

Meteor.methods({
  // Only on server
  'trades.importFromFiles'() {
      fs = require('fs');
      const path = "/home/daemmon/trades_data/";      
      var files = fs.readdirSync(path);     
      ...
  }
});

//应用程序名称/server/main.js

import '../imports/server/trades-methods.js';
import '../imports/server/trades-pubs.js';

这就是向客户端发布方法和向客户端提供服务器端 meteor 方法所需的全部内容吗？

//导入/client/ui/test.js

import { Template } from "meteor/templating";
import { ReactiveDict } from "meteor/reactive-dict";
import { Mongo } from 'meteor/mongo';
import TestCollection from '../../imports/collections/test.js';

import "./test.html";

Template.Test.onCreated(function() {
  this.state = new ReactiveDict();

  this.autorun(() => {
    const subscription = this.subscribe('trades');
     ...
    }
  });
});

更新2:

you might want to consider importing app-name/imports/server/trades-methods.js somewhere in your client code as well, i.e. in a file like app-name/client/main.js

我以为我们无法在客户端导入服务器代码？例如，如果我想导入 trades-methods.js，我必须将其移至 app-name/imports/api 或/imports/server 之外的位置。

更新3:

阅读Meteor Guide ，我对这一段感到困惑:

.

To fully use the module system and ensure that our code only runs when we ask it to, we recommend that all of your application code should be placed inside the imports/ directory. This means that the Meteor build system will only bundle and include that file if it is referenced from another file using an import (also called “lazy evaluation or loading”).

Meteor will load all files outside of any directory named imports/ in the application using the default file load order rules (also called “eager evaluation or loading”). It is recommended that you create exactly two eagerly loaded files, client/main.js and server/main.js, in order to define explicit entry points for both the client and the server. Meteor ensures that any file in any directory named server/ will only be available on the server, and likewise for files in any directory named client/. This also precludes trying to import a file to be used on the server from any directory named client/ even if it is nested in an imports/ directory and vice versa for importing client files from server/.

These main.js files won’t do anything themselves, but they should import some startup modules which will run immediately, on client and server respectively, when the app loads. These modules should do any configuration necessary for the packages you are using in your app, and import the rest of your app’s code.

.

这是否意味着，例如，如果 [/app-name/imports/server] 目录中有一个文件，则该文件无法在客户端中导入 [>/app-name/client/main.js]？

.

例如，我无法执行以下操作:

imports/server 目录中的模块: /app-name/imports/server/server-test.js

imports/client 目录中的模块: /app-name/imports/client/client-test.js

.

Meteor 客户端的入口点: /app-name/client/main.js

// => Would NOT work?
import { ServerTest } from "../../imports/server/server-test.js"; 

// => Would work?
import { ClientTest } from "../../imports/client/client-test.js"; 

更新4:

您在 Update2 上的措辞:

Within the /imports folder, there are no special folder names - so you can import a file from /imports/server in your client side code.

...不正确according to the author meteor 指南的这一部分。

Answer 1

首先，由于发布和方法仅通过其字符串名称引用，因此不需要在订阅它们的代码中导入或调用函数。当执行 Meteor.subscribe('publication') 时，Meteor 会尝试在服务器中查找名为 publication 的发布，并订阅它。对于 Meteor 方法同样适用。

但是，当使用 /imports 文件夹时，您的发布和方法需要在服务器代码中的某处进行导入，以便 Meteor 加载他们根本。执行此操作的最佳做​​法是将文件放置在 imports 文件夹中的某个位置，例如 /imports/startup/server/index.js (按照 Meteor 指南的建议) ，您只需导入声明发布和方法的所有文件，然后将这个单个文件导入到 imports 文件夹外部的某个文件中。有关此内容的更多信息，请参阅the Meteor Guide及其 example app .

另请注意，对于 Meteor 方法，您可能还希望将它们包含在客户端代码中的某个位置，以便客户端可以在服务器调用返回之前运行它们的模拟以获得乐观的 UI。为此，您可以执行与上面相同的操作，但使用像 /imports/startup/client/index.js 这样的文件，将其包含在客户端代码中。我还建议查看 mdg:validated-method包，它使使用方法更干净。

有关问题中更新的更新:

是的，这似乎可行，我想你明白了:)

作为一个小细节，正如我所说，您可能还需要考虑在客户端代码中的某个位置(即文件中)导入 app-name/imports/server/trades-methods.js例如app-name/client/main.js。这将使客户端能够运行该方法的模拟并立即更新 UI，以获得更好的用户体验。如果您不想向客户端公开一些 super secret 的服务器代码，请不要这样做。

更新问题中的 2

在 /imports 文件夹中，没有特殊的文件夹名称 - 因此您可以在客户端代码中从 /imports/server 导入文件。 但是，我确实建议将仅适用于服务器的代码(例如出版物)放置在名为 server 的文件夹中，并且不要放置以下代码:旨在从双方使用名为 server 或 client 的文件夹。因此，您可能希望将 trades-methods.js 文件移到 /imports/server 文件夹之外。 但这只是为了清楚起见，Meteor 并不关心 /server 内的文件夹名称!

我真的，真的建议您阅读 Meteor 指南，特别是 chapter on application structure并检查相关example app的结构。从长远来看，您将节省大量时间!