Chrome กล่าวว่า“ ทรัพยากรตีความว่าเป็นสคริปต์ แต่ถ่ายโอนด้วยข้อความ / ชนิดธรรมดา MIME” จะให้อะไร

ใน FF และทั้งหมดจาวาสคริปต์ของฉันทำงานได้ดี แต่ใน Chrome มันให้ข้อความนี้:

ทรัพยากรตีความว่าเป็นสคริปต์ แต่ถ่ายโอนด้วย MIME type text / plain

MIME type="text/javascript"ผมได้ตรวจสอบแท็กสคริปต์และพวกเขาทั้งหมดมี มันยังบอกด้วย jQuery และ jQuery ui เกิดอะไรขึ้นกับ Chrome

ปัญหาและการแก้ไขสำหรับสิ่งนี้คืออะไร มันเป็นสิ่งที่ฉันต้องเปลี่ยนใน 'ตัวเลือก' ของเบราว์เซอร์หรือมันมาจากเซิร์ฟเวอร์หรือฉันต้องปรับแต่งรหัสของฉัน?

หมายความว่าเซิร์ฟเวอร์กำลังส่งการตอบสนองด้วย Javascript HTTP ด้วย

Content-Type: text/plain

คุณต้องกำหนดค่าเซิร์ฟเวอร์เพื่อส่งการตอบกลับด้วย JavaScript

Content-Type: application/javascript

สิ่งนี้ไม่เกี่ยวข้องกับ jQuery หรือสิ่งแปลกปลอมของโค้ดสคริปต์ฝั่งไคลเอ็นต์ เป็นปัญหาฝั่งเซิร์ฟเวอร์ : เซิร์ฟเวอร์ (- แอปพลิเคชันด้าน) ไม่ได้ส่งค่าContent-Typeฟิลด์ส่วนหัว HTTP ที่คาดไว้สำหรับทรัพยากรสคริปต์ฝั่งไคลเอ็นต์ สิ่งนี้เกิดขึ้นหากเว็บเซิร์ฟเวอร์มีการกำหนดค่าไม่เพียงพอกำหนดค่าผิดพลาดหรือแอปพลิเคชันฝั่งเซิร์ฟเวอร์ (เช่น PHP) กำลังสร้างทรัพยากรสคริปต์ฝั่งไคลเอ็นต์

ประเภทสื่อ MIME ที่เหมาะสมสำหรับการใช้งาน ECMAScript เช่น JavaScript รวมถึง:

• text/javascript(ลงทะเบียนเป็นล้าสมัยไม่เลิกใช้ แต่ยังใช้ได้และสนับสนุนดีที่สุด )
• text/ecmascript(ลงทะเบียนเป็นล้าสมัยไม่เลิกใช้ แต่ยังใช้ได้ )
• application/javascript
• application/ecmascript

พวกเขาไม่ได้รวมapplication/x-javascriptเป็น MIME ประเภทสื่อดังกล่าวข้างต้นจะเป็นคนที่จดทะเบียนในต้นไม้มาตรฐานโดยขณะนี้ (ดังนั้นจึงไม่มีความจำเป็นและไม่ควรมีความต้องการที่จะใช้คนทดลองอีกต่อไป) cf เลย RFC 4329 "ประเภทการเขียนสคริปต์ Media" (2005 ซีอี) ของฉันและกรณีการทดสอบ: การสนับสนุนสำหรับการเขียนสคริปต์ประเภทสื่อ

ทางออกหนึ่งคือการกำหนดค่าเซิร์ฟเวอร์ถ้าเป็นไปได้ตามที่แนะนำไว้แล้ว สำหรับ Apache สิ่งนี้สามารถทำได้ง่ายเพียงแค่เพิ่มคำสั่ง

AddType text/javascript .js

(ดูเอกสารApache เซิร์ฟเวอร์ Apacheสำหรับรายละเอียด)

แต่ถ้าทรัพยากรสคริปต์ฝั่งไคลเอ็นต์ถูกสร้างขึ้นโดยแอปพลิเคชันฝั่งเซิร์ฟเวอร์เช่น PHP คุณจำเป็นต้องตั้งค่าContent-Typeฟิลด์ส่วนหัวอย่างชัดเจนเนื่องจากค่าเริ่มต้นน่าจะเป็นtext/html:

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

(ข้อความนั้นและข้อความที่คล้ายกันต้องมาก่อนเอาต์พุตอื่น - ดูคู่มือ PHP - มิฉะนั้นข้อความ HTTP จะถูกพิจารณาว่าได้เริ่มขึ้นแล้วและมันช้าเกินไปที่จะส่งฟิลด์ส่วนหัวเพิ่มเติม)

