Свяжите и выполните внешний файл JavaScript, размещенный на GitHub

Когда я пытаюсь изменить связанную ссылку локального файла JavaScript на исходную версию GitHub, мой тестовый файл перестает работать. Ошибка:

Отказано в выполнении script из... потому что его тип MIME (text/plain) не является исполняемым, а строгая проверка типа MIME включена.

Есть ли способ отключить это поведение или есть служба, которая позволяет связываться с необработанными файлами GitHub?

Рабочий код:

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

Нерабочий код:

<script src="https://raw.github.com/mindmup/bootstrap-wysiwyg/master/bootstrap-wysiwyg.js"></script>
+497
источник поделиться
14 ответов

Для этого есть хороший обходной путь, используя jsdelivr.net.

Шаги:

  1. Найдите свою ссылку на GitHub и перейдите к "сырой" версии.
  2. Скопируйте URL.
  3. Измените raw.githubusercontent.com на cdn.jsdelivr.net
  4. Вставьте /gh/ перед вашим именем пользователя.
  5. Удалить название branch.
  6. (Необязательно) Вставьте версию, на которую вы хотите @version, как @version (если вы этого не сделаете, вы получите самую последнюю версию - что может привести к долгосрочному кешированию)

Примеры:

http://raw.githubusercontent.com/<username>/<repo>/<branch>/path/to/file.js

Используйте этот URL, чтобы получить последнюю версию:

http://cdn.jsdelivr.net/gh/<username>/<repo>/path/to/file.js

Используйте этот URL, чтобы получить конкретную версию или зафиксировать хеш:

http://cdn.jsdelivr.net/gh/<username>/<repo>@<version or hash>/path/to/file.js

В производственных средах рассмотрите возможность нацеливания на определенный тег или хэш-фиксацию, а не на ветвь. Использование последней ссылки может привести к долгосрочному кешированию файла, в результате чего ваша ссылка не будет обновляться при установке новых версий. Ссылка на файл по коммит-хешу или тегу делает ссылку уникальной для версии.


Зачем это нужно?

В 2013 году GitHub начал использовать X-Content-Type-Options: nosniff, который предписывает более современным браузерам применять строгую проверку типов MIME. Затем он возвращает необработанные файлы в MIME-типе, возвращенном сервером, не позволяя браузеру использовать файл по назначению (если браузер учитывает настройку).

Для справки по этой теме, пожалуйста, обратитесь к этой теме обсуждения.

+957
источник

Это больше невозможно. GitHub явно отключил горячую ссылку JavaScript, и более новые версии браузеров уважают этот параметр.

Heads up: поддержка заголовков nosniff для Chrome и Firefox

+53
источник
другие ответы

Связанные вопросы


Похожие вопросы

rawgithub.com перенаправляется на rawgit.com Итак, приведенный выше пример будет

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

+21
источник

Приведенные выше ответы четко отвечают на вопрос, но я хочу предоставить другую альтернативу - другой взгляд/подход для решения аналогичной проблемы.

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

  1. По запросу: Chrome + Firefox
  2. Изменить заголовки: Firefox

Если вы используете Requestly, я могу предложить два решения

Решение 1. Используйте правило "Изменить заголовки" и удалите заголовок ответа.

меры

  1. Установите Requestly с http://www.requestly.in
  2. Перейти на страницу правил
  3. Нажмите на иконку Добавить, чтобы создать правило
  4. Выберите Изменить заголовки
  5. Дать имя и описание
  6. Выберите RemoveResponseX-Content-Type-Options
  7. В поле Источник введите UrlContainsraw.githubusercontent.com

Решение 2. Используйте правило замены хоста

  1. Установите Requestly с http://www.requestly.in
  2. Перейти на страницу правил
  3. Нажмите на иконку Добавить, чтобы создать правило
  4. Замените raw.githubusercontent.com на rawgit.com

Проверьте этот скриншот для получения более подробной информации enter image description here

Как проверить

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

<center id="msg"></center>

<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 evaluated successfully! , Это означает, что вы можете использовать необработанный файл github в своем коде. В противном случае Problem evaluating script указывает на наличие проблем при выполнении сценария из исходного файла github.

Я также написал статью в блоге Requestly об этом. Пожалуйста, обратитесь к нему для более подробной информации.

Надеюсь, поможет!!

Отказ от ответственности: я автор Requestly, так что вы можете обвинить во всем, что вам не нравится.

+6
источник

Чтобы все было ясно и коротко

//raw.githubusercontent.com//rawgit.com

Обратите внимание, что это обрабатывается хостом разработки rawgit, а не их cdn для хостинга

+5
источник

Моим вариантом было загрузить 'bookmarklets' direclty из моей учетной записи Bitbucket, которая имеет те же ограничения, что и Github. Работа, с которой я столкнулся, была в AJAX для script и запустить 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 заключается в разрешении отладки script в инструментах разработчика браузера.

