Chrome ปฏิเสธที่จะเรียกใช้งานไฟล์ JavaScript นี้

ในส่วนหัวของหน้า HTML ของฉันฉันมี:

<script src="https://raw.github.com/cloudhead/less.js/master/dist/less-1.3.3.js"></script>

เมื่อฉันโหลดหน้าเว็บในเบราว์เซอร์ของฉัน (Google Chrome v 27.0.1453.116) และเปิดใช้งานเครื่องมือสำหรับนักพัฒนาซอฟต์แวร์มันบอกว่า:

ปฏิเสธที่จะเรียกใช้งานสคริปต์จาก ' https://raw.github.com/cloudhead/less.js/master/dist/less-1.3.3.js ' เนื่องจากประเภท MIME ('text / plain') ไม่สามารถเรียกใช้งานได้และ เปิดใช้งานการตรวจสอบประเภท MIME อย่างเข้มงวด

แน่นอนสคริปต์จะไม่ทำงาน เหตุใด Chrome จึงคิดว่านี่เป็นไฟล์ข้อความธรรมดา มันมี.jsนามสกุลไฟล์อย่างชัดเจน

เนื่องจากฉันใช้ HTML5 ฉันไม่ได้ใช้typeแอตทริบิวต์ดังนั้นฉันจึงคิดว่าอาจทำให้เกิดปัญหา ดังนั้นฉันเพิ่มtype="text/javascript"ใน<script>แท็กและได้ผลลัพธ์เดียวกัน ฉันลองtype="application/javascript"แล้วและยังคงมีข้อผิดพลาดเดียวกัน

จากนั้นฉันก็ลองเปลี่ยนมันเป็นtype="text/plain"ความอยากรู้อยากเห็น เบราว์เซอร์ไม่ส่งคืนข้อผิดพลาด แต่แน่นอนว่า JavaScript ไม่ได้เรียกใช้เช่นกัน

ในที่สุดฉันคิดว่าช่วงเวลาในชื่อไฟล์อาจทำให้เบราว์เซอร์หยุดทำงาน ดังนั้นในโค้ด HTML ของฉันฉันเปลี่ยนช่วงเวลาทั้งหมดเป็นอักขระยกเว้น URL %2E:

<script src="https://raw.github.com/cloudhead/less%2Ejs/master/dist/less-1%2E3%2E3.js"></script>

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

ฉันจะให้ Chrome รับรู้ได้อย่างไรว่าไฟล์ที่เชื่อมโยงนั้นเป็นประเภท JavaScript จริง ๆ

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

คุณสามารถให้ไฟล์. zip แสดงเป็นไฟล์. html หากโฮสต์ทำการติดตั้งคุณสามารถตรวจสอบได้ด้วยตนเองโดยใช้ firebug และดูการตอบกลับส่วนหัวซึ่งเป็นสิ่งที่ร้องขอ .... ดังนั้นหากคุณร้องขอ ไฟล์ JS แต่การตอบกลับส่วนหัวจะส่งกลับค่าที่คาดหวังที่แตกต่างกันจากนั้นเบราว์เซอร์จะเคารพการตอบสนองส่วนหัวและไม่ใช่สิ่งที่ถูกร้องขอ ...

Github ที่โฮสต์บนโดเมนย่อย raw กำลังส่งคืนContent-Type text/plain; charset=utf-8เนื่องจากชนิด MIME ซึ่งหมายความว่าจะไม่ใช้เป็น JS แต่เป็นข้อความดิบด้านล่างนี้เป็นตัวอย่างสิ่งที่คุณต้องการให้เซิร์ฟเวอร์ส่งคืนเพื่อแสดงไฟล์และเพิ่มเติมคือ รหัสที่ถูกส่งคืนโดย github

เซิร์ฟเวอร์ที่รองรับประเภท JS MIME จะมีลักษณะดังนี้:

