JSONP script returning MIME Type error

Question

Hello I'm currently working on a script that must extract information from a third party feed which returns a json file. I am not able to use CORS since I do not have server access, so based on desk research I was informed to use JSONP. I am able to see the callback (response) in chrome network's tab but I can't read the file in the chrome log. The point is that when I execute the following code I get the Error Message below. I can't turn off mime type checking. I've tried to have a look on other questions but couldn't find anything similar. What should be done?

"Refused to execute script from 'https://siteurl.com/json=jsonp&callback=jQuery321030035432758818903_1501098778362&_=1501098778363' because its MIME type ('application/json') is not executable, and strict MIME type checking is enabled. "

<script src="jquery.js"></script>
<script>
        $.ajax({
            type: 'GET',
            url: 'siteurl.com/json?callback=jsonp',
            dataType: 'jsonp',
            xhrFields: {
                withCredentials: false
            },
            headers: {
                "Accept" : "application/json; charset=utf-8",
                "Content-Type": "application/javascript; charset=utf-8",
                "Access-Control-Allow-Origin" : "*"
            },
            success: function (result) {
                console.log(result);
            },
            error: function (xhr, errorText) {
                console.log('Error ' + xhr.responseText);
            }
        }); 
</script>

Take a look at the network tab:

Network tab view

Are you sure the server supports responding with jsonp? When you preview the response in the network tab is there `jQuery321030035432758818903_1501098778362(` before the actual json? — yuriy636, Jul 27 '17 at 10:44
`"Content-Type": "application/javascript; charset=utf-8"` — This makes no sense. You are making a GET request. There is no request body to describe the content type of. — Quentin, Jul 27 '17 at 10:44
`"Access-Control-Allow-Origin" : "*"` — This makes no sense. Access-Control-Allow-Origin is a **response** header, not a request header. — Quentin, Jul 27 '17 at 10:45
@yuriy636 yes, take a look at the link in the end of the question that I have just included. — Colpachi, Jul 27 '17 at 11:28
@Colpachi well that is not JSONP, the server is responding with JSON, that's why the MIME mismatches. — yuriy636, Jul 27 '17 at 11:35
@yuriy636 I see. So how could I solve this? I cant retrieve a JSON directly because the server has CORS configuration active, so I have used JSONP. As I am using JSONP and the server response is a JSON file, how could I read it in the console? Do you have any guess? — Colpachi, Jul 27 '17 at 11:46
@Colpachi Did you ever find a solution for this? I'm running into the same issue. — knowbody, Feb 06 '18 at 03:51

Quentin · Answer 1 · 2017-07-27T12:06:12.640

2

JSONP is not JSON! JSONP is a JavaScript program consisting of a function call with one argument.

The correct Content-Type is application/javascript.

I am not able to use CORS since I do not have server access, so based on desk research I was informed to use JSONP.

You can only use JSONP if the site provides JSONP. (These days they should use CORS instead, it is better in every way). Just slapping callback in a query string will not magically force a site to provide JSONP and break the same origin policy for you. The site has to explicitly expose the data to other sites.

edited Jul 27 '17 at 12:06

answered Jul 27 '17 at 10:43

Quentin

800,325
104
1,079
1,205

@Ashraf.Shk786 — That is what line 2 of this answer says. – Quentin Jul 27 '17 at 10:52
What I can't understand is why then the server is sending the callback with the JSON file? The file is already in the brownser, it's just a matter of reading it in the console. – Colpachi Jul 27 '17 at 11:40
@Colpachi — "What I can't understand is why then the server is sending the callback with the JSON file? " — Is it? You haven't shown the response or provided a URL which works. Possibly it is simply a bug, in which case the problem still needs to be fixed on the server. – Quentin Jul 27 '17 at 12:03
@Colpachi — "The file is already in the brownser, it's just a matter of reading it in the console." — See https://stackoverflow.com/a/35553666/19068 specifically the section "Why the Same Origin Policy only applies to JavaScript in a web page" – Quentin Jul 27 '17 at 12:04
@Colpachi — That is not a JSONP response. That is JSON. See the last paragraph of this answer. – Quentin Jul 27 '17 at 13:43

Ashraf.Shk786 · Answer 2 · 2017-07-27T10:51:59.853

1

It's a problem with Content-Type.

Content-Type : application/json is correct for JSON but its not for JSONP.

Content-Type : application/javascript is for JSONP.

Please check this : What is the correct JSON content type?

edited Jul 27 '17 at 10:51

answered Jul 27 '17 at 10:45

Ashraf.Shk786

570
1
9
23

I'm afraid is not because when I change to application/javascript the error message is the same: "Refused to execute script from 'https://siteurl.com/json=jsonp&callback=jQuery321030035432758818903_1501098778362&_=1501098778363' because its MIME type ('application/json') is not executable, and strict MIME type checking is enabled. " – Colpachi Jul 27 '17 at 11:37

JSONP script returning MIME Type error

2 Answers2