Połącz i wykonaj zewnętrzny plik JavaScript hostowany na GitHub

Kiedy próbuję zmienić odnośnik lokalnego pliku JavaScript na wersję surową GitHub, mój plik testowy przestaje działać. Błąd to:

Odmowa wykonania skryptu z ... ponieważ jego typ MIME (text/plain) nie jest wykonywalny, a ścisłe sprawdzanie typu MIME jest włączone.

Czy istnieje sposób, aby wyłączyć to zachowanie, czy istnieje usługa, która umożliwia łączenie się z plikami GitHub raw?

Kod roboczy:

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

Kod niedziałający:

<script src="https://raw.github.com/mindmup/bootstrap-wysiwyg/master/bootstrap-wysiwyg.js"></script>
Author: AuthorProxy, 2013-06-27

13 answers

Istnieje jest dobrym obejściem dla tego, teraz, używając rawgit.com .

Kroki :

  1. Znajdź swój link na Githubie i kliknij na " Raw " wersji pliku.
  2. Skopiuj adres URL i link do niego.
  3. zmienić raw.githubusercontent.com na rawgit.com (nieprodukcyjne) lub cdn.rawgit.com (PRODUKCJA)

Przykład :

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

Użyj tego adresu URL do rozwoju:

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

Użyj tego adresu URL w produkcja:

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

W środowiskach produkcyjnych , rozważ kierowanie na konkretny tag lub hash commit, a nie na gałąź. RawGit nigdy nie aktualizuje pliku zapisanego w danej ścieżce po jego buforowaniu - więc linkowanie do pliku według nazwy gałęzi spowoduje, że łącze nigdy się nie zaktualizuje - nawet jeśli wykonasz dodatkowe zmiany. Linkowanie do pliku za pomocą skrótu lub znacznika powoduje, że łącze jest unikalne dla wersji.


Dlaczego jest to potrzebne?

GitHub rozpoczął za pomocą X-Content-Type-Options: nosniff, który instruuje więcej nowoczesne przeglądarki wymuszają ścisłe sprawdzanie typu MIME. Następnie zwraca raw pliki w typie MIME zwracane przez serwer, uniemożliwiające przeglądarce korzystanie plik zgodnie z przeznaczeniem (jeśli przeglądarka przestrzega tego ustawienia).

Aby dowiedzieć się więcej na ten temat, zajrzyj do tego wątku Dyskusyjnego.

 933
Author: Troy Alford,
Warning: date(): Invalid date.timezone value 'Europe/Kyiv', we selected the timezone 'UTC' for now. in /var/www/agent_stack/data/www/doraprojects.net/template/agent.layouts/content.php on line 54
2018-07-05 16:52:08

To już nie jest możliwe. GitHub wyraźnie wyłączył JavaScript Hotlinkowanie i nowsze wersje przeglądarek respektują to ustawienie.

Heads up: nosniff header support coming to Chrome and Firefox

 52
Author: Peeja,
Warning: date(): Invalid date.timezone value 'Europe/Kyiv', we selected the timezone 'UTC' for now. in /var/www/agent_stack/data/www/doraprojects.net/template/agent.layouts/content.php on line 54
2016-12-24 00:25:02

rawgithub.com przekierowania do rawgit.com więc powyższy przykład będzie teraz

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

 20
Author: Paul Browne,
Warning: date(): Invalid date.timezone value 'Europe/Kyiv', we selected the timezone 'UTC' for now. in /var/www/agent_stack/data/www/doraprojects.net/template/agent.layouts/content.php on line 54
2014-05-21 14:18:08

Aby wszystko było jasne i krótkie

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

Nie jest to jednak możliwe, ponieważ nie jest to możliwe, ponieważ nie jest to możliwe.]}
 5
Author: Tomer Ben David,
Warning: date(): Invalid date.timezone value 'Europe/Kyiv', we selected the timezone 'UTC' for now. in /var/www/agent_stack/data/www/doraprojects.net/template/agent.layouts/content.php on line 54
2016-01-20 18:19:57

Powyższe odpowiedzi wyraźnie odpowiadają na pytanie, ale chcę podać inną alternatywę - inny pogląd/podejście do rozwiązania podobnego problemu.

