web-dev-qa-db-fra.com

Chrome dit "Ressource interprétée comme script mais transférée avec le type MIME text/plain."

En FF et tout, mon javascript fonctionne bien. Mais dans Chrome, cela donne ce message: 

Ressource interprétée comme un script mais transférée avec le type MIME text/plain.

J'ai vérifié toutes les balises de script et elles ont toutes le MIME type="text/javascript". Il dit même avec jquery et jquery ui. Quel est le problème avec Chrome?

Quel est le problème et la solution pour cela? Est-ce quelque chose que je dois changer dans les "options" du navigateur ou est-ce du serveur ou dois-je modifier mon code?

312
Shaoz

Cela signifie que le serveur envoie une réponse HTTP Javascript avec

Content-Type: text/plain

Vous devez configurer le serveur pour qu’il envoie une réponse JavaScript avec

Content-Type: application/javascript
203
SLaks

Cela n'a rien à faire avec jQuery ou n'importe quelle erreur de code de script côté client. Il s'agit d'un problème côté serveur: le serveur (application côté) n'envoie pas le champ d'en-tête HTTP Content-Type prévu valeur pour la ressource de script côté client. Cela se produit si le serveur Web est insuffisamment configuré, mal configuré ou si une application côté serveur (PHP, par exemple) génère la ressource de script côté client.

Les types de support MIME appropriés pour les implémentations ECMAScript comme JavaScript incluent:

  • text/javascript (enregistré comme obsolète, non déconseillé; mais toujours valide, et supporté mieux)
  • text/ecmascript (enregistré en tant que obsolète, non obsolète; mais toujours valide)
  • application/javascript
  • application/ecmascript

Not include application/x-javascript, car les types de supports MIME énumérés ci-dessus sont ceux qui sont actuellement enregistrés dans l’arborescence des normes (il n’est donc pas nécessaire et il ne devrait pas y en avoir besoin d’utiliser des supports expérimentaux). Cf. RFC 4329, "Types de média de script" (2005 CE) et mon Cas de test: Prise en charge des types de média de script .

Une solution consiste à configurer le serveur si possible, comme recommandé. Pour Apache, cela peut être aussi simple que d'ajouter la directive

AddType text/javascript .js

(voir la documentation Apache HTTP Server pour plus de détails).

Mais si la ressource de script côté client est générée par une application côté serveur, telle que PHP, il est nécessaire de définir explicitement la valeur du champ d'en-tête Content-Type, car la valeur par défaut est probablement text/html:

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

(Cela doit être précédé de toute autre sortie - voir le manuel PHP -, sinon le corps du message HTTP est déjà commencé et il est trop tard pour envoyer d'autres champs d'en-tête.)

La génération côté serveur peut facilement arriver à une ressource de script côté client même si vous avez des fichiers .js simples sur le serveur, si les commentaires leur sont supprimés au fur et à mesure de leur traitement, s'ils sont tous regroupés dans une seule réponse nombre de requêtes, ce qui peut être plus efficace), ou elles sont réduites au minimum par l’application côté serveur de toute autre manière.

125
PointedEars

Pour les serveurs d'applications Java tels que Weblogic

1) Assurez-vous que votre fichier weblogic.xml est exempt d’erreurs

comme celui-ci:

    <?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) Ajoutez un type mime pour javascript à votre web.xml fichier:

    ...
        </servlet-mapping>

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

        <welcome-file-list>
    ...

Cela fonctionnera également pour d'autres conteneurs Java - Tomcat, etc. application/javascript est actuellement le seul type mime valide; d'autres comme text/javascript sont obsolètes.

3) Vous devrez peut-être vider le cache de votre navigateur ou appuyer sur CTRL-F5

19
egallardo

Si vous générez votre javascript avec un fichier php, ajoutez ceci au début de votre fichier:

<?php Header("Content-Type: application/x-javascript; charset=UTF-8"); ?>
8
mopsyd

J'ai eu ce problème et j'ai trouvé comment le résoudre.

Cela se produit lorsque le fichier de style (CSS) utilise un codage différent du fichier PHP qui fait référence au fichier .css. 

Par exemple, l’utilisation de jQuery.js dans l’encodage Unix et d’index.php dans UTF-8 causera ce problème, vous devez donc les utiliser à la fois en UTF-8 ou en tout autre encodage, à condition qu’il soit identique. 

7
mak

Dans le fichier httpd.conf de votre Apache, ajoutez simplement une telle ligne:

AddType application/x-javascript .js
3
Ruslan Abuzant

