Chrome đã từ chối thực thi tệp JavaScript này

Trong phần đầu trang HTML của tôi, tôi có:

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

Khi tôi tải trang trong trình duyệt của mình (Google Chrome v 27.0.1453.116) và bật các công cụ dành cho nhà phát triển, nó nói:

Từ chối thực thi tập lệnh từ ' https://raw.github.com/cloudhead/less.js/master/dist/less-1.3.3.js ' vì loại MIME của nó ('text / plain') không thể thực thi được và kiểm tra loại MIME nghiêm ngặt được kích hoạt.

Thật vậy, kịch bản sẽ không chạy. Tại sao Chrome nghĩ rằng đây là một tệp văn bản thuần túy? Nó rõ ràng có một .jsphần mở rộng tập tin.

Vì tôi đang sử dụng HTML5, tôi đã bỏ qua typethuộc tính, vì vậy tôi nghĩ rằng điều đó có thể gây ra sự cố. Vì vậy, tôi đã thêm type="text/javascript"vào <script>thẻ, và nhận được kết quả tương tự. Tôi thậm chí đã thử type="application/javascript"và vẫn nhận được lỗi tương tự.

Sau đó, tôi đã cố gắng thay đổi nó để type="text/plain"chỉ tò mò. Trình duyệt không trả về lỗi, nhưng tất nhiên JavaScript cũng không chạy.

Cuối cùng tôi nghĩ rằng các khoảng thời gian trong tên tệp có thể làm mất trình duyệt. Vì vậy, trong mã HTML của mình, tôi đã thay đổi tất cả các dấu chấm thành ký tự thoát URL %2E:

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

Điều này vẫn không hoạt động. Điều duy nhất thực sự hoạt động (tức là trình duyệt không báo lỗi và JS chạy thành công) là nếu tôi tải tệp xuống, tải tệp lên thư mục cục bộ, sau đó thay đổi srcgiá trị thành tệp cục bộ. Tôi không muốn làm điều này vì tôi đang cố gắng tiết kiệm không gian trên trang web của riêng tôi.

Làm cách nào để Chrome nhận ra rằng tệp được liên kết thực sự là một loại JavaScript?

Vấn đề bạn gặp phải nằm ngoài tầm kiểm soát của bạn vì đây là cách lưu trữ được thiết lập tại Github trên đường dẫn mà bạn đã đề cập, Loại tiện ích mở rộng không chỉ là yếu tố khi thực hiện các tệp vì lưu trữ web có thể vượt quá quy định trình duyệt kết xuất một tập tin.

Bạn có thể có tệp .zip hiển thị dưới dạng tệp .html nếu máy chủ được thiết lập để làm như vậy, bạn có thể tự kiểm tra điều này bằng cách sử dụng fireorms và xem phản hồi tiêu đề đối với đó là những gì đang được yêu cầu .... vì vậy nếu bạn yêu cầu một tệp JS nhưng phản hồi tiêu đề trả về một giá trị mong đợi khác thì các trình duyệt sẽ tôn trọng phản hồi tiêu đề và không phải là những gì được yêu cầu ...

Lưu trữ github trên tên miền phụ thô đang trở lại Content-Type text/plain; charset=utf-8là loại MIME có nghĩa là nó sẽ không hoạt động như JS mà là văn bản thô, dưới đây là một ví dụ về những gì bạn sẽ cần máy chủ quay lại để hiển thị tệp và tiếp tục xuống là mã đang được trả về bởi github.

Một máy chủ hỗ trợ loại MIME JS sẽ trông giống như:

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

Và đây là những gì https://raw.github.com/cloudhead/less.js/master/dist/less-1.3.3.jstiêu đề đang phản hồi là (RAW XEM).

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

Chỉnh sửa tháng 12 năm 2018

RawGit hiện đang bị say nắng do sử dụng độc hại, vì vậy họ khuyên bạn nên sử dụng một trong các dịch vụ sau:

• jsDelivr
• Trang GitHub
• CodeSandbox
• giảm cân

Bài gốc

Rawgithub.com cho phép người dùng lấy các phiên bản "Nguyên" của Git và biến nó thành một URL có thể sử dụng trong <script>các thẻ. Nó khá dễ sử dụng, chỉ cần xóa cái đầu tiên .khỏi URL thô. Ví dụ : cái này:

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

sẽ biến thành thế này

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

và sau đó bạn đặt nó vào một <script>thẻ với loại thích hợp. Thật đơn giản!

Họ giới hạn số lượng yêu cầu vì nó chỉ dành cho mục đích phát triển, không phải sản xuất.

Chỉnh sửa 2014

Như Reinderien đã đề cập, rawgithub bây giờ chỉ là rawgit, vì vậy liên kết tập lệnh mới sẽ là

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

Phần mở rộng tệp không liên quan, đó là tiêu đề Kiểu nội dung quan trọng và tệp đó được cung cấp với text/plainloại nội dung (mục đích của chế độ xem "thô" của Github).

Bạn thực sự nên tải một bản sao của tệp cục bộ vào trang web của bạn và bao gồm nó từ đó. Ngay cả khi nó hoạt động từ Github, vì bạn không tải tệp JS không đồng bộ, việc đặt <script>thẻ đó vào tiêu đề trang của bạn khiến trang web của bạn phụ thuộc vào tính khả dụng của Github.

Đây là một tính năng có chủ ý được thiết kế để ngăn chặn các cuộc tấn công XSS nhất định .

Như Mike West giải thích , đừng sử dụng raw.github.comnhư một CDN; sử dụng trang GitHub thay thế.

Ngoài ra, mã hóa rõ ràng các ký tự không được giám sát sẽ không thay đổi cách xử lý URL.

Như bằng cách chỉ ra vấn đề là hầu như tất cả nội dung được cung cấp bởi raw.github.com được gửi xuống dưới dạng tệp văn bản - theo cách đó, nội dung được hiển thị dưới dạng văn bản thuần trong trình duyệt của bạn mà không có bất kỳ ứng dụng hoặc sự cố nào khác cản trở. Nếu không, bạn sẽ gặp phải trường hợp cố gắng xem tệp .js có thể khiến trình duyệt cố chạy nó thay vì hiển thị cho bạn.

Trên hết, cả github và Pages.github đều không cố gắng trở thành CDN. Bạn thực sự nên:

1. Tự lưu trữ tệp, nó không lớn.
2. Sử dụng CDN chuyên dụng cho điều này và các tệp tĩnh khác trên trang web của bạn.
3. Sử dụng một cái gì đó như cdnjs.com có ​​sẵn các phiên bản khác nhau của lessjs .