+4
источник

https://raw.githack.com/

нашел этот сайт поставлять CDN для

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

и этот сайт:

https://rawgit.com/

ПРИМЕЧАНИЕ: RawGit достиг конца срока полезного использования.

+3
источник

GitHub Pages является официальным решением GitHubs для этой проблемы.

raw.githubusercontent заставляет все файлы использовать MIME-тип text/plain, даже если это файл CSS или JavaScript. Таким образом, переход на https://raw.githubusercontent.com/‹user›/‹repo›/‹branch›/‹filepath› будет не правильным MIME-типом, а обычным текстом, и связать его через <link href="..."/> или <script src="..."></script> работать - CSS не будет применяться /JS не будет работать.

GitHub Pages размещает репо по специальному URL, поэтому все, что вам нужно сделать, это проверить свои файлы и нажать кнопку. Обратите внимание, что в большинстве случаев GitHub Pages требует, чтобы вы фиксировали специальную ветку, gh-pages.

На вашем новом сайте, который обычно называется https://‹user›.github.io/‹repo›, каждый файл, зафиксированный в ветке gh-pages (самая последняя фиксация), присутствует в этом URL. Таким образом, вы можете связать свой файл js с помощью <script src="https://‹user›.github.io/‹repo› /file.js"></script>, и это будет правильный тип MIME.

У вас есть файлы сборки?

Лично я рекомендую запустить эту ветку параллельно master. В ветке gh-pages вы можете отредактировать свой файл .gitignore чтобы проверить все файлы dist/build, которые вам нужны для вашего сайта (например, если у вас есть какие-либо минифицированные/скомпилированные файлы), при этом они игнорируются в вашей master ветке. Это полезно, потому что вы обычно не хотите отслеживать изменения в файлах сборки в вашем обычном репо. Каждый раз, когда вы хотите обновить размещенные файлы, просто объедините master с gh-pages, перестройте, зафиксируйте и затем нажмите.

(protip: вы можете объединить и перестроить в одном коммите с этими шагами :)

$ git checkout gh-pages
$ git merge --no-ff --no-commit master  # prepare the merge but dont commit it (as if there were a merge conflict)
$ npm run build                         # (or whatever your build process is)
$ git add .                             # stage the newly built files
$ git merge --continue                  # commit the merge
$ git push origin gh-pages
+2
источник

Когда файл загружается в github, вы можете использовать его как внешний источник или бесплатный хостинг. Трой Элфорд объяснил это намного выше. Но чтобы это стало проще, позвольте мне сказать вам несколько простых шагов, вы можете использовать файл github raw на вашем сайте:

Вот ссылка на файл:

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

Теперь для его выполнения вы должны удалить https:// и точку (.) между raw и 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.

Я надеюсь, что это будет полезно.

URL ссылки: http://101helper.blogspot.com/2015/11/store-blogger-codes-on-github-boost-blogger-speed.html

+1
источник

Я обнаружил, что ошибка была показана из-за комментариев в начале файла. Вы можете решить эту проблему, просто создав свой собственный файл без комментариев и нажав на git, он не обнаруживает ошибки

Для доказательства вы можете попробовать эти два файла с одним и тем же кодом простой разбивки на страницы:

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

с комментарием

+1
источник

У меня была та же проблема, что и у вас, но я изменил на

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

Меня устраивает.

+1
источник

Самый простой способ:
<script type="text/plain" src="http://raw.githubusercontent.com/user/repo/branch/file.js"></script>
Подается GitHub,
и

очень

надежным.
С помощью text/plain
введите описание изображения здесь  Без text/plain
введите описание изображения здесь
0
источник

raw.github.com не является подлинно необработанным доступом к файловому ресурсу, но представление, созданное Rails. Поэтому доступ к raw.github.com намного тяжелее, чем необходимо. Я не знаю, почему raw.github.com реализовано как представление Rails. Вместо исправления этой проблемы GitHub добавил заголовок X-Content-Type-Options: nosniff.

Обход проблемы:

  • Поместите script в user.github.io/repo
  • Используйте сторонний CDN, такой как rawgit.com.
0
источник

В качестве альтернативы, если вы создаете серверную часть разметки, вы можете просто извлечь и ввести. Например, в JSTL вы можете сделать это:

<script type="text/javascript">
    <c:import url="https://raw.github.com/mindmup/bootstrap-wysiwyg/master/bootstrap-wysiwyg.js" />
</script>

Они не разрешают хотлинкинг по какой-то причине, поэтому, вероятно, плохую форму, если вы хотите быть хорошим гражданином. Я бы посоветовал вам кэшировать этот javascript и только на самом деле повторно извлекать периодически, как вы сочтете нужным.

0
источник

Посмотрите другие вопросы по меткам или Задайте вопрос