Зв'язати та виконати зовнішній файл JavaScript, розміщений на GitHub

Коли я намагаюся змінити посилання посилання локального файлу JavaScript на необоротну версію GitHub, тестовий файл перестає працювати. Помилка:

Відмовлено виконувати сценарій з ... оскільки його тип MIME ( text/plain ) не виконується, і ввімкнено перевірку типу строкового MIME-типу.

Чи є спосіб відключити цю поведінку або чи існує служба, яка дозволяє пов'язати файли з GitHub?

Робочий код:

<script src="bootstrap-wysiwyg.js"></script>

Non-Робочий код:

<script src="https://raw.github.com/mindmup/bootstrap-wysiwyg/master/bootstrap-wysiwyg.js"></script>
474
дуже хороший момент.
додано Автор Muhammad Umer, джерело
rawgit.com - це новий домен зараз
додано Автор Muhammad Umer, джерело
@MuhammadUmer - тільки якщо ваші вихідні файли ніколи не змінюються . rawgit кеш ніколи не оновлюється .
додано Автор vsync, джерело
додано Автор Nitesh, джерело

13 Відповіді

Там це хороший шлях до цього, тепер, використовуючи rawgit.com .

Steps:

  1. Знайдіть свою посилання на GitHub і натисніть на версію файлу, що є неочікуваною.
  2. Скопіюйте URL-адресу та посилайтеся на нього.
  3. Змініть raw.githubusercontent.com на rawgit.com (невиробничий) або cdn.rawgit.com (виробництво)

Example:

http://raw.githubusercontent.com/user/repo/branch/file.js

Використовуйте цю URL-адресу для розробки:

http://rawgit.com/user/repo/branch/file.js

Використовуйте цю URL-адресу у виробництві:

http://cdn.rawgit.com/user/repo/tag/file.js

For production environments, consider targeting a specific tag or commit-hash rather than the branch. RawGit never updates the file stored at a given path once it is cached - so linking to a file by branch name will cause your link to never update - even if you make additional commits. Linking to a file by commit-hash or tag makes the link unique to version.


Чому це потрібно?

GitHub почав використовувати X-Content-Type-options: nosniff , який доручає більше сучасні браузери, щоб забезпечити перевірку строгого типу MIME. Потім він повертає сировину файли в типі MIME, що повертаються на сервері, запобігаючи використанню браузера файл за призначенням (якщо браузер віддає перевагу налаштуванню).

Щоб отримати інформацію про цю тему, перегляньте цю дискусійну тему .

921
додано
Це далеко не ідеально, оскільки rawgit ніколи не оновлює файл , якщо воно було оновлено на github , тому потрібно оновити всі URL-адреси за допомогою rawgit скрізь ... смокче.
додано Автор vsync, джерело
Я не знаю, хто володіє цим сайтом rawgit, але не використовуйте його у виробництві. Ви матимете невідомої сторонньої сторони, яка зможе ввести будь-який JavaScript на своєму сайті.
додано Автор neves, джерело
Блискучі, я шукав це для мого тесту jsFiddle довгий час, дякую
додано Автор AbdelHady, джерело
Також працює для гістів. Я зміг замінити gist.githubusercontent.com за допомогою rawgist.com і отримав його роботу.
додано Автор haridsv, джерело
@Maciej Krawczyk - так - на сторінці явно рекомендується скористатися посиланням, пов'язаним із конкретним завданням, а не посиланням на галузь саме з цієї причини.
додано Автор Troy Alford, джерело
@vsync Хоча я думаю, що я вже розглянув це обмеження у відповідь, я відредагував саме зараз, щоб зробити це ще яснішим і яскравим, як проблема - і як подолати її для людей, які бажають скористатися функціями CDN.
додано Автор Troy Alford, джерело
@FrankvanPuffelen Оновлено, щоб відобразити це. Дякую, що зауважили це!
додано Автор Troy Alford, джерело
Майте на увазі, що файли кешування постійно. Тому, коли ви оновлюєте файл, він буде зберігати стару версію.
додано Автор Maciej Krawczyk, джерело

