319

In FF and all, my javascript works fine. But in Chrome it gives this message:

Resource interpreted as script but transferred with MIME type text/plain.

I have checked all the script tags and they all have the MIME type="text/javascript". It even says so with jquery and jquery ui. What is wrong with Chrome?

What's the problem and the fix for this? Is it something I have to change in the 'options' of the browser or is it from the server, or do I have to tweak my code?

Sen Jacob
  • 3,025
  • 3
  • 31
  • 52
Shaoz
  • 10,223
  • 25
  • 64
  • 98
  • 14
    Some code would be helpful. Never blame the compiler (browser) first no matter how tempting it is because you'll almost always be mistaken. – msw Aug 12 '10 at 12:10
  • as a matter of curiosity, are you using html5? – bollo Aug 26 '11 at 08:27

20 Answers20

204

It means that the server is sending a Javascript HTTP response with

Content-Type: text/plain

You need to configure the server to send a JavaScript response with

Content-Type: application/javascript
SLaks
  • 800,742
  • 167
  • 1,811
  • 1,896
  • 3
    I'm using Weblogic Server 11g, but I don't know where I can configure the MIME in it. Please, can you show me the way? – Shaoz Aug 12 '10 at 13:36
  • 6
    Hmm what about when there is no server, but the script is actually a JSONP file on your local filesystem? I guess then just ignore the warning since it's not serious and is beyond your control? – hippietrail Aug 10 '12 at 15:32
  • 2
    It should be `content-type:application/javascript` though, `application/x-javascript` is **not** an [RFC](http://www.rfc-editor.org/rfc/rfc4329.txt) or ECMAScript standard. – Jasdeep Khalsa Mar 14 '13 at 16:01
  • There are many similar questions. This answer was an easy fix for me: http://stackoverflow.com/a/12057490/1617395 – Joe Leo Dec 03 '13 at 16:30
  • @JoeLeo: That's for IIS. – SLaks Dec 03 '13 at 16:36
  • @SLaks How to configure apache for Content-Type: application/javascript – Mukesh Dec 30 '13 at 11:11
  • I got to have same problem, wanted to do the same because I had the for target one iframe otherwise, and wanted to redirect user to new-login on session expiry through main window – Amol Pujari Jan 27 '15 at 07:22
  • @hippietrail Can you guys take a look at this? http://stackoverflow.com/questions/31634678/where-to-find-the-response-video-data – committedandroider Jul 26 '15 at 17:28
  • Did you modify this file `app/etc/di.xml` , if so check this http://stackoverflow.com/a/37024887/4762396 – abdul rashid May 04 '16 at 10:23
124

This has nothing to do with jQuery or any quirk of client-side script code. It is a server-side issue: The server(-side application) is not sending the expected HTTP Content-Type header field value for the client-side script resource. This happens if the Web server is insufficiently configured, misconfigured, or a server-side application (e. g., PHP) is generating the client-side script resource.

Proper MIME media types for ECMAScript implementations like JavaScript include:

  • text/javascript (registered as obsolete, not deprecated; but still valid, and supported best)
  • text/ecmascript (registered as obsolete, not deprecated; but still valid)
  • application/javascript
  • application/ecmascript

They do not include application/x-javascript, as the MIME media types listed above are the ones registered in the standards tree by now (so there is no need, and there should be no want, to use experimental ones anymore). Cf. RFC 4329, "Scripting Media Types" (2005 CE) and my Test Case: Support for Scripting Media Types.

One solution is to configure the server if possible, as already recommended. For Apache, this can be as simple as adding the directive

AddType text/javascript .js

(see the Apache HTTP Server documentation for details).

But if the client-side script resource is generated by a server-side application, like PHP, then it is necessary to set the Content-Type header field value explicitly, as the default is likely text/html:

<?php
  header('Content-Type: text/javascript; charset=UTF-8');
  // ...
?>

(That and similar statements must come before any other output – see the PHP manual –, else the HTTP message body is considered to have begun already and it is too late to send more header fields.)

Server-side generation can happen easily to a client-side script resource even if you have plain .js files on the server, if comments are removed from them as they are served, if they are all packed into one large response (to reduce the number of requests, which can be more efficient), or they are minimized by the server-side application in any other way.

PointedEars
  • 13,864
  • 4
  • 30
  • 33
  • 1
    What if we don't have access to the server? – Adonis K. Kakoulidis Dec 02 '13 at 01:32
  • 1
    Find someone who has. – PointedEars Dec 03 '13 at 09:26
  • Thanks a lot for this explanation. Far too many people say something cocky like 'just send JSONP kid, you should know how to do it'. When the time is taken to properly explain it like you have, its clear as day. This has fixed an issue I've had for several weeks. Thanks again! –  May 14 '15 at 09:39
  • @Rick-777: I do not appreciate you changing my answer without even commenting on your change. If you read my answer carefully, you realize why I recommend `text/javascript` over `application/javascript`. If you have reason to believe that `application/javascript` is the better answer now, then the least you should do is *explain yourself* in a comment. It is inappropriate that it requires Stack Overflow’s notification mechanism for me to become aware of your changes. I have reverted your changes, which I call *fudging*, to the answers to this question where I consider them inappropriate. – PointedEars May 27 '15 at 22:43
19

For Java Application servers such as Weblogic

1) Make sure your weblogic.xml file is free of errors