การสร้างฝั่งเซิร์ฟเวอร์สามารถเกิดขึ้นได้ง่ายกับทรัพยากรสคริปต์ฝั่งไคลเอ็นต์แม้ว่าคุณจะมีไฟล์. js ธรรมดาบนเซิร์ฟเวอร์หากความคิดเห็นจะถูกลบออกจากพวกเขาตามที่พวกเขาให้บริการหากพวกเขาทั้งหมดบรรจุลงในการตอบสนองขนาดใหญ่ จำนวนคำขอซึ่งอาจมีประสิทธิภาพมากขึ้น) หรือถูกลดขนาดโดยแอ็พพลิเคชันฝั่งเซิร์ฟเวอร์ด้วยวิธีอื่นใด

สำหรับเซิร์ฟเวอร์ Java Application เช่น Weblogic

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) เพิ่มประเภท mime สำหรับ javascript ไปยังไฟล์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

ฉันมีปัญหานี้และฉันหาวิธีแก้ไขได้

มันเกิดขึ้นเมื่อไฟล์ style (CSS) อยู่ในการเข้ารหัสที่แตกต่างจากไฟล์ PHP ที่อ้างถึงไฟล์. css

ตัวอย่างเช่นการใช้ jQuery.js ในการเข้ารหัส Unix และการใช้ index.php ใน UTF-8 จะทำให้เกิดปัญหานี้ดังนั้นคุณต้องทำให้พวกเขาทั้ง UTF-8 หรือการเข้ารหัสอื่น ๆ ตราบใดที่มันเหมือนกัน

หากคุณกำลังสร้างจาวาสคริปต์ด้วยไฟล์ php ให้เพิ่มนี่เป็นจุดเริ่มต้นของไฟล์ของคุณ:

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

ใน httpd.conf ของ Apache ให้เพิ่มบรรทัดดังกล่าว:

AddType application/x-javascript .js

ฉันได้รับข้อความดีบั๊กนี้ด้วยเหตุผลที่ดีกว่าคำตอบอื่น ๆ ที่นี่: นี่คือข้อความแสดงข้อผิดพลาดที่ได้รับเมื่อคุณมีโหมดสลีปเพียงพอและอ้างอิงไฟล์ js โดยใช้ไวยากรณ์สำหรับไฟล์ css ในขณะที่

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

ค่อนข้างมากกว่า

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

คิดว่าฉันจะวางนี่เพราะนี่เป็นโพสต์แรกที่เกิดขึ้นเมื่อค้นหาข้อความแสดงข้อผิดพลาด

ปัญหาแปลก ๆ แต่สิ่งนี้ช่วยให้ฉันแก้ปัญหาได้ บางครั้งสิ่งที่ง่ายที่สุดก็ยากที่จะเข้าใจ ...

แทนที่จะใช้ /js/main.cssในแท็กสคริปต์ของฉันฉันใช้js/main.css

ใช่มันสร้างความแตกต่างได้จริงๆ ฉันกำลังนั่งอยู่บน WAMP / Windows และฉันไม่มี vhost แต่เพิ่งใช้localhost/<project>

ถ้าฉันอ้างอิงถึง/js/main.cssฉันอ้างอิงถึงlocalhost/css/main.cssและไม่localhost/<project>/css/main.css

เมื่อคุณคิดว่ามันชัดเจนมาก แต่ถ้ามีคนสะดุดฉันคิดว่าฉันจะแบ่งปันคำตอบนี้

ตรวจสอบว่าไฟล์ js ของคุณมีอยู่จริงบนเซิร์ฟเวอร์ ฉันมีปัญหานี้และค้นพบว่าไฟล์ js ไม่ได้อัปโหลดไปยังเซิร์ฟเวอร์และเซิร์ฟเวอร์กลับมาที่หน้า html แทน - ซึ่งเป็นเอกสารเริ่มต้นที่กำหนดค่าไว้บนเซิร์ฟเวอร์ (เช่น default.html)

หากคุณกำลังทำงานกับ Joomla! และรับข้อผิดพลาดที่น่ารำคาญนี้เมื่อพยายามรวม.jsไฟล์ JavaScript ( ) JavaScript จากนั้นโซลูชันต่อไปนี้เหมาะสำหรับคุณ

ปัญหาที่น่าจะเป็นไปได้มากที่สุดคือคุณกำลังพยายามรวม.js ไฟล์ที่ไม่มีหรือคุณเพิ่งวาง.jsไฟล์ผิดและเมื่อ Joomla! ไม่พบทรัพยากรจากนั้นแทนที่จะเป็นข้อความ 404 ทั่วไปจะส่งคืนข้อความ 404 เต็มเปี่ยมด้วยหน้าเว็บและ html ที่สมบูรณ์เป็นต้น

