It is clearly mentioned in the documentation that:
By default, you can’t make WebSocket connections or calls to
third-party APIs from JavaScript code. To do so, add a remote site as
a CSP Trusted Site.
I created this component to call a 3rd party API, and I am able to see the output:
import { LightningElement } from 'lwc';
export default class CallAPI extends LightningElement {
connectedCallback() {
const xhr = new XMLHttpRequest();
const number = 5;
const url = 'http://api.icndb.com/jokes/random/' + number;
xhr.open('GET', url, true);
xhr.onload = function() {
if(this.status === 200) {
const response = JSON.parse(this.responseText);
let output = '<ul class=\'slds-list--dotted\'>';
if(response.type === 'success') {
response.value.forEach(function(joke){
output += `<li>${joke.joke}</li>`;
});
}
output += '<ul>';
console.log(output);
}
};
xhr.send();
}
}