Ressource wegen Nichtübereinstimmung des MIME-Typs blockiert (X-Content-Type-Options: nosniff)


92

Ich entwickle eine Webseite mit JavaScript und HTML. Alles hat gut funktioniert, als ich diese Fehlerliste von meiner HTML-Seite erhalten habe:

The resource from “https://raw.githubusercontent.com/dataarts/dat.gui/master/build/dat.gui.min.js”
  was blocked due to MIME type mismatch (X-Content-Type-Options: nosniff).
The resource from “https://raw.githubusercontent.com/mrdoob/three.js/dev/build/three.js” was
  blocked due to MIME type mismatch (X-Content-Type-Options: nosniff).
The resource from “https://raw.githubusercontent.com/mrdoob/three.js/master/examples/js/renderers/CanvasRenderer.js”
  was blocked due to MIME type mismatch (X-Content-Type-Options: nosniff).
The resource from “https://raw.githubusercontent.com/mrdoob/three.js/master/examples/js/renderers/Projector.js”
  was blocked due to MIME type mismatch (X-Content-Type-Options: nosniff).
The resource from “https://raw.githubusercontent.com/mrdoob/three.js/dev/build/three.js” was
  blocked due to MIME type mismatch (X-Content-Type-Options: nosniff).

Diese Fehler traten nach einem automatischen Browser-Update (Mozilla Firefox) auf. Möglicherweise wurde im Setup etwas geändert. Kennen Sie eine Möglichkeit, dieses Problem zu lösen?


11
Laden Sie keine Dateien von GitHub. Verwenden Sie stattdessen ein CDN.
SLaks

Antworten:


75

Überprüfen Sie, ob der Dateipfad korrekt ist und die Datei vorhanden ist - in meinem Fall war dies das Problem -, als ich das Problem behoben habe. Der Fehler ist verschwunden


Ich bin auch mit dem gleichen Problem konfrontiert und die Datei befindet sich auch nicht im Pub-Verzeichnis. Was soll ich machen? Es ist eine benutzerdefinierte Themendatei.
Saiid

@SaiidatRLTSquare Wenn eine Datei nicht vorhanden ist, sollten Sie sie irgendwo finden und dort ablegen - oder wenn diese Datei nicht wichtig ist - entfernen Sie einfach die Zeile, die sie enthält (oder erstellen Sie eine leere Datei), damit kein Fehler
auftritt

Durch die Verwendung von Passenger with Node wurden meine Build-Pfade deaktiviert und durch Aktualisieren der Pfade behoben. Vielen Dank!
Aaron Belchamber

28

Dies kann durch Ändern Ihrer URL behoben werden, Beispiel schlecht:

https://raw.githubusercontent.com/svnpenn/bm/master/yt-dl/yt-dl.js
Content-Type: text/plain; charset=utf-8

Beispiel gut:

https://cdn.rawgit.com/svnpenn/bm/master/yt-dl/yt-dl.js
content-type: application/javascript;charset=utf-8

rawgit.com ist ein Caching-Proxy-Service für Github. Sie können auch dorthin gehen und interaktiv eine entsprechende URL für Ihre ursprüngliche raw.githubusercontent.com- URL ableiten . Siehe die FAQ


3
In der Addess raw.githubusercontent.comwird ersetzt, durch cdn.rawgit.comdie mit dem richtigen MIME-Typ geantwortet wird .
Axel Guilmin

rawgit wird heruntergefahren. Sie können jsdeliver wie in der folgenden Antwort erläutert verwenden - stackoverflow.com/a/64456518/9640177
mayank1513

14

Dieser Fehler trat in der Produktion auf, nachdem unser Entwicklerteam die Webserverkonfiguration durch Hinzufügen geändert hatte X-Content-Type-Options: nosniff. Aus diesem Grund war der Browser gezwungen, die Ressourcen so zu interpretieren, wie es in den content-typeParametern der Antwortheader erwähnt wurde.

Von Anfang an hat unser Anwendungsserver den Inhaltstyp der js-Dateien explizit als festgelegt text/plain. Da dies X-Content-Type-Options: nosniffnicht im Webserver festgelegt war, interpretierte der Browser die js-Dateien automatisch als JavaScript-Dateien, obwohl der Inhaltstyp als text / plain angegeben wurde. Dies wird als MIME-Sniffing bezeichnet. Nach dem Festlegen von X-Content-Type-Options: nosniff war der Browser nun gezwungen, das MIME-Sniffing nicht durchzuführen und den Inhaltstyp wie in den Antwortheadern angegeben zu übernehmen. Aus diesem Grund interpretierte es js-Dateien als reine Textdateien und verweigerte deren Ausführung oder blockierte sie. Das gleiche wird in Ihren Fehlern gezeigt.

Lösung: Lassen Sie Ihren Server die content-typeJS-Dateien als festlegen

application/javascript;charset=utf-8

Auf diese Weise werden alle JS-Dateien normal geladen und das Problem wird behoben.


Wo ich den Serverinhaltstyp einstellen muss, meine ich, welche Datei ich behalten muss, ich benutze Tomcat 8.5 Server
Bhaskara Arani

Es hängt alles von der Anwendungsarchitektur ab. In unserem Fall handelte es sich um eine einfache alte Monolithanwendung auf Servlet-Basis. Daher wurde es genau dort in der Servicemethode eingestellt.
Manish Bansal

Was ist stattdessen mit dem Ändern des HTML?
Aaron Franke

Es tut uns leid. Ich habe dich nicht verstanden. Hier gab es kein HTML. Wir hatten eine servletbasierte Anwendung. Welche Änderung schlagen Sie in HTML vor?
Manish Bansal

