Chrome says “Resource interpreted as script but transferred with MIME type text/plain.”, what gives?

Question

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/plai

Answer 1

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

Answer 2

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')

Answer 3

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>

Answer 4

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/"/>

Answer 5

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.

Answer 6

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)