Możesz również użyć rozszerzenia przeglądarki, aby usunąć nagłówek odpowiedzi X-Content-Type-Options dla plików raw.githubusercontent.com. Istnieje kilka rozszerzeń przeglądarki, które modyfikują nagłówki odpowiedzi.

  1. Requestly: Chrome + Firefox
  2. Modyfikuj Nagłówki: Firefox

Jeśli użyjesz Requestly, mogę zasugerować dwa rozwiązania

Rozwiązanie 1: Użyj reguły Modyfikuj nagłówki i usuń nagłówek odpowiedzi

Kroki

  1. Install Requestly from http://www.requestly.in
  2. przejdź do strony zasad
  3. Kliknij ikonę Dodaj, aby utworzyć regułę
  4. Wybierz Modyfikuj Nagłówki
  5. podaj nazwę i opis
  6. Wybierz Remove -> Response -> X-Content-Type-Options
  7. w polu Source wpisz Url -> Contains -> raw.githubusercontent.com

Rozwiązanie 2: Użyj Zastąp host Rule

  1. Install Requestly from http://www.requestly.in
  2. przejdź do strony zasad
  3. Kliknij ikonę Dodaj, aby utworzyć regułę
  4. Zastąp raw.githubusercontent.com przez rawgit.com

Sprawdź ten zrzut ekranu, aby uzyskać więcej informacjiTutaj wpisz opis obrazka

Jak przetestować

Stworzyliśmy prosty js Fiddle, aby sprawdzić, czy możemy używać surowych plików github jako skryptów w naszym kodzie. Oto Skrzypce z następującymi kod

<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>

Jeśli widzisz Script evaluated successfully!, oznacza to, że możesz użyć surowego pliku github w swoim kodzie W przeciwnym razie Problem evaluating script wskazuje, że wystąpił problem podczas wykonywania skryptu z surowego źródła github.

Napisałem też artykułna blogu o tym. Zapoznaj się z nim, aby uzyskać więcej szczegółów.

Mam nadzieję, że to pomoże!!

Disclaimer: jestem autoremRequestly więc możesz winić za wszystko, co ci się nie podoba.

 5
Author: sachinjain024,
Warning: date(): Invalid date.timezone value 'Europe/Kyiv', we selected the timezone 'UTC' for now. in /var/www/agent_stack/data/www/doraprojects.net/template/agent.layouts/content.php on line 54
2018-07-28 05:22:33

Moim przypadkiem użycia było wczytanie' bookmarklets ' directlty z mojego konta Bitbucket, które ma takie same ograniczenia jak Github. Praca, którą wymyśliłem, polegała na Ajaxie dla skryptu i uruchomieniu eval na łańcuchu Odpowiedzi, poniżej fragment opiera się na tym podejściu.

<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>

Zauważ, że dodanie komentarza sourceURL ma pozwolić na debugowanie skryptu w narzędziach programistycznych przeglądarki.

 3
Author: Daniel Sokolowski,
Warning: date(): Invalid date.timezone value 'Europe/Kyiv', we selected the timezone 'UTC' for now. in /var/www/agent_stack/data/www/doraprojects.net/template/agent.layouts/content.php on line 54
2016-05-13 16:37:44

Https://raw.githack.com/

Znaleziono tę stronę dostarcz CDN dla

  • Usuń nosniff nagłówek http
  • fix mime type by ext name

I ta strona:

Https://rawgit.com/

 2
Author: yurenchen,
Warning: date(): Invalid date.timezone value 'Europe/Kyiv', we selected the timezone 'UTC' for now. in /var/www/agent_stack/data/www/doraprojects.net/template/agent.layouts/content.php on line 54
2017-03-22 03:44:09

Gdy plik jest przesyłany do github, możesz go użyć jako zewnętrznego źródła lub darmowego hostingu. Troy Alford wyjaśnił to znacznie wyżej. Ale żeby było łatwiej, powiem ci kilka prostych kroków, a następnie możesz użyć pliku github raw w swojej witrynie:

Oto link do Twojego pliku:

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

Teraz aby go wykonać musisz usunąć https:// i kropkę( . ) pomiędzy raw a githubusercontent

Tak:

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

Teraz, gdy odwiedzisz ten link, otrzymasz link, który może być użyty do wywołania twojego javascript:

Oto ostatni link:

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

Podobnie jeśli hostujesz plik css, musisz to zrobić, jak wspomniano powyżej. Jest to najprostszy sposób na uzyskaj prosty link do wywołania zewnętrznego pliku css lub javascript hostowanego na github.

Mam nadzieję, że to pomoże.

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

 1
Author: Fahim Raza,
Warning: date(): Invalid date.timezone value 'Europe/Kyiv', we selected the timezone 'UTC' for now. in /var/www/agent_stack/data/www/doraprojects.net/template/agent.layouts/content.php on line 54
2016-01-04 08:57:12

Najprostszy sposób:
<script type="text/plain" src="http://raw.githubusercontent.com/user/repo/branch/file.js"></script>
Serwowane przez GitHub,
i

Bardzo

wiarygodny.
Z text/plain
Tutaj wpisz opis obrazka Bez text/plain
Tutaj wpisz opis obrazka
 1
Author: ,
Warning: date(): Invalid date.timezone value 'Europe/Kyiv', we selected the timezone 'UTC' for now. in /var/www/agent_stack/data/www/doraprojects.net/template/agent.layouts/content.php on line 54
2016-05-31 02:12:43

Znalazłem błąd został wyświetlony z powodu komentarzy na początku pliku, możesz rozwiązać ten problem, po prostu tworząc swój własny plik Bez komentarza i wcisnąć do git, nie pokazuje żadnego błędu

Dla dowodu możesz wypróbować te dwa pliki z tym samym kodem łatwej paginacji:

Bez komentarza

Z komentarzem

 1
Author: santosh,
Warning: date(): Invalid date.timezone value 'Europe/Kyiv', we selected the timezone 'UTC' for now. in /var/www/agent_stack/data/www/doraprojects.net/template/agent.layouts/content.php on line 54
2017-01-29 06:49:22

raw.github.com nie jest prawdziwym surowym dostępem do zasobu plików, ale widok renderowany przez Rails. Więc dostęp raw.github.com jest znacznie cięższy niż potrzeba. Nie wiem dlaczego raw.github.com jest zaimplementowany jako widok Rails. Zamiast naprawić ten problem z trasą, GitHub dodał nagłówek X-Content-Type-Options: nosniff.

Obejście:

  • Umieść skrypt na user.github.io/repo
  • Użyj zewnętrznego CDN jak rawgit.com.
 0
Author: weakish,
Warning: date(): Invalid date.timezone value 'Europe/Kyiv', we selected the timezone 'UTC' for now. in /var/www/agent_stack/data/www/doraprojects.net/template/agent.layouts/content.php on line 54
2016-08-27 13:34:54

Alternatywnie, jeśli generujesz znaczniki po stronie serwera, możesz po prostu pobrać i wstrzyknąć. Na przykład w JSTL możesz to zrobić:

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

Nie pozwalają na Hotlinkowanie z jakiegoś powodu, więc prawdopodobnie zła forma, Jeśli chcesz być dobrym obywatelem. Proponuję buforować ten javascript i tylko faktycznie ponownie pobrać okresowo, jak uważasz za stosowne.

 0
Author: matt burns,
Warning: date(): Invalid date.timezone value 'Europe/Kyiv', we selected the timezone 'UTC' for now. in /var/www/agent_stack/data/www/doraprojects.net/template/agent.layouts/content.php on line 54
2017-05-16 13:58:26

Miałem ten sam problem co ty, to co zrobiłem to zmiana na

<script type="application/javascript" src="bootstrap-wysiwyg.js"></script>
U mnie działa.
 0
Author: Yiting Gu,
Warning: date(): Invalid date.timezone value 'Europe/Kyiv', we selected the timezone 'UTC' for now. in /var/www/agent_stack/data/www/doraprojects.net/template/agent.layouts/content.php on line 54
2018-06-10 02:23:58