Fetch-API funktioniert nicht mit localhost/127.0.0.1

Question

Genau wie im Hintergrund, ich habe eine Reaktion App auf einer Remote-EC2 Ubuntu-Instanz sitzen. Auf demselben Server wird auch eine Go-App ausgeführt, die Port 8080 überwacht (der Port wurde von den Sicherheitseinstellungen für jeden geöffnet).

Ich versuche, einen Antrag zu stellen mit API holen, aus der App Reaktion, wie folgt:

var bearer = 'Bearer ...' 
return fetch('http://localhost:8080/home', { 
    headers: new Headers({ 
    'Authorization': bearer 
    }) 
}) 

in der Konsole aus sowohl Chrome und Firefox, erhalte ich:

Typeerror : NetworkError beim Versuch, Ressource abzurufen

Das gleiche gilt, wenn ich localhost durch 127.0.0.1 ersetzen.

Die Verwendung der externen IP der EC2-Instanz funktioniert jedoch (und löst eine CORS-Anforderung aus - aufgrund des Headers 'Authorization' - der vom Server problemlos verarbeitet wird).

Im letzteren Fall kann ich auch sehen, dass der Server die eingehende Anfrage sowohl für OPTIONS als auch für GET protokolliert (im ersten Fall sind keine Protokolle für beide Methoden vorhanden).

Ich versuchte auch CURL'ing von der EC2-Maschine zu localhost und die Anfrage geht effektiv durch, die mich zu der Annahme führt, dass mit der Fetch-API die Anfrage überhaupt nicht ausgelöst wird.

Jeder Rat würde geschätzt werden. Wenn ich etwas falsch mache, zeige mir bitte in die richtige Richtung.

Answer 1

Wenn Sie schreiben localhost ruft es Ihren (localhost) Rechner (auf dem der Browser vorhanden ist), weil der js Code in Ihrem Browser ausgeführt wird.

Sie sollten eine Domäne/Subdomäne für Ihren API-Endpunkt erstellen und diese anstelle von localhost verwenden oder weiterhin die fest codierte IP-Adresse verwenden.

Sie sollten auch nur Ihre Frontend-Website-Domain in den erlaubten Ursprüngen für Ihr Backend zulassen. Ex. Ihre Website kann www.example.com und Back-End-URL www.api.example.com sein. Sie sollten nur www.example.com als origin zulassen, die über www.api.example.com bedient werden können. Sie müssen dies im Backend konfigurieren.