J'ai reçu ce message de débogage pour une raison plus stupide que les autres réponses suivantes: il s'agit du message d'erreur reçu lorsque vous n'obtenez pas assez de veille et que vous faites référence à un fichier js en utilisant la syntaxe d'un fichier css. Un péché,

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

plutôt que 

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

Je pensais que je mettrais ceci ici parce que c'est le premier message qui apparaît lors de la recherche du message d'erreur. 

2
Robert Townley

Problème étrange, mais cela m'a aidé à résoudre mon problème. Parfois, même les choses les plus faciles sont difficiles à comprendre ...

Au lieu d'utiliser /js/main.css dans mon script-tag, j'ai utilisé js/main.css 

OUI, cela a fait une différence. Je suis assis sur WAMP/Windows et je n'ai pas eu de vhost mais juste utilisé localhost/<project>

Si je fais référence à /js/main.css alors je fais référence à localhost/css/main.css et non à localhost/<project>/css/main.css

Quand on y pense, c'est assez évident, mais si quelqu'un tombait sur cela, je pensais partager cette réponse.

2

Vérifiez que vos fichiers js existent réellement sur le serveur. J'ai eu ce problème et j'ai découvert que les fichiers js n'avaient pas été téléchargés sur le serveur et que le serveur renvoyait la page html à la place - le document configuré par défaut sur le serveur (par exemple, default.html).

1
Steve Mc

Pour moi, cela ne s'est produit que sur certaines pages, car j'ai utilisé window.location au lieu de $location.url(...);. Cela a résolu mon problème. Il a fallu du temps pour comprendre :)

1
tfa

Si vous travaillez sur Joomla! et en obtenant cette erreur ennuyeuse en essayant d'inclure un fichier JavaScript (.js), la solution suivante est pour vous.

Le problème le plus probable est que vous essayez d'inclure un fichier .jsqui n'existe pas, ou que vous ayez simplement égaré ce fichier .js et quand Joomla! ne trouve pas de ressource, alors au lieu du message générique 404, il renvoie un message 404 complet avec une page Web complète et du code html, etc.

Le navigateur Web l’interprète comme .js alors qu’il s’agit simplement d’une page Web indiquant que le fichier requis n’a pas été trouvé.

Cela peut fonctionner pour joomla2.5joomla3.0joomla3.1joomla3.2joomla3.3joomla

1
Mohd Abdul Mujib

Si vous utilisez AdonisJS (API REST, par exemple), vous pouvez éviter ceci en définissant l'en-tête de la réponse de cette façon:

response.safeHeader('Content-type', 'application/json')
0
Billal Begueradj

J'ai eu la même erreur et finalement (dans mon cas particulier) j'ai trouvé un problème dans le descripteur de déploiement (web.xml)

Le problème:

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

la 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>
0
Daniel Kennedy

Si son IIS, assurez-vous que Sous votre common HTTP Features vous avez Static Content activé

0
varun

Une chose courante lorsque cela se produit est si vous avez simplement oublié inclure le type dans vos appels de script. Vous devrez le définir explicitement, tel qu'il est - selon W3 - requis:

type (content-type): cet attribut spécifie le langage de script du contenu de l'élément et remplace le langage de script par défaut. Le langage de script est spécifié en tant que type de contenu (par exemple, "text/javascript"). Les auteurs doivent fournir une valeur pour cet attribut. Il y a pas de valeur par défaut pour cet attribut.

Néanmoins, il semble que navigateurs ait une valeur par défaut de plain/text.

Exemple:

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

Vous pouvez également définir une extension par défaut pour cette extension de fichier dans votre configuration Apache:

<IfModule mod_mime.c>
    AddType text/javascript .js
</IfModule>
0
kaiser

J'ai eu ce problème lors de l'utilisation d'un framework Web et je l'ai corrigé en déplaçant les fichiers javascript appropriés dans le dossier javascript désigné (par le framework).

0
JJ.

Si vous utilisez Spring MVC, vous pouvez ajouter la balise mvn suivante pour exclure le fichier de ressources du servlet Spring Dispatch

<mvc:resources mapping="/js/*.js" location="/js/"/>
<mvc:resources mapping="/css/*.css" location="/css/"/>
<mvc:resources mapping="/images/*.*" location="/images/"/>
0
sendon1982

Dans mon cas, le serveur envoyait le Content-Type correct, mais avec un Content-Encoding incorrect. Assurez-vous de ne définir que Content-Encoding: gzip pour les ressources compressées. De plus, après avoir corrigé les en-têtes du serveur (dans mon cas, Google Cloud Storage), j'ai dû attendre quelques minutes pour refléter correctement les modifications dues à la mise en cache.

0
falsarella