My lightning component has a button that shows a dialog when clicked. To show that dialog, i need to call a server-side action and parse the response. When I enqueue the action, it takes a long time to execute - or sometimes it seems I have to click the button twice to batch another request before it's processed. I need this to be responsive to the user - no one's going to wait 10 seconds for this action to be dequeued. What can I do to execute this immediately from my helper? Here's my code:
MyComponentRenderer.js
({
afterRender: function(component, helper) {
this.superAfterRender();
// listen to iframe messages
this.processMessageWrapper = function(e) {
helper.processMessage(e, component);
}
addEventListener("message", this.processMessageWrapper, false);
},
unrender: function(component, helper) {
this.superUnrender();
window.removeEventListener("message", this.processMessageWrapper);
},
processMessageWrapper: function(e) {}
})
MyComponentHelper.js
({
processMessage: function(e, component) {
var getValidHostsForOrg = component.get("c.getValidHostsForOrg");
getValidHostsForOrg.setCallback(this, function(response) {
var state = response.getState();
if (state === "SUCCESS") {
var isValidOrigin = false;
var validOrigins = response.getReturnValue();
var host = this.extractHostname(e.origin);
for (var i = 0; i < validOrigins.length; i++) {
if (host.match(validOrigins[i])) {
isValidOrigin = true;
break;
}
}
if (!isValidOrigin)
return;
var eventName = "e." + e.data.eventName;
var eventArgs = e.data.eventArgs;
var event = $A.get(eventName);
if (event) {
event.setParams(eventArgs);
event.fire();
}
} else if (state === "ERROR") {
var errors = response.getError();
if (errors) {
if (errors[0] && errors[0].message) {
console.log("Error message: " +
errors[0].message);
}
} else {
console.log("Unknown error");
}
}
});
$A.enqueueAction(getValidHostsForOrg);
},
extractHostname: function(url) {
var hostname;
//find & remove protocol (http, ftp, etc.) and get hostname
if (url.indexOf("://") > -1) {
hostname = url.split('/')[2];
} else {
hostname = url.split('/')[0];
}
//find & remove port number
hostname = hostname.split(':')[0];
//find & remove querystring
hostname = hostname.split('?')[0];
return hostname;
}
})
MyComponent.cmp
<aura:component access="global" controller="ServerSideController" implements="flexipage:availableForAllPageTypes,force:hasRecordId,force:hasSObjectName">
<!-- designer attributes -->
<aura:attribute access="global" name="objectName" type="String" default="Opportunity" required="true"/>
<aura:attribute access="global" name="relationshipName" type="String"/>
<aura:attribute access="global" name="height" type="Integer" default="600" />
<aura:attribute access="global" name="viewID" type="String" />
<!-- internal attributes -->
<aura:attribute name="vfUrl" type="String" />
<div class="container" style="{!'height:' + v.height + 'px;'}">
<iframe class="iframe" aura:id="vfIframe" seamless="true" src="{!v.vfUrl}"></iframe>
</div>
<aura:handler name="init" action="{!c.auraInit}" value="{!this}"/>
</aura:component>