like this one:

    <?xml version = '1.0' encoding = 'windows-1252'?>
<weblogic-web-app xmlns:xsi="http://www.w3.org/2001/XMLSchema-instance"
                  xsi:schemaLocation="http://www.bea.com/ns/weblogic/weblogic-web-app http://www.bea.com/ns/weblogic/weblogic-web-app/1.0/weblogic-web-app.xsd"
                  xmlns="http://www.bea.com/ns/weblogic/weblogic-web-app">
    <container-descriptor>
        <prefer-web-inf-classes>true</prefer-web-inf-classes>
    </container-descriptor>
    <context-root>MyWebApp</context-root>
</weblogic-web-app>

2) Add a mime type for javascript to your web.xml file:

    ...
        </servlet-mapping>

        <mime-mapping>    
            <extension>js</extension>        
            <mime-type>application/javascript</mime-type>        
        </mime-mapping>

        <welcome-file-list>
    ...

This will also work for other Java containers - Tomcat etc. application/javascript is currently the only valid mime-type; others like text/javascript have been deprecated.

3) You may need to clear up your browser cache or hit CTRL-F5

Rick-777
  • 8,290
  • 5
  • 31
  • 47
egallardo
  • 1,124
  • 1
  • 13
  • 25
7

If you're generating your javascript with a php file, add this as the beginning of your file:

<?php Header("Content-Type: application/x-javascript; charset=UTF-8"); ?>
PointedEars
  • 13,864
  • 4
  • 30
  • 33
mopsyd
  • 1,720
  • 3
  • 19
  • 28
  • If you have a different header defined, replace it so you don't get an error. – mopsyd Dec 19 '12 at 01:39
  • 1
    Along with PointedEars post this has helped me fix an issue which seemingly had no answer and I've been racking my brain over for weeks. Thanks a lot :D Why is it when I type in google "how to set the headers in PHP document" I get 1000 erroneous results which tell me nothing about how to do so I don't know, but I finally found your post lol –  May 14 '15 at 09:40
7

I had this problem and I figured out how to fix it.

It happens when the style (CSS) file is in a different encoding from the PHP file that references the .css file

For example, using jQuery.js in Unix encoding and using index.php in UTF-8 will cause this problem so you have to make them both UTF-8 or any other encoding as long as it the same.

dandan78
  • 12,242
  • 12
  • 61
  • 73
mak
  • 71
  • 1
  • 1
3

I received this debug message for a sillier reason than the other answers here: This is the error message received when you don't get enough sleep and reference a js file by using the syntax for a css file. As in,

<link rel='stylesheet' type='text/css' href='clearly_javascript.js'/>

rather than

<script src='clearly_javascript.js'></script>

Thought I'd put this up here because this is the first post that comes up when searching for the error message.

Robert Townley
  • 2,789
  • 1
  • 23
  • 41
3

In your apache's httpd.conf, just add such a line:

AddType application/x-javascript .js
Ruslan Abuzant
  • 621
  • 6
  • 16
  • My "*.js" entry had "application/javascript" under IIS 8 MIME Types. When I changed the "*.js" entry to "application/x-javascript", it worked! This originated from an ExtJS/ASP.NET/ExtDirect4DotNet application – MacGyver Jan 21 '14 at 06:25
2

Weird issue, but this helped me to solve my issue. Sometimes even the easiest things are hard to figure out...

Instead of using /js/main.css in my script-tag I used js/main.css

YES, it did actually make a difference. I'm sitting on WAMP / Windows and I didn't have a vhost but just used localhost/<project>

If I reference to /js/main.css then I reference to localhost/css/main.css and not to localhost/<project>/css/main.css

When you think of it, it's quite obvious but if someone stumbles upon this I thought I would share this answer.

Community
  • 1
  • 1
bestprogrammerintheworld
  • 5,018
  • 6
  • 36
  • 67
1

Check your js files actually exist on the server. I had this problem and discovered the js files hadn't been uploaded to the server and the server was actually returning the html page instead - which was the default document configured on the server (eg default.html)

Steve Mc
  • 3,223
  • 23
  • 33
1

If you are working on Joomla! and getting this annoying error when trying to include a (.js) JavaScript file, then the following solution is for you.

The most probable problem is that you are trying to include a .js file that isn't there, or you just misplaced that .js file, and when Joomla! doesn't find a resource, then instead of the generic 404 message, it returns a full fledged 404 message with a complete webpage and html etc.

