What is wrong with the request for this script?

Question

At a certain point I need to request a json script from the server, but I’m making some changes and I’m getting errors that supposedly shouldn’t happen. The example below works perfectly well:

$(".script_episodios").html($("<script />", { 
    src: 'http://dominio.com/js/episodios.php'
}));
/*chamados os dados que foram gerados no script acima*/
console.log(dados_episodios);

When I make the same call to another unique domain to return json, it is no longer processed correctly

$(".script_episodios").html($("<script />", { 
    src: 'http://api.dominio.com/js/episodios.php'
}));
/*chamados os dados chamados no script acima*/
console.log(dados_episodios);

In the second example it seems that the script does not wait for the call to be completed before continuing and I get the error Uncaught ReferenceError: dados_episodios is not defined, I have already consulted the return of both requests is equal, including the average time of the request is equal for both, how can I circumvent this error?

Answer 1

The technique of creating script tag with src only works for JSONP, if the url returns JSON instead of JSONP you will have to make a normal HTTP request using jQuery.ajax() or XMLHttpRequest or fetch(). This request may not work if the server is not CORS enabled, if it is not Cors enabled you can use a proxy such as crossorigin.me.

Example using Xmlhttprequest

var request = new XMLHttpRequest();
request.open('GET', 'https://crossorigin.me/http://api.bluanime.com/dados/animes/113/episodios');
request.addEventListener('load', function () {
  var data = request.response.slice("dados_eps = ".length);
  alert(data);
  var json = JSON.parse(data);
});
request.send();

Example using JSONP by changing the API: https://jsfiddle.net/Lmqgrwdt/

The api returns something like

callback({"episodes": "123", "_": "1492622616910"});