web-dev-qa-db-ja.com

Chromeは「リソースはスクリプトとして解釈されましたが、MIMEタイプtext/plainで転送されます」と言っています。

FFとすべてにおいて、私のJavascriptはうまく機能します。しかしChromeでは、このメッセージが表示されます。

リソースはスクリプトとして解釈されましたが、MIMEタイプtext/plainで転送されました。

私はすべてのスクリプトタグをチェックしました、そしてそれらはすべてMIME type="text/javascript"を持っています。それはjqueryとjquery uiでもそう言えます。 Chromeの何が問題になっていますか

これの問題と修正は何ですか？ブラウザの「オプション」を変更する必要があるのか​​、それともサーバーから変更するのか、それともコードを調整する必要があるのか​​。

google-chromemime-types
314
Shaoz

これは、サーバーがJavascript HTTP応答を

Content-Type: text/plain

JavaScriptレスポンスを送信するようにサーバーを設定する必要があります。

Content-Type: application/javascript
203
SLaks

これは 何もしない jQueryやクライアントサイドのスクリプトコードの奇妙なこととは無関係です。これは、 サーバー側 の問題です。サーバー（ - 側のアプリケーション）は、クライアント側のスクリプトリソースに対して予期されるHTTP Content-Typeヘッダーフィールド 値を送信していません。これは、Webサーバーの設定が不十分、設定ミス、またはサーバーサイドのアプリケーション（PHPなど）がクライアントサイドのスクリプトリソースを生成している場合に発生します。

JavaScriptのようなECMAScript実装のための適切なMIMEメディアタイプは以下の通りです。

  • text/javascript（ 旧式の として登録、廃止予定はありませんが、それでも 有効な 、および サポートされている最適な ）
  • text/ecmascript（ 旧式の として登録、廃止予定はありませんが、それでも 有効 ）
  • application/javascript
  • application/ecmascript

上記のMIMEメディアタイプは現在標準ツリーに登録されているので、それらは not application/x-javascriptを含みます（だから実験的なものを使う必要はもうないし、欲しくないはずです）。比較RFC 4329、 "Scripting Media Types"（2005 CE）およびmy テストケース：Scripting Media Typesのサポート _。

1つの解決策は、すでに推奨されているように、可能であればサーバーを構成することです。 Apacheの場合、これはディレクティブを追加するのと同じくらい簡単です。

AddType text/javascript .js

（詳しくは Apache HTTP Serverのドキュメント をご覧ください）。

しかし、クライアントサイドのスクリプトリソースがPHPのようなサーバーサイドのアプリケーションによって生成される場合は、デフォルトでContent-Typeヘッダーフィールドの値を明示的に設定する必要があります。デフォルトはtext/htmlです。

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

（それと同様のステートメントは他のどの出力よりも前に来る必要があります - PHP manual - を参照してください。それ以外の場合、HTTPメッセージ本文は既に始まったと見なされフィールド）

サーバー上にプレーンな.jsファイルがある場合でも、サーバー側の生成はクライアント側のスクリプトリソースに対して簡単に発生する可能性があります。または、サーバーサイドのアプリケーションによって他の方法で最小限に抑えられます。

125
PointedEars

WeblogicなどのJavaアプリケーションサーバーの場合

1）weblogic.xmlファイルにエラーが含まれていないか

このように：

    <?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）javascriptのMIMEタイプを web.xml /ファイルに追加します。

    ...
        </servlet-mapping>

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

        <welcome-file-list>
    ...

これは他のJavaコンテナ（Tomcatなど）でも機能します。application/javascriptは現在唯一の有効なMIMEタイプです。 text/javascriptのような他のものは非推奨です。

3）ブラウザのキャッシュをクリアするか、CTRL-F5を押します。

19
egallardo

Phpファイルを使用してJavaScriptを生成している場合は、ファイルの先頭にこれを追加します。

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

私はこの問題を抱えていたので、それを修正する方法を考え出しました。

スタイル（CSS）ファイルが.cssファイルを参照するPHPファイルとは異なるエンコーディングである場合に発生します。

たとえば、UnixのエンコーディングでjQuery.jsを使用し、UTF-8でindex.phpを使用すると、この問題が発生するため、UTF-8または他のエンコーディングの両方を同じにする必要があります。