Accept-Ranges   bytes
Connection  Keep-Alive
Content-Encoding    gzip
Content-Length  31097
Content-Type    application/javascript
Vary    Accept-Encoding
Request Headersview source
Accept  text/html,application/xhtml+xml,application/xml;q=0.9,*/*;q=0.8

และนี่คือสิ่งที่https://raw.github.com/cloudhead/less.js/master/dist/less-1.3.3.jsส่วนหัวตอบสนองเหมือน (มุมมอง RAW)

Accept-Ranges   bytes
Connection  Keep-Alive
Content-Disposition inline
Content-Encoding    gzip
Content-Length  41354
Content-Transfer-Encoding   binary
Content-Type    text/plain; charset=utf-8

ธันวาคม 2018 แก้ไข

RawGit กำลังตกดินเนื่องจากการใช้งานที่เป็นอันตรายดังนั้นพวกเขาจึงแนะนำให้ใช้บริการใดบริการหนึ่งต่อไปนี้แทน:

• jsDelivr
• หน้า GitHub
• CodeSandbox
• unpkg

โพสต์ต้นฉบับ

Rawgithub.comช่วยให้ผู้ใช้สามารถใช้ Git เวอร์ชัน "Raw" และเปลี่ยนให้เป็น URL ที่ใช้งานได้ใน<script>แท็ก มันค่อนข้างใช้งานง่ายเพียงแค่ลบอันแรก.ออกจาก URL ดิบ ตัวอย่างเช่นสิ่งนี้:

https://raw.github.com/joelambert/CSS-Animation-Store/master/cssanimationstore.js

จะเปลี่ยนเป็นสิ่งนี้

https://rawgithub.com/joelambert/CSS-Animation-Store/master/cssanimationstore.js

แล้วคุณใส่มันลงใน<script>แท็กด้วยประเภทที่เหมาะสม ง่าย ๆ !

พวกเขาจะ จำกัด จำนวนการร้องขอเพราะมันมีวัตถุประสงค์เพื่อการพัฒนาเท่านั้นไม่ได้ผลิต

2014 แก้ไข

ดังที่เรนเดรียนกล่าวถึง rawgithub ตอนนี้เป็นเพียง rawgit ดังนั้นลิงก์สคริปต์ใหม่จะเป็น

https://rawgit.com/joelambert/CSS-Animation-Store/master/cssanimationstore.js

นามสกุลไฟล์นั้นไม่เกี่ยวข้องมันเป็นส่วนหัวของประเภทเนื้อหาที่มีความสำคัญและไฟล์นั้นจะให้บริการพร้อมกับtext/plainประเภทเนื้อหา (ซึ่งเป็นจุดประสงค์ของมุมมอง "ดิบ" ของ Github)

คุณควรดาวน์โหลดสำเนาของไฟล์ที่อยู่ในเว็บไซต์ของคุณและรวมไว้ที่นั่น แม้ว่าจะทำงานได้จาก Github แต่คุณไม่ได้โหลดไฟล์ JS แบบอะซิงโครนัสการวาง<script>แท็กนั้นไว้ในส่วนหัวของหน้าทำให้เว็บไซต์ของคุณขึ้นอยู่กับความพร้อมของ Github

นี้คือคุณลักษณะที่จงใจออกแบบมาเพื่อป้องกันการโจมตี XSS บางอย่าง

ดังที่Mike West อธิบายอย่าใช้raw.github.comเป็น CDN ใช้หน้า GitHubแทน

นอกจากนี้การเข้ารหัสอักขระที่ไม่ได้สงวนไว้อย่างชัดเจนจะไม่เปลี่ยนวิธีการจัดการ URL

ในฐานะที่เป็นbybe ชี้ให้เห็นปัญหาคือเนื้อหาเกือบทั้งหมดให้บริการโดย raw.github.com จะถูกส่งลงในไฟล์ข้อความ - วิธีการที่เนื้อหาจะแสดงผลเป็นข้อความธรรมดาในเบราว์เซอร์ของคุณโดยไม่มีแอปพลิเคชันอื่น ๆ มิฉะนั้นคุณจะเข้าสู่สถานการณ์ที่พยายามดูไฟล์. js อาจทำให้เบราว์เซอร์พยายามเรียกใช้แทนที่จะแสดงให้คุณเห็น

ยิ่งไปกว่านั้น github หรือ pages.github ไม่ได้พยายามที่จะเป็น CDN คุณควรจะ:

1. โฮสต์ไฟล์ด้วยตัวเองมันไม่ใหญ่มาก
2. ใช้ CDN เฉพาะสำหรับไฟล์นี้และไฟล์คงที่อื่น ๆ บนเว็บไซต์ของคุณ
3. การใช้งานบางอย่างเช่น cdnjs.com ที่มีรุ่นต่างๆของlessjs ใช้ได้