เว็บเบราเซอร์ที่มีการตีความว่ามันเป็น.jsในขณะที่เพียงหน้าเว็บของตนบอกว่าไฟล์ที่ต้องการไม่พบ

สิ่งนี้สามารถทำงานได้ joomla2.5joomla3.0joomla3.1joomla3.2joomla3.3Joomla

สำหรับฉันมันเกิดขึ้นในบางหน้าเท่านั้นเพราะฉันใช้window.locationแทน$location.url(...);สิ่งนี้แก้ไขปัญหาของฉัน ใช้เวลาสักครู่เพื่อคิดออก :)

ฉันมีปัญหานี้ในขณะที่ใช้เว็บเฟรมเวิร์กและแก้ไขโดยการย้ายไฟล์จาวาสคริปต์ที่เกี่ยวข้องไปยังโฟลเดอร์จาวาสคริปต์ (ตามกรอบ) ที่กำหนด

สิ่งที่พบได้ทั่วไปเมื่อเกิดเหตุการณ์นี้คือถ้าคุณลืมที่จะรวมไว้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>

หาก IIS ตรวจสอบให้แน่ใจว่าcommon HTTP FeaturesคุณStatic Contentเปิดใช้งาน

ฉันมีข้อผิดพลาดเดียวกันและในที่สุด (ในกรณีของฉันโดยเฉพาะ) ฉันพบปัญหาในตัวให้คำอธิบายการปรับใช้ (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>

หากคุณกำลังใช้ Spring MVC คุณสามารถเพิ่มแท็ก mvn ต่อไปนี้เพื่อแยกไฟล์ทรัพยากรออกจาก Spring Dispatch Servlet

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

ในกรณีของฉันเซิร์ฟเวอร์ถูกส่งที่ถูกต้องแต่ด้วยความที่ไม่ถูกต้องContent-Type Content-Encodingตรวจสอบให้แน่ใจว่าคุณตั้งค่าเฉพาะContent-Encoding: gzipสำหรับทรัพยากร gzipped นอกจากนี้หลังจากที่ฉันแก้ไขส่วนหัวในเซิร์ฟเวอร์ (ในกรณีของฉัน Google Cloud Storage) ฉันต้องรอสองสามนาทีเพื่อสะท้อนการเปลี่ยนแปลงที่เหมาะสมเนื่องจากการแคช

หากคุณใช้ AdonisJS (REST API เป็นต้น) วิธีหนึ่งในการหลีกเลี่ยงสิ่งนี้คือการกำหนดหัวข้อการตอบกลับด้วยวิธีนี้:

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

ฉันมีปัญหาเดียวกันเมื่อพยายามที่จะเปลี่ยนภาพพื้นหลังในอาร์เรย์ผ่าน javascript (jQuery ในกรณีนี้)

อย่างไรก็ตาม.

แทนสิ่งนี้:

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

ทำเช่นนี้:

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

จาวาสคริปต์ Chrome ได้รับการเมาเมื่อพยายามที่จะแยกตัวแปรภายในองค์ประกอบที่มีโครงสร้างด้วย ' ในกรณีของฉันมันหยุดก่อนที่อาร์เรย์ภาพจะถูกแทรก แทนที่จะแยกวิเคราะห์รูปภาพ url + ชื่อรูปภาพ (ภายในอาร์เรย์) มันเป็นการแยกวิเคราะห์เฉพาะ URL รูปภาพ

คุณอาจต้องค้นหาภายในโค้ดและดูว่าเกิดอะไรขึ้น FF, IE และอื่น ๆ ทั้งหมดไม่มีปัญหานี้

คำตอบที่โพสต์ที่นี่โดยsimon-sarrisช่วยฉันได้

สิ่งนี้ช่วยให้ฉันแก้ปัญหาของฉันได้

โปรแกรมติดตั้ง Visual Studio ต้องเพิ่มบรรทัดที่ผิดพลาดในรีจิสทรี

เปิด regedit และดูที่คีย์รีจิสทรีนี้:

เห็นกุญแจนั่นไหม? คีย์ประเภทเนื้อหา เปลี่ยนค่าจาก text / plain เป็น text / javascript

ในที่สุดโครเมี่ยมสามารถหายใจได้ง่ายอีกครั้ง

ฉันควรทราบว่าไม่มี Content Type หรือ PercievedType อยู่ที่ค่าเริ่มต้นใน Windows 7 ดังนั้นคุณอาจลบได้อย่างปลอดภัยทั้งสอง แต่ขั้นต่ำที่คุณต้องทำคือแก้ไข

อย่างไรก็ตามฉันหวังว่าสิ่งนี้จะแก้ไขให้คุณเช่นกัน!

อย่าลืมรีสตาร์ทระบบของคุณหลังจากการเปลี่ยนแปลง