Це вже не можливо. GitHub явно вимкнув JavaScript hotlinking та новіші версії браузерів поважають це налаштування.

Початок роботи: підтримка заголовка nosniff, що надходить до Chrome і Firefox

52
додано
rawgit.com просто працював тут FWIW ...
додано Автор rogerdpack, джерело
Велике спасибі за це посилання.
додано Автор AuthorProxy, джерело

rawgithub.com redirects to rawgit.com So the above example would now be

http://rawgit.com/user/package/master/link.min.js

20
додано
Це працює.
додано Автор Jonatas Walker, джерело
Відвідайте rawgit.com та вставте URL-адресу для файлу чи суті. Він створить для вас дійсний URL-адресу.
додано Автор Marcelo Vani, джерело

<�Сильного> Вище відповіді чітко відповісти на питання, але я хочу, щоб надати іншу альтернативу -. Інший погляд/підхід до вирішення подібної проблеми

Ви також можете використовувати розширення браузера, щоб видалити заголовки відповіді X-Content-Type-Options для файлів raw.githubusercontent.com . Є кілька розширень для веб-переглядача для редагування заголовків відповідей.

  1. Requestly: Chrome + Firefox
  2. Modify Headers: Firefox

Якщо ви використовуєте Request, я можу запропонувати два рішення

Рішення 1: Використовуйте Правило редагування заголовків і видаліть заголовок відповіді

Кроки

  1. Install Requestly from http://www.requestly.in
  2. Go to Rules Page
  3. Click on Add Icon to create a rule
  4. Select Modify Headers
  5. Give a Name and Descripton
  6. Select Remove -> Response -> X-Content-Type-Options
  7. In Source field, enter Url -> Contains -> raw.githubusercontent.com

Рішення 2: Використовувати Замінити Правило Хостингу

  1. Install Requestly from http://www.requestly.in
  2. Go to Rules Page
  3. Click on Add Icon to create a rule
  4. Replace raw.githubusercontent.com with rawgit.com

Check this screenshot for more detailsenter image description here

Як протестувати

Ми створили просту JS Fiddle, щоб перевірити, чи можемо ми використати сирі файли github як скрипти в нашому коді. Ось Fiddle з наступним кодом

<script src="https://raw.githubusercontent.com/sachinjain024/practicebook/master/web-extensions-master/storage/background.js"></script>
<script>
try {
  if (typeof BG.Methods !== 'undefoned') {
    document.getElementById('msg').innerHTML = 'Script evaluated successfully!';
  }
} catch (e) {
  document.getElementById('msg').innerHTML = 'Problem evaluating script';
}
</script>

Якщо ви бачите Script successfully evaluated! , це означає, що ви можете використовувати сирий файл github у вашому коді В іншому випадку Сценарій оцінювання проблеми вказує на те, що під час виконання сценарію з вихідного джерела github виникає певна проблема.

Я також написав статтю на запитаний блог про це . Будь ласка, зверніться до нього для отримання додаткової інформації.

Сподіваюся, це допомагає !!

Відмова від відповідальності: Я є автором Requesting . Таким чином, ви можете винувати за все, що вам не подобається.

5
додано

Щоб зробити речі чіткі та короткі

//raw.githubusercontent.com --> //rawgit.com

Зауважте, що це обробляється хостингом розробки rawgit, а не їхнім cdn для хостингу виробництва

5
додано
Схоже, що за замовчуванням недійсна URL-адреса змінюється з моменту відповідей, і тепер перетворення є https://raw.githubusercontent.com -> https://rawgit.com . В іншому випадку ця відповідь є ясним і працює.
додано Автор mikeym, джерело
@mikeym оновлено
додано Автор Chris Marisic, джерело

Моїм випадком було завантажити директорію booklets з мого облікового запису Bitbucket, що має такі ж обмеження, як Github. Робота навколо я придумала до AJAX для сценарію і запустити eval в рядку відповіді, нижче фрагмент на основі цього підходу.

<script>
    var sScriptURL ='<script-URL-here>'; 
    var oReq = new XMLHttpRequest(); 
    oReq.addEventListener("load", 
       function fLoad() {eval(this.responseText + '\r\n//# sourceURL=' + sScriptURL)}); 
    oReq.open("GET", sScriptURL); oReq.send(); false;
