Avoid popup blocker when opening new window that requires an async lookup

Question

I've got a button in my Meteor application that does the following:

user clicks button > event calls method > method calls external api using http > external api returns single sign on link > method returns link > event opens new window (tab) with link as url

My problem is that the new tab is being blocked by a popup blocker even though it is based on user action

Here's the event code:

Template.welcome.events({
  'click #accessLms': function(e) {
    e.preventDefault();
​
    var submitButton = $('#accessLms').button('loading');
​
    Meteor.call('getLmsLink', function(error, portalLink) {
      if(error) {
        sAlert.error(error.message);
        submitButton.button('reset');
      } else if(portalLink) {
        window.open(
          portalLink,
          '_blank'
        );
        submitButton.button('reset');
      }
    }); 
  }
});

Here is the method:

Meteor.methods({
  'getLmsLink': function () {

      [set vars...]

      try {
          var response = HTTP.call( verb, wceaApiAddress + endPoint, {
              headers: {
                  "Request-Time": timeStamp,
                  "Api-Key": key,
                  "Signature": hash
              }
          });
      } catch(error) {
          throw new Meteor.Error(501, 'There was a problem getting a link to the E-Learning Portal');
      }
​
      var result = JSON.parse(response.content);
      var portalLink = result.records.accessLink;
      return portalLink;
  }
});

Answer 1

Basic approach:

1. On the click event in your app open a new window with a specific url to your own app
2. Include a route parameter that can be used in the new window, for example /redirect/token/
3. In the Template.onCreated event of the template used in that route, perform the method call and get the url and auth token to the 3rd party site.
4. Finally just set location = newSiteHref in that same code (in the new window) and redirect the user