CODEWITHSUNDEEP
javascripthtmljquery
Marco Terraglia
Marco Terraglia

Reputation: 11

Refused to execute script from URL because its MIME type ('application/json') is not executable and strict MIME type checking is enabled

I've this problem when I call the JavaScript File from my index. This is my JavaScript file (jQuery):

$(document).ready(function(){
  $.getJSON("https://api.blockchain.info/pools?timespan=5days&callback=?", function(result){
    
  });
  
});

This is the error that I get when I try to get the json file from the API:

Refused to execute script from 'https://api.blockchain.info/pools? timespan=5days&callback=jQuery33105603115327243822_1528663793253&_=1528663793254 ' because its MIME type ('application/json') is not executable, and strict MIME type checking is enabled.

Upvotes: 1

Views: 980

Answers (1)

Brad
Brad

Reputation: 163232

You're attempting to use an old hacky method of getting around cross-origin restrictions called JSON-P.

Basically, this works by injecting a <script> element into the page with the URL specified. A callback with an auto-generated name (generated by jQuery) is set up in the global space. The server sees this callback=someCallback parameter in the query string and instead of returning JSON, it returns JavaScript which is something like:

someCallback(...data...);

The browser then executes this script like it were any other, the callback is called with the resulting data, and all is well.

In addition to the data returned, most every HTTP response has some headers. One of them is Content-Type which indicates to the browser what sort of data it's getting so it knows what to do with it. The Content-Type (commonly referred to as MIME Type) for executable JavaScript is usually application/javascript. As the error message says, application/json isn't executable.

The problem is one of two things:

  1. This API doesn't support JSON-P. (And, it shouldn't! CORS is well-supported now, there's no need for JSON-P.) Try just removing that callback parameter and see what happens. Based on what I'm seeing for the response, this is the issue here.
  2. The API supports JSON-P but is returning the wrong Content-Type value in its response headers. (If this were your problem, there'd be nothing you could do to fix it short of proxying the response. This isn't the issue in your case though.)

Upvotes: 1

Related Questions