</script>

Зауважте, що додавання коментаря sourceURL полягає в тому, щоб дозволити відлагодження сценарію в інструментах розробника веб-переглядача.

3
додано

https://raw.githack.com/

виявив, що цей сайт постачає CDN для

  • видаліть заголовок http nosniff
  • виправте mime type за допомогою імені ext

і цей сайт:

https://rawgit.com/

2
додано

Коли файл завантажується в github, ви можете використовувати його як зовнішнє джерело чи безкоштовний хостинг. Трой Алфорд пояснив це набагато вище. Але, щоб зробити це простіше, дозвольте мені сказати вам кілька простих кроків, то ви можете використовувати github неофіційний файл на своєму сайті:

Ось посилання вашого файлу:

https://raw.githubusercontent.com/mindmup/bootstrap-wysiwyg /master/bootstrap-wysiwyg.js

Now to execute it you have to remove https:// and the dot( . ) between raw and githubusercontent

Подобається це:

rawgithubusercontent.com/mindmup/bootstrap-wysiwyg/master/bootstrap-wysiwyg.js

Тепер, коли ви відвідаєте це посилання, ви отримаєте посилання, яке можна використовувати для виклику javascript:

Ось остання посилання:

https://rawgit.com/mindmup/bootstrap-wysiwyg/master/bootstrap -wysiwyg.js

Точно так само, якщо ви розмістите файл css, ви повинні зробити це, як зазначено вище. Найпростіший спосіб отримати просте посилання для виклику вашого зовнішнього CSS або javascript-файлу, розміщеного на github.

Я сподіваюсь, що це корисно.

Referance URL: http://101helper.blogspot.com/2015/11/store-blogger-codes-on-github-boost-blogger-speed.html

1
додано

Найпростіший спосіб:
<script type = "text/plain" src = "http://raw.githubusercontent.com/user/repo/branch/file.js"> </script>
Обслуговує GitHub,
і

дуже

reliable.
With text/plain
enter image description here Without text/plain
enter image description here
1
додано
ні. все це не дозволяє сценарію навіть працювати
додано Автор Steven Penny, джерело
Це найкраще рішення, він просто працює і має настільки сенс.
додано Автор a20, джерело
Це більше не буде працювати найближчим часом. З мого пристрою Android logcat: "Отримання сценаріїв з неправильними атрибутами типу/мови застарілими і буде видалено в M56, приблизно в січні 2017 року. Див. chromestatus.com/features/5760718284521472 для більш детальної інформації. "
додано Автор Jens Hauke, джерело

Я виявив, що помилка була показана через коментарі на початку файлу. Ви можете вирішити цю проблему, просто створивши власний файл без коментарів і натисніть на git, він не показує помилки

Для підтвердження ви можете спробувати ці два файли з таким самим кодом простого набору сторінок:

без коментарів

з коментарем

1
додано

Як альтернатива, якщо генерувати сервер розмітки, ви можете просто завантажити та вставити. Наприклад, в JSTL ви можете зробити це:

<script type="text/javascript">
    
</script>

Вони не дозволяють "гарячі" посилання на причину, тому, ймовірно, погану форму, якщо ви хочете бути хорошим громадянином. Я запропонував вам кешувати цей JavaScript і лише періодично повторно завантажувати його, як вам здається.

0
додано

raw.github.com is not truely raw access to file asset, but a view rendered by Rails. So accessing raw.github.com is much heavier than needed. I don't know why raw.github.com is implemented as a Rails view. Instead of fix this route issue, GitHub added a X-Content-Type-Options: nosniff header.

Обхідний шлях:

  • Put the script to user.github.io/repo
  • Use a third party CDN like rawgit.com.
0
додано

Я мав таку ж проблему, як і ви, що я зробив - це зміна

<script type="application/javascript" src="bootstrap-wysiwyg.js"></script>

Це працює для мене.

0
додано
ІТ КПІ - JavaScript
ІТ КПІ - JavaScript
504 учасників

співтовариство javascript розробників в Telegram