it-swarm.com.de

XMLHttpRequest kann keine Datei laden. Cross Origin-Anforderungen werden nur für HTTP unterstützt

Ich erhalte folgende Fehlermeldung:

XMLHttpRequest cannot load file:///C:/Users/richa.agiwal/Desktop/get/rm_Library/templates/template_viewSettings.html. Cross Origin requests are only supported for HTTP. 

Mir ist klar, dass diese Frage bereits beantwortet wurde, aber ich habe immer noch keine Lösung für mein Problem gefunden. Ich habe versucht, chrome.exe --allow-file-access-from-files von der Eingabeaufforderung aus auszuführen und die Datei in das lokale Dateisystem zu verschieben. Ich erhalte jedoch immer noch dieselbe Fehlermeldung.

Ich freue mich über Vorschläge!

107
xTMNTxRaphaelx

Wenn Sie beispielsweise HTML und Javascript in einem Code-Editor auf Ihrem PC schreiben und die Ausgabe in Ihrem Browser testen, werden Sie wahrscheinlich Fehlermeldungen über Cross Origin Requests erhalten. Ihr Browser rendert HTML und führt Javascript, jQuery, angleJs in Ihrem Browser aus, ohne dass ein Server eingerichtet werden muss. Viele Webbrowser sind jedoch so programmiert, dass sie auf Cross Site-Angriffe achten und Anfragen blockieren. Sie möchten nicht, dass nur jemand Ihre Festplatte über Ihren Webbrowser lesen kann. Sie können mit Notepad ++ eine voll funktionsfähige Webseite erstellen, auf der Javascript und Frameworks wie jQuery und angleJs ausgeführt werden. und testen Sie alles, indem Sie den Notepad ++ - Menüpunkt RUN, LAUNCH IN FIREFOX verwenden. Dies ist eine schöne und einfache Möglichkeit, eine Webseite zu erstellen. Wenn Sie jedoch mehr als Layout, CSS und einfache Seitennavigation erstellen, benötigen Sie einen lokalen Server auf Ihrem Computer.

Hier sind einige Optionen, die ich benutze.

  1. Testen Sie Ihre Webseite lokal in Firefox und stellen Sie sie auf Ihrem Host bereit.
  2. oder: Führen Sie einen lokalen Server aus

Testen Sie auf Firefox, Deploy to Host

  1. Firefox erlaubt derzeit Cross Origin Requests aus Dateien, die von Ihrer Festplatte aus bereitgestellt werden
  2. Ihre Webhosting-Site lässt Anforderungen an Dateien in Ordnern zu, die von der Manifestdatei konfiguriert werden

Führen Sie einen lokalen Server aus

  • Führen Sie einen Server wie Apache oder Python auf Ihrem Computer aus
  • Python ist kein Server, aber es wird ein einfacher Server ausgeführt

Führen Sie einen lokalen Server mit Python aus

Holen Sie sich Ihre IP-Adresse:

  • Unter Windows: Öffnen Sie die Eingabeaufforderung. Alle Programme, Zubehör, Eingabeaufforderung
  • Ich lasse den Command Prompt immer als Administrator laufen. Klicken Sie mit der rechten Maustaste auf den Menüpunkt Command Prompt und suchen Sie nach Run As Administrator.
  • Geben Sie den Befehl: ipconfig ein und drücken Sie die Eingabetaste.
  • Suchen Sie nach: IPv4-Adresse. . . . . . . . 12.123.123.00
  • Es gibt Websites, auf denen auch Ihre IP-Adresse angezeigt wird

Wenn Sie nicht über Python verfügen, laden Sie es herunter und installieren Sie es.

Über die Eingabeaufforderung müssen Sie in den Ordner wechseln, in dem sich die Dateien befinden, die Sie als Webseite verwenden möchten.

  • Wenn Sie zum Verzeichnis C:\Root zurückkehren müssen, geben Sie cd/ein.
  • geben Sie cd Laufwerk:\Folder\Folder\etc ein, um zu dem Ordner zu gelangen, in dem sich Ihre HTML-Datei (oder PHP usw.) befindet.
  • Überprüfen Sie den Pfad. Typ: Pfad an der Eingabeaufforderung. Sie müssen den Pfad zu dem Ordner sehen, in dem sich Python befindet. Befindet sich Python beispielsweise in C:\Python27, müssen Sie diese Adresse in den aufgeführten Pfaden sehen.
  • Wenn sich der Pfad zum Python-Verzeichnis nicht im Pfad befindet, müssen Sie den Pfad festlegen. Geben Sie den Hilfepfad ein und drücken Sie die Eingabetaste. Sie sehen Hilfe für den Pfad.
  • Geben Sie Folgendes ein: Pfad c:\python27% Pfad% 
  • % path% behält alle aktuellen Pfade bei. Sie möchten nicht alle Ihre aktuellen Pfade löschen, sondern fügen Sie einfach einen neuen Pfad hinzu.
  • Erstellen Sie den neuen Pfad aus dem Ordner, in dem Sie die Dateien bereitstellen möchten.
  • Starten Sie den Python-Server: Geben Sie Folgendes ein: python -m SimpleHTTPServer port Wobei 'Port' die Nummer des gewünschten Ports ist, beispielsweise python -m SimpleHTTPServer 1337
  • Wenn Sie den Port leer lassen, wird standardmäßig Port 8000 verwendet
  • Wenn der Python-Server erfolgreich gestartet wird, wird eine Nachricht angezeigt.

