将 Meteor 与 Angular2/Typescript 一起使用，如何根据客户端事件从服务器端代码调用外部 Web 服务？

Question

当用户在客户端中添加新条目时，我需要从服务器调用 Web 服务（客户端代码将无法访问）并向存储在 [= 中的数据添加一些附加信息20=]。尝试使用标准的 Meteor。methods/Meteor。调用模式似乎不起作用。

是否需要在服务器端和客户端监听 "Add" 按钮的点击事件？我应该在服务器响应的客户端上引发自定义事件吗？是否有直接调用服务器端方法的正确方法？最重要的是，我如何让 TypeScript 在这一切中保持快乐？

我是 Meteor 之上的 TypeScript 层的新手，它让我陷入 for 循环。我一直在关注 2.0 的 Angular-Meteor 教程，但此类内容尚未涵盖。

Answer 1

是的，您可以直接从服务器调用网络服务以接收数据。我不太确定您如何处理 Meteor.methods/Meteor.call 并说它不起作用。但基本上，想法是客户端将单击按钮，然后按钮将触发服务器上的方法。然后服务器方法将调用 Web 服务和 return 数据。

一些示例代码可以是：

Template['template'].events({
    'click .getData': function(event: any) {
        Meteor.call('serverMethod', function(err, res) {
            if (err) {alert(err);}
            else { ... }

        )
    }
});

新手在调用其余部分时的棘手部分是您需要使用 aysnc 调用以便 return 将数据发送给客户端。我们通常为此制作辅助函数

    public static get(url: string, headers: any): any {
        var httpCall  = Meteor.wrapAsync(HTTP.call);

        var result = httpCall('GET', url, {headers: headers});

        if (result.statusCode == 200) {
            try {
                var res = JSON.parse(result.content);

                return res;
            } catch(err) {
                return result.content;
            }   
        }

        return null;    
    }

并像这样调用助手

public static serverMethod(username: string, password: string): any {
    var response = RestService.get(query.url, query.header); 
    return response;
}

这样，上面客户端代码中的res就可以得到结果了。

由于缺少文档，我实际上放弃了 Angular 2，但我的系统仍然使用 Typescript，因为我可以将所有流星调用包装在 Typescript class 中，正如您在我的示例 serverMethod 是打字稿函数格式，而不是像 Meteor.methods({....}) 那样的流星方式，这对现在来说非常好

通常，这是我的服务器文件夹

中的一个 class

// server/rest.service.ts
declare var RestService: any;
RestService = class RestService {

    methodMap = {
        "getFromRest": RestService.get,
        "postToRest": RestService.post,
    };

    constructor() {
        var abstractService = new AbstractService();
        abstractService.registerMethod(this.getClassName(), this.methodMap);        
    }

    getClassName(): string {
        return this.constructor.toString().match(/\w+/g)[1];
    }

    //------------------------------------------------------------------------------------
    // Helper methods
    //------------------------------------------------------------------------------------
    public static get(url: string, headers: any): any {
        var httpCall  = Meteor.wrapAsync(HTTP.call);

        var result = httpCall('GET', url, {headers: headers});

        if (result.statusCode == 200) {
            try {
                var res = JSON.parse(result.content);

                return res;
            } catch(err) {
                return result.content;
            }   
        }

        return null;    
    }

我有一个 class 将打字稿服务映射到 meteor 方法

// server/abstract.service.ts
declare var AbstractService: any;
AbstractService = class AbstractService {
    constructor() {}

    public registerMethod (scopeName: string, methodMap: {[key:string]:any}) {
        var scopeMap: {[key:string]: any} = {};

        for (var key in methodMap) {
            scopeMap[scopeName + '.' + key] = methodMap[key];
        }

        Meteor.methods(scopeMap);
    }

Answer 2

使用 angular2、Meteor 和 Typescript，有效的是链接 Meteor.methods。

首先在客户端，响应按钮点击 ...
Meteor.call('importCsv',id,函数(错误,结果){ ...

在collections/methods文件夹或类似文件夹中，我定义方法如下：

Meteor.methods({
 'importCsv': function(id) {
    console.log('importCsv method on client');
    Meteor.call('importCsvServer',id);

 }

});

在server/文件夹下，一个文件包含如下方法

Meteor.methods({
'importCsvServer': function(id) {

.....

在 server/main.ts 中我导入了 collections/methods/文件名。在 client/app.ts 中，我导入了同样的东西。客户端 Meteor.call 成功调用第一个方法，然后调用服务器/文件夹中的第二个方法。

我的目标是在服务器上进行一堆由客户端发起的处理。当我将 collections/methods 中定义的方法中的函数调用导入客户端和服务器时，会导致编译器错误。

Angular2-Meteor issue 74

将 Meteor 与 Angular2/Typescript 一起使用，如何根据客户端事件从服务器端代码调用外部 Web 服务？

Using Meteor with Angular2/Typescript, how do I call an external web service from server-side code based on a client-side event?

meteor

typescript

angular2-meteor

angular