As someone new to developing Zendesk apps, I've been following the step-by-step guide available here.
To Summarize
I'm facing an issue with passing external API URLs to the AJAX call syntax within Zendesk's app.js
file. You can find my simple Zendesk app code for download here.
For example,
When attempting to pass the below URL to requests
:
https://api.hubapi.com/contacts/v1/contact/email/<a href="/cdn-cgi/l/email-protection" class="__cf_email__" data-cfemail="137d727e747a656653747e727a7f3d707c7e">[email protected]</a>/profile?hapikey=demo
The result in Zendesk app.js will automatically append a suffix
https://namgivu.zendesk.com/proxy/to/
to the URL, transforming it into a parameter instead of a full URL request.
Diving Deeper
While I can successfully call Zendesk API methods such as '/api/v2/users/4829450618.json'
, I encounter difficulties when trying to make calls to external APIs like the Hubspot API (example: this full URL call).
The "pseudo context" scenario is briefly outlined below.
Considering the sample app.js
context where we:
- Initiate the code using
'app.activated': 'myStart'
- Make an AJAX request with
this.ajax('myAJAXCall')
under different cases: 1) Internal Zendesk API, 2a) Target Hubspot API call, 2b) Simplified external API call, and 2c) Simple test call.
It becomes evident that Zendesk adds a URL prefix to our URL parameter in cases #2b and #2c, which isn't the desired behavior. The goal is to send an AJAX call to the exact full URL as specified.
Thus, my question is how to effectively make calls to external API methods from app.js
within a Zendesk app's code?
https://i.sstatic.net/IBleu.png
(function() {
return {
events: {
'app.activated': 'myStart',
},
myStart: function() {
this.ajax('myAJAXCall').then(
//succeeded handler
function(data) {
this.switchTo('someView', data);
},
//failed handler
function() {
this.switchTo('errorView');
}
);
},
requests: {
myAJAXCall: function() {
return {
url: '/api/v2/users/4829450618.json', //case 1 - internal Zendesk api call
url: 'https://api.hubapi.com/contacts/v1/contact/email/'+email+'/profile?hapikey=' + this.hubspotAPIKey, //case 2a - target Hubspot api call
url: 'http://someDomain.com/abb', //case 2b - simplified `external api` call
url: 'abb', //case 2c - simplified `external api` call
type: 'GET',
dataType: 'json',
};
},
},
};
}());