7
mak

私はここで他の答えよりも愚かな理由でこのデバッグメッセージを受け取りました：これはあなたが十分な睡眠を取得せず、CSSファイルのための構文を使用することによってjsファイルを参照するとき受け取られるエラーメッセージです。のように、

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

のではなく

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

これはエラーメッセージを検索するときに表示される最初の投稿なので、ここに表示します。

3
Robert Townley

Apacheのhttpd.confに次のような行を追加してください。

AddType application/x-javascript .js
3
Ruslan Abuzant

奇妙な問題、しかしこれは私が私の問題を解決するのを助けました。時には最も簡単なことでさえ理解するのが難しいです...

私のscript-tagで/js/main.cssを使う代わりに、私はjs/main.cssを使いました

_ yes _ 、実際に違いがありました。私はWAMP/Windowsの上に座っています、そして、私はバーチャルホストを持っていませんでした、ただlocalhost/<project>を使いました

/js/main.cssを参照している場合は、localhost/css/main.cssではなくlocalhost/<project>/css/main.cssを参照しています。

あなたがそれについて考えるとき、それは非常に明白です、しかし、誰かがこれにつまずいたら私はこの答えを共有すると思いました。

2
bestprogrammerintheworld

実際にサーバーにjsファイルが存在することを確認してください。私はこの問題を抱えていて、jsファイルがサーバーにアップロードされておらず、サーバーが実際には代わりにhtmlページを返していたことを発見しました。

1
Steve Mc

私にとっては、$location.url(...);の代わりにwindow.locationを使用していたため、一部のページでしか発生しませんでした。これで問題は解決しました。理解するためにしばらく時間がかかりました:)

1
tfa

あなたがJoomlaに取り組んでいるなら！ （.js）JavaScriptファイルをインクルードしようとしたときにこの厄介なエラーが発生する場合は、次の解決策が役立ちます。

最もありそうな問題はあなたが.jsそこには存在しないファイルを含めようとしているか、あるいはあなたがその.jsファイルを置き忘れただけなのか、そしてJoomla！リソースが見つからない場合は、一般的な404メッセージではなく、完全なWebページとHTMLなどを含む完全な404メッセージを返します。

Webブラウザはそれを.jsと解釈していますが、それはただのWebページで、必要なファイルは見つかりませんでしたと言っています。

joomla2.5joomla3.0joomla3.1joomla3.2joomla3.3joomla で動作します。

1
Mohd Abdul Mujib

AdonisJS（REST APIなど）を使用している場合、これを回避する1つの方法は、応答ヘッダーをこのように定義することです。

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

私は同じエラーがあり、そして最後に（私の特定のケースでは）私はデプロイメント記述子（web.xml）に問題を見つけました

問題：

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

ソリューション：

<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

そのIISがあなたのcommon HTTP Featuresの下でStatic Contentがオンになっていることを確認するなら

0
varun

これが起こるときの一般的なことはあなたが単にあなたのスクリプト呼び出しにtypeを含めるための忘れられているである場合です。 W3 - 必須に従って、明示的に設定する必要があります。

type（content-type）：この属性は要素の内容のスクリプト言語を指定し、デフォルトのスクリプト言語をオーバーライドします。スクリプト言語はコンテンツタイプとして指定されています（例："text/javascript"）。作成者はこの属性に値を指定する必要があります。この属性にはデフォルト値なしがあります。

それでもブラウザのデフォルト値はplain/textです。

例：

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

Apacheの設定でそのファイル拡張子のデフォルトを設定することもできます。

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

私は、Webフレームワークを使用しているときにこの問題を抱えていて、関連するJavascriptファイルを指定された（フレームワークによって）Javascriptフォルダに移動することによってそれを修正しました。

0
JJ.

Spring MVCを使用している場合は、次のmavenタグを追加して、Spring Dispatcher Servletからリソースファイルを除外できます。

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

私の場合、サーバーは正しいContent-Typeを送信していましたが、誤ったContent-Encodingを使用していました。 gzipされたリソースにのみContent-Encoding: gzipを設定するようにしてください。また、サーバー（私の場合はGoogle Cloud Storage）のヘッダーを修正した後、キャッシュによる変更を正しく反映するために数分待つ必要がありました。

0
falsarella