Führen Sie Ihre Webanwendung lokal aus

  • Öffnen Sie einen Browser
  • Geben Sie in die Adresszeile Folgendes ein: http://your IP address:port
  • http://xxx.xxx.x.x:1337 oder http://xx.xxx.xxx.xx:8000 für die Standardeinstellung
  • Wenn der Server funktioniert, sehen Sie im Browser eine Liste Ihrer Dateien
  • Klicken Sie auf die Datei, die Sie liefern möchten, und diese sollte angezeigt werden.

Fortgeschrittenere Lösungen

  • Installieren Sie einen Code-Editor, einen Webserver und andere integrierte Dienste.

Sie können Apache, PHP, Python, SQL, Debugger usw. separat auf Ihrem Computer installieren und dann viel Zeit darauf verwenden, um herauszufinden, wie sie alle zusammenarbeiten können, oder suchen Sie nach einer Lösung, die all diese Dinge kombiniert.

Ich mag es, XAMPP mit der NetBeans-IDE zu verwenden. Sie können auch WAMP installieren, das einen User Interface für die Verwaltung und Integration von Apache und anderen Diensten bereitstellt.

150
Sandy Good

Einfache Lösung

Wenn Sie mit reinen HTML/Js/Css-Dateien arbeiten.

Installieren Sie diese kleine Server-App ( link ) in Chrome. Öffnen Sie die App und verweisen Sie den Dateispeicherort auf Ihr Projektverzeichnis. 

Gehe zu der in der App angezeigten URL.

Edit: Intelligentere Lösung mit Gulp

Schritt 1: Gulp installieren. Führen Sie den folgenden Befehl in Ihrem Terminal aus. 

npm install gulp-cli -g
npm install gulp -D

Schritt 2: Erstellen Sie in Ihrem Projektverzeichnis eine Datei mit dem Namen gulpfile.js. Kopieren Sie den folgenden Inhalt hinein.

var gulp        = require('gulp');
var bs          = require('browser-sync').create();   

gulp.task('serve', [], () => {
        bs.init({
            server: {
               baseDir: "./",
            },
            port: 5000,
            reloadOnRestart: true,
            browser: "google chrome"
        });
        gulp.watch('./**/*', ['', bs.reload]);
});

Schritt 3: Installieren Sie das Browser-Synchronisierungsgulp-Plugin. Führen Sie in demselben Verzeichnis, in dem sich gulpfile.js befindet, den folgenden Befehl aus

npm install browser-sync gulp --save-dev

Schritt 4: Starten Sie den Server. Führen Sie in demselben Verzeichnis, in dem sich gulpfile.js befindet, den folgenden Befehl aus

gulp serve
87
Sushant Kr

Dieser Fehler tritt auf, weil Sie HTML-Dokumente direkt über den Browser öffnen. Um dies zu beheben, müssen Sie Ihren Code von einem Webserver aus bereitstellen und über localhost darauf zugreifen. Wenn Sie Apache eingerichtet haben, verwenden Sie es, um Ihre Dateien bereitzustellen. Einige IDEs verfügen über integrierte Webserver, wie JetBrains IDEs, Eclipse ...

Wenn Sie Node.Js eingerichtet haben, können Sie http-server verwenden. Starten Sie einfach npm install http-server -g und Sie können es in Terminals wie http-server C:\location\to\app.Kirill Fuchs

2
MEAbid

Dieser Fehler trat auf, während ich mein Web-API-Projekt lokal bereitstellte. Ich rief das API-Projekt nur mit der folgenden URL auf:

localhost // meinAPIProjekt

Da die Fehlermeldung besagt, dass es nicht http: // ist, habe ich die URL geändert und ein Präfix http wie unten angegeben eingefügt, und der Fehler war verschwunden.

http: // localhost // myAPIProject

1
Usman

Abhängig von Ihren Anforderungen, Sie können Ihre (Dummy-) JSON jedoch auch vorübergehend überprüfen, indem Sie sie unter http://myjson.com speichern. Kopieren Sie den API-Link und fügen Sie ihn in Ihren Javascript-Code ein. Viola! Wenn Sie die Codes bereitstellen möchten, dürfen Sie nicht vergessen, diese URL in Ihren Codes zu ändern!

0
user5613899

Wenn Sie das WebStorm-Javascript IDE verwenden, können Sie Ihr Projekt einfach über WebStorm in Ihrem Browser öffnen. WebStorm startet automatisch einen Server und diese Fehler werden nicht mehr angezeigt, da Sie jetzt mit den zulässigen/unterstützten Protokollen (HTTP) auf die Dateien zugreifen.

0
mathew11

Hinzufügen zu Alan Wells 's ausführliche Antwort hier ist eine schnelle Lösung

Führen Sie einen lokalen Server aus

sie können den Ordner any auf Ihrem Computer mit Serve bedienen

Navigieren Sie zunächst mit der Befehlszeile in den Ordner, den Sie bereitstellen möchten.

Dann

npx i -g serve
serve

oder wenn Sie Serve mit dem Herunterladen testen möchten

npx serve

und das ist es! Sie können Ihre Dateien unter http: // localhost: 50 anzeigen

enter image description here

0
Bar Horing