The web browser is interpreting it as .js whereas its just a webpage saying that the required file wasn't found.

This can work for

Mohd Abdul Mujib
  • 10,585
  • 8
  • 50
  • 78
1

For me, it only happened on some pages because I used window.location instead of $location.url(...); This fixed my problem. Took a while to figure out :)

Olivier De Meulder
  • 2,460
  • 3
  • 24
  • 29
tfa
  • 1,104
  • 10
  • 16
0

I had this problem while using a web framework and fixed it by moving the relevant javascript files into the designated (by the framework) javascript folder.

JJ.
  • 33
  • 5
0

A common thing when this happens is if you've simply forgotten to include the type in your script calls. You'll have to set it explicitly, as it is - according to W3 - required:

type (content-type): This attribute specifies the scripting language of the element's contents and overrides the default scripting language. The scripting language is specified as a content type (e.g., "text/javascript"). Authors must supply a value for this attribute. There is no default value for this attribute.

Still it seems that browsers have a a default value of plain/text.

Example:

<script type="text/javascript" src="http://maps.googleapis.com/maps/api/js?sensor=false&language=en"></script>

You could as well set a default for that file extension in your Apache configuration:

<IfModule mod_mime.c>
    AddType text/javascript .js
</IfModule>
kaiser
  • 19,898
  • 15
  • 82
  • 102
0

If its IIS make sure That Under your common HTTP Features you have Static Content turned on

varun
  • 3,910
  • 29
  • 28
0

I had the same error and finally (in my particular case) I found a problem in the deployment descriptor (web.xml)

The problem:

<servlet-mapping>
    <servlet-name>SessionController</servlet-name>
    <url-pattern>/</url-pattern>
</servlet-mapping>
...
<welcome-file-list>
    <welcome-file>/</welcome-file>
</welcome-file-list>

the solution:

<servlet-mapping>
    <servlet-name>SessionController</servlet-name>
    <url-pattern>/SessionController</url-pattern>
</servlet-mapping>
...
<welcome-file-list>
    <welcome-file>desktop.jsp</welcome-file>
</welcome-file-list>
Paresh Mayani
  • 122,920
  • 69
  • 234
  • 290
Daniel Kennedy
  • 670
  • 11
  • 18
0

If you are using Spring MVC, you can add following mvn tag to exclude resources file from Spring Dispatch Servlet

<mvc:resources mapping="/js/*.js" location="/js/"/>
<mvc:resources mapping="/css/*.css" location="/css/"/>
<mvc:resources mapping="/images/*.*" location="/images/"/>
sendon1982
  • 7,088
  • 42
  • 36
0

In my case, the server was sending the correct Content-Type but with an incorrect Content-Encoding. Make sure that you only set Content-Encoding: gzip for gzipped resources. Also, after I fixed the headers in the server (in my case, Google Cloud Storage), I had to wait a few minutes to properly reflect the changes due to caching.

falsarella
  • 11,640
  • 8
  • 65
  • 104
0

If you are using AdonisJS (REST API, for instance), one way to avoid this is to define the response header this way:

response.safeHeader('Content-type', 'application/json')
Billal Begueradj
  • 13,551
  • 37
  • 84
  • 109
-1

The answer posted here by simon-sarris helped me.

This helped me solve my issue.

The Visual Studio installer must have added an errant line to the registry.

open up regedit and take a look at this registry key:

enter image description here

See that key? The Content Type key? change its value from text/plain to text/javascript.

Finally chrome can breathe easy again.

I should note that neither Content Type nor PercievedType are there by default on Windows 7, so you could probably safely delete them both, but the minimum you need to do is that edit.

Anyway I hope this fixes it for you too!

Don't forget to restart your system after the changes.

Community
  • 1
  • 1
sham
  • 613
  • 4
  • 23
  • Hi sham. Plagiarism is bad. (mmmmkay?) I've edited your answer to remove plagiarism in accordance with SO [guidelines](http://meta.stackexchange.com/a/160072/172319). – Samuel Harmer Apr 01 '15 at 12:29
-1

I was having the same issue when trying to change a background images in a array through javascript (jQuery in this case).

Anyway.

Instead of this:

m.setStyle('background-image','url(/templates/site/images/style5/'+backgs[i]+')')

do this:

eval("m.setStyle('background-image','url(/templates/site/images/style5/'+backgs[i]+')')");

Chrome javascript gets screwed when trying to parse a variable inside an element structured with ' . In my case it stopped just before the image array being inserted. Instead of parsing the image url + image name (inside the array), it was parsing just the image url.

You probably need to search inside the code and see where it happens. FF, IE and all other don't have this problem.

Shoe
  • 70,092
  • 30
  • 150
  • 251
  • 4
    Don't use `eval` if you can help it: http://www.javascripttoolbox.com/bestpractices/#eval – indra Mar 19 '12 at 17:02