Wenn ich versuche, die verknüpfte Referenz einer lokalen JavaScript-Datei in eine GitHub-Rohversion zu ändern, funktioniert meine Testdatei nicht mehr. Der Fehler ist:

Die Ausführung des Skripts von ... wurde abgelehnt, da der MIME-Typ ( text/plain) nicht ausführbar ist und die strikte Überprüfung des MIME-Typs aktiviert ist.

Gibt es eine Möglichkeit, dieses Verhalten zu deaktivieren, oder gibt es einen Dienst, der das Verknüpfen mit GitHub-Rohdateien ermöglicht?

Arbeitscode:

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

Nicht funktionierender Code:

<script src="https://raw.github.com/mindmup/bootstrap-wysiwyg/master/bootstrap-wysiwyg.js"></script>

Es gibt jetzt eine gute Problemumgehung , indem Sie jsdelivr.net verwenden .

Schritte :

1. Suchen Sie Ihren Link auf GitHub und klicken Sie auf die "Raw" -Version.
2. Kopieren Sie die URL.
3. Wechseln Sie raw.githubusercontent.comzucdn.jsdelivr.net
4. Fügen Sie /gh/vor Ihrem Benutzernamen ein.
5. Entfernen Sie den branchNamen.
6. (Optional) Geben Sie die Version ein, zu der Sie einen Link erstellen möchten, da @version(wenn Sie dies nicht tun, erhalten Sie die neueste Version - was zu langfristigem Caching führen kann).

Beispiele :

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

Verwenden Sie diese URL, um die neueste Version zu erhalten:

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

Verwenden Sie diese URL, um eine bestimmte Version oder einen bestimmten Commit-Hash abzurufen:

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

Ziehen Sie in Produktionsumgebungen die Ausrichtung auf ein bestimmtes Tag oder einen bestimmten Commit-Hash anstelle des Zweigs in Betracht. Die Verwendung des neuesten Links kann dazu führen, dass die Datei langfristig zwischengespeichert wird und Ihr Link beim Pushen neuer Versionen nicht aktualisiert wird. Durch das Verknüpfen mit einer Datei per Commit-Hash oder Tag wird der Link für die Version eindeutig.

Warum wird das benötigt?

Im Jahr 2013 begann GitHub mit der Verwendung X-Content-Type-Options: nosniff, die modernere Browser anweist, eine strikte MIME-Typprüfung zu erzwingen. Anschließend werden die Rohdateien in einem vom Server zurückgegebenen MIME-Typ zurückgegeben, wodurch verhindert wird, dass der Browser die Datei wie beabsichtigt verwendet (wenn der Browser die Einstellung berücksichtigt).

Hintergrundinformationen zu diesem Thema finden Sie in diesem Diskussionsthread .

Dies ist nicht mehr möglich. GitHub hat das JavaScript-Hotlinking explizit deaktiviert, und neuere Versionen von Browsern berücksichtigen diese Einstellung.

Heads up: Unterstützung für Nosniff-Header für Chrome und Firefox

rawgithub.comWeiterleitungen zu rawgit.comSo wäre das obige Beispiel nun

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

GitHub Pages ist die offizielle Lösung von GitHub für dieses Problem.

raw.githubusercontentAlle Dateien verwenden den text/plainMIME-Typ, auch wenn es sich bei der Datei um eine CSS- oder JavaScript-Datei handelt. Es https://raw.githubusercontent.com/‹user›/‹repo›/‹branch›/‹filepath›wird also nicht der richtige MIME-Typ sein, sondern eine Klartextdatei, und die Verknüpfung über <link href="..."/>oder <script src="..."></script>funktioniert nicht - das CSS wird nicht angewendet / das JS wird nicht ausgeführt.

GitHub Pages hostet Ihr Repo unter einer speziellen URL. Sie müssen also nur Ihre Dateien einchecken und pushen. Beachten Sie, dass Sie für GitHub Pages in den meisten Fällen einen speziellen Zweig festlegen müssen gh-pages.

Auf Ihrer neuen Site befindet sich normalerweise https://‹user›.github.io/‹repo›jede für den gh-pagesZweig festgeschriebene Datei (die letzte Festschreibung) unter dieser URL. Dann können Sie über auf Ihre js-Datei verlinken <script src="https://‹user›.github.io/‹repo›/file.js"></script>, und dies ist der richtige MIME-Typ.

Haben Sie Build-Dateien?

Persönlich empfehle ich, diesen Zweig parallel zu zu betreiben master. In der gh-pagesVerzweigung können Sie Ihre .gitignoreDatei bearbeiten , um alle für Ihre Site erforderlichen dist / build-Dateien einzuchecken (z. B. wenn Sie minimierte / kompilierte Dateien haben), während Sie diese in Ihrer masterVerzweigung ignorieren . Dies ist nützlich, da Sie normalerweise keine Änderungen an Build-Dateien in Ihrem regulären Repo verfolgen möchten. Jedes Mal , wenn Sie möchten , dass Ihre gehosteten Dateien zu aktualisieren, einfach fusionieren masterzu gh-pages, wieder aufzubauen, verpflichten, und dann drücken.

(protip: Mit diesen Schritten können Sie im selben Commit zusammenführen und neu erstellen :)

$ git checkout gh-pages
$ git merge --no-ff --no-commit master  # prepare the merge but don’t 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

Die obigen Antworten beantworten die Frage klar, aber ich möchte eine andere Alternative anbieten - eine andere Sichtweise / Herangehensweise, um das ähnliche Problem zu lösen.

Sie können auch die Browser-Erweiterung verwenden, um den X-Content-Type-OptionsAntwortheader für raw.githubusercontent.comDateien zu entfernen . Es gibt einige Browsererweiterungen zum Ändern von Antwortheadern.

1. Anfrage: Chrome + Firefox
2. Header ändern: Firefox

Wenn Sie Requestly verwenden, kann ich zwei Lösungen vorschlagen

Lösung 1: Verwenden Sie die Regel "Header ändern" und entfernen Sie den Antwortheader

Schritte

1. Installieren Sie Requestly von http://www.requestly.in
2. Gehen Sie zur Regelseite
3. Klicken Sie auf Symbol hinzufügen, um eine Regel zu erstellen
4. Wählen Sie Header ändern
5. Geben Sie einen Namen und eine Beschreibung
6. Wählen Sie Remove-> Response->X-Content-Type-Options
7. Geben Sie im Feld Quelle Url-> Contains-> einraw.githubusercontent.com

Lösung 2: Verwenden Sie Hostregel ersetzen

1. Installieren Sie Requestly von http://www.requestly.in
2. Gehen Sie zur Regelseite
3. Klicken Sie auf Symbol hinzufügen, um eine Regel zu erstellen
4. Ersetzen raw.githubusercontent.comdurchrawgit.com

Überprüfen Sie diesen Screenshot für weitere Details

Wie zu testen

Wir haben eine einfache JS-Geige erstellt, um zu testen, ob wir rohe Github-Dateien als Skripte in unserem Code verwenden können. Hier ist die Geige mit dem folgenden Code

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

Wenn Sie sehen Script evaluated successfully!, bedeutet dies, dass Sie die Raw-Github-Datei in Ihrem Code verwenden können. Andernfalls wird Problem evaluating scriptangezeigt, dass beim Ausführen des Skripts aus der Raw-Github-Quelle ein Problem vorliegt.

Ich habe auch einen Artikel auf Requestly Blog darüber geschrieben. Bitte beziehen Sie sich auf es für weitere Details.

Ich hoffe es hilft!!

Haftungsausschluss: Ich bin Autor von Requestly. Sie können also für alles verantwortlich machen, was Ihnen nicht gefällt.

https://raw.githack.com/

fand diese Seite liefern ein CDN für

• nosniffhttp-Header entfernen
• Fix mime typedurch ext Namen

und diese Seite:

https://rawgit.com/

HINWEIS: RawGit hat das Ende seiner Nutzungsdauer erreicht

Um die Dinge klar und kurz zu machen

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

Beachten Sie, dass dies vom Entwicklungshosting von rawgit und nicht vom CDN für das Produktionshosting erledigt wird

Mein Anwendungsfall bestand darin, " Lesezeichen " direkt von meinem Bitbucket-Konto zu laden, das dieselben Einschränkungen wie Github hat. Die Arbeit, die ich mir ausgedacht habe, war AJAX für das Skript und die Ausführung evalauf der Antwortzeichenfolge. Das folgende Snippet basiert auf diesem Ansatz.

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

Beachten Sie, dass das Anhängen eines sourceURLKommentars das Debuggen des Skripts in den Entwicklertools des Browsers ermöglichen soll.

Wenn eine Datei auf github hochgeladen wird, können Sie sie als externe Quelle oder als kostenloses Hosting verwenden. Troy Alford hat es oben gut erklärt. Aber um es einfacher zu machen, möchte ich Ihnen einige einfache Schritte erklären, dann können Sie eine Github-Rohdatei auf Ihrer Site verwenden:

Hier ist der Link Ihrer Datei:

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

Um es jetzt auszuführen, müssen Sie https: // und den Punkt (.) Zwischen raw und githubusercontent entfernen

So was:

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

Wenn Sie diesen Link besuchen, erhalten Sie einen Link, über den Sie Ihr Javascript aufrufen können:

Hier ist der letzte Link:

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

Wenn Sie eine CSS-Datei hosten, müssen Sie dies wie oben beschrieben tun. Dies ist der einfachste Weg, um einen einfachen Link zum Aufrufen Ihrer externen CSS- oder Javascript-Datei zu erhalten, die auf Github gehostet wird.

Ich hoffe das ist hilfreich.

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

Ich fand, dass der Fehler aufgrund der Kommentare am Anfang der Datei angezeigt wurde. Sie können dieses Problem lösen, indem Sie einfach Ihre eigene Datei ohne Kommentar erstellen und auf git drücken. Es wird kein Fehler angezeigt

Zum Beweis können Sie diese beiden Dateien mit demselben Code für die einfache Paginierung ausprobieren:

ohne Kommentar

mit Kommentar

Ich hatte das gleiche Problem wie Sie. Ich habe mich geändert

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

Für mich geht das.

Einfachster Weg:
<script type="text/plain" src="http://raw.githubusercontent.com/user/repo/branch/file.js"></script>
Serviert von GitHub
und

sehr

raw.github.comist kein wirklich roher Zugriff auf das Datei-Asset, sondern eine von Rails gerenderte Ansicht. Der Zugriff raw.github.comist also viel schwerer als nötig. Ich weiß nicht, warum raw.github.comes als Rails-Ansicht implementiert ist. Anstatt dieses Routenproblem zu beheben, fügte GitHub einen X-Content-Type-Options: nosniffHeader hinzu .

Problemumgehung:

• Setzen Sie das Skript auf user.github.io/repo
• Verwenden Sie ein CDN eines Drittanbieters wie rawgit.com.

Wenn Sie Ihr Markup serverseitig generieren, können Sie es auch einfach abrufen und injizieren. In JSTL können Sie beispielsweise Folgendes tun:

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

Sie erlauben aus einem bestimmten Grund kein Hotlinking, also wahrscheinlich eine schlechte Form, wenn Sie ein guter Bürger sein wollen. Ich würde vorschlagen, dass Sie dieses Javascript zwischenspeichern und es nur regelmäßig nach Bedarf abrufen.

Beispiel

Original

https://raw.githubusercontent.com/antelove19/qrcodejs/master/qrcode.min.js

cdn.jsdelivr.net

https://cdn.jsdelivr.net/gh/antelove19/qrcodejs/qrcode.min.js