12

Überprüfen Sie Ihren Pfad. Dieser Fehler tritt auf, wenn in dem angegebenen Pfad keine Datei vorhanden war.


6

Verwenden Sie Express?

Überprüfen Sie Ihren Pfad (beachten Sie das " /" nach / public /):

app.use(express.static(__dirname + "/public/"));

// Hinweis: Sie benötigen das "/" nicht vor "css", da es bereits oben enthalten ist:

rel="stylesheet" href="css/style.css

Hoffe das hilft


5

Für Wordpress

In meinem Fall habe ich gerade den Schrägstrich "/" nach get_template_directory_uri () verpasst, sodass der resultierende / generierte Pfad falsch war:

Mein falscher Code:

wp_enqueue_script( 'retina-js', get_template_directory_uri().'js/retina.min.js' ); 

Mein korrigierter Code:

wp_enqueue_script( 'retina-js', get_template_directory_uri().'/js/retina.min.js' );

3

Dies kann daran liegen, dass der Browser nicht auf eine Datei zugreifen kann. Ich bin beim Erstellen einer Anwendung mit node.js auf diese Art von Fehler gestoßen. Sie können versuchen, die Skriptdatei direkt anzufordern (URL kopieren und einfügen) und prüfen, ob Sie sie abrufen können. Sie können dann sehen, was das eigentliche Problem ist. Dies kann an der Erlaubnis des Ordners liegen, in dem sich die Datei befindet, oder der Browser kann sie aufgrund eines falschen Pfads nicht finden. In node.js funktioniert nach Angabe der Route zur Datei alles.


Laut dieser MS-Seite scheint es sich um ein Problem vom Typ MIME zu handeln. Aber wie würde man den MIMETyp in Node.js angeben ? (Man sollte nicht vollständige Pfade zu allen Dateien angeben müssen, sondern nur zu den Assets-Verzeichnissen, nein?)
not2qubit

3

Es könnte ein falscher Weg sein. Stellen Sie in Ihrer Haupt-App-Datei sicher, dass Sie:

app.use(express.static(path.join(__dirname,"public")));

Beispiellink zu Ihrem CSS als:

<link href="/css/clean-blog.min.css" rel="stylesheet">

Ähnliches gilt für den Link zu js-Dateien:

<script src="/js/clean-blog.min.js"></script>

2

Ich habe dieses Problem gelöst, indem ich den Zeichensatz in js-Dateien von UTF-8 ohne Stückliste in einfaches UTF-8 in Notepad ++ geändert habe


1

Ich hatte diesen Fehler, als ich den Azure-Speicher als statische Website verwendete. Die kopierten JS-Dateien hatten den Inhaltstyp als text/plain; charset=utf-8und ich änderte den Inhaltstyp inapplication/javascript

Es fing an zu arbeiten.


0

Siehe für die Protokolle HTTPS und HTTP

Wenn Sie gemischte Protokolle verwenden (dies geschieht meistens bei JSONP-Rückrufen), kann es manchmal vorkommen, dass Sie in diesem FEHLER landen.

Stellen Sie sicher, dass sowohl die Webseite als auch die Ressourcenseite dieselben HTTP-Protokolle haben.


0

Ich habe auch das gleiche Problem in Django Server. Also habe ich DEBUG = True in der Datei settings.py geändert, es funktioniert


0

Es ist mir wegen eines falschen Tags passiert. Aus Versehen füge ich die js-Datei im linkTag hinzu.

Beispiel: (Der Falsche)

<link rel="stylesheet" href="plugins/timepicker/bootstrap-timepicker.min.js">

Es wurde gelöst, indem das richtige Tag für verwendet wurde javascript. Beispiel:

<script src="plugins/timepicker/bootstrap-timepicker.min.js"></script>

0

https://cdn.rawgit.com wird heruntergefahren. Somit kann eine der alternativen Optionen verwendet werden. JSDeliver ist eine kostenlose CDN, die verwendet werden kann.

// Lade eine GitHub-Version, ein Commit oder einen Zweig

// Hinweis: Wir empfehlen die Verwendung von npm für Projekte, die dies unterstützen

https://cdn.jsdelivr.net/gh/user/repo@version/file

// lade jQuery v3.2.1

https://cdn.jsdelivr.net/gh/jquery/jquery@3.2.1/dist/jquery.min.js

// Verwenden Sie einen Versionsbereich anstelle einer bestimmten Version

https://cdn.jsdelivr.net/gh/jquery/jquery@3.2/dist/jquery.min.js

https://cdn.jsdelivr.net/gh/jquery/jquery@3/dist/jquery.min.js

// Lass die Version komplett weg, um die neueste zu erhalten

// Sie sollten dies NICHT in der Produktion verwenden

https://cdn.jsdelivr.net/gh/jquery/jquery/dist/jquery.min.js

// füge ".min" zu jeder JS / CSS-Datei hinzu, um eine minimierte Version zu erhalten

// Wenn es keine gibt, generieren wir sie für Sie

https://cdn.jsdelivr.net/gh/jquery/jquery@3.2.1/src/core.min.js

// füge / am Ende hinzu, um eine Verzeichnisliste zu erhalten

https://cdn.jsdelivr.net/gh/jquery/jquery/

ref - https://www.jsdelivr.com/?docs=gh

Durch die Nutzung unserer Website bestätigen Sie, dass Sie unsere Cookie-Richtlinie und Datenschutzrichtlinie gelesen und verstanden haben.
Licensed under cc by-sa 3.0 with attribution required.