Meteor methods returning undefined on client even after using callback

Question

I am trying to get data from AirVisual API using meteor methods on the server and passing it to the client. The data is successfully received on the server. However, the template helper gets undefined when the method is called in it.

Client Helper:

Template.index.helpers({  
   getCityDataOnClient: function(city, state) { 

       Meteor.call('getCityData', city.toLowerCase(), state.toLowerCase(), function(error, result) {

        if(!error) {
            console.log(result); //returns undefined


        }
        else {
            console.log(error);
        }
     });


  } 
});

Meteor methods.js in lib folder:

Meteor.methods({
getCityData : function(city, state) {
var data = [];
const result = HTTP.call('GET', 'http://api.airvisual.com/v2/city', {

params: {
    state: state,
    city : city,
    country: 'pakistan',
    key: 'xxxxxxxxxx'

}

}, function(err, res) {
    if (!err) {

       data = res.data.data;


     //console.log(data); //prints correct data on the server and client
     return data;


    }
    else {
        console.log(err);
        return err;
    }
        });
    }
});

I have already looked up answers on similar questions. Nothing seems to work, including Tracker, reactive-var, and reactive-methods.

Possible duplicate of [How do I return the response from an asynchronous call?](https://stackoverflow.com/questions/14220321/how-do-i-return-the-response-from-an-asynchronous-call) — coagmano, Mar 28 '18 at 05:20
Possible duplicate of https://stackoverflow.com/questions/12569712/meteor-calling-an-asynchronous-function-inside-a-meteor-method-and-returning-th?noredirect=1&lq=1 — coagmano, Mar 28 '18 at 05:21

score 3 · Accepted Answer · answered Mar 28 '18 at 05:27

The problem here is that you are trying to return data from inside a callback to a function that 1. isn't waiting for you, and 2. has already returned.

Thankfully, Meteor does some magic on the server to make asynchronous calls like HTTP.call appear synchronous. Your method can be done like so:

Meteor.methods({
    getCityData : function(city, state) {
        const result = HTTP.call('GET', 'http://api.airvisual.com/v2/city', {
            params: {
                state: state,
                city : city,
                country: 'pakistan',
                key: 'xxxxxxxxxx'
            }
        });
        return result.data.data;
    }
});

By excluding the callback on Meteor's HTTP module, Meteor will run it in a Fiber and wait for the result before continuing execution (like with async/await)

If you were using a third party library for HTTP requests, you would need to wrap the function using Meteor.wrapAsync to get the benefit of running in a fiber. Or you could wrap it in a promise and return the promise from the method

Makes a lot of sense now. Thank you! – Hammad Mar 28 '18 at 05:45 — Hammad, Mar 28 '18 at 05:45

Meteor methods returning undefined on client even after using callback

1 Answers1