Reaktion: Axios-Netzwerkfehler

Lesezeit: 5 Minuten

Dies ist das erste Mal, dass ich Axios verwende, und ich bin auf einen Fehler gestoßen.

  axios.get(
    `http://someurl.com/page1?param1=1&param2=${param2_id}`
  )
  .then(function(response) {
    alert();
  })
  .catch(function(error) {
    console.log(error);
  });

Mit der richtigen URL und den richtigen Parametern bekomme ich beim Überprüfen der Netzwerkanfragen zwar die richtige Antwort von meinem Server, aber wenn ich die Konsole öffne, sehe ich, dass sie den Rückruf nicht aufgerufen hat, sondern einen Fehler festgestellt hat.

Fehler: Netzwerkfehler Stack-Trace: createError@http://localhost:3000/static/js/bundle.js:2188:15
handleError@http://localhost:3000/static/js/bundle.js:1717:14

Vielleicht kannst du mehr darüber herausfinden, indem du verwendest console.log(error.response.data).

– fnune

31. August 2017 um 11:28 Uhr
Sehen Sie sich diese Antwort an, damit Sie wissen, was genau der Fehler ist. stackoverflow.com/questions/44806333/…

– Shubham Khatri

31. August 2017 um 11:37 Uhr
@FaustoNA error.response ist undefiniert

– Mirakurun

3. September 2017 um 13:07 Uhr
@ShubhamKhatri Anscheinend ist CORS das Problem

– Mirakurun

3. September 2017 um 15:27 Uhr
Toll, dass du das erkennen konntest. Behandeln Sie jedoch Fehler mit Axios, wie in dem von mir geposteten Link erwähnt

– Shubham Khatri

3. September 2017 um 16:18 Uhr

Jacobhobson

Beim Erstellen einer API mit NodeJS

Ihre Express-App muss CORS (Cross-Origin Resource Sharing) verwenden. Fügen Sie Ihrer Serverdatei Folgendes hinzu:

// This should already be declared in your API file
var app = express();

// ADD THIS
var cors = require('cors');
app.use(cors());

Für ein umfassenderes Verständnis von CORS lesen Sie bitte die Mozilla-Dokumentation zu CORS.

Ich verwende Express nicht. Ich verwende Axios in der ReactJS-App. Was kann ich tun, um CORS in Axios zu verwenden?

– Ahmed

12. August 2019 um 21:13 Uhr
Ein wichtiger Punkt ist das Hinzufügen der cors-Middleware vor dem Code, mit dem Sie die Anfrage verarbeiten

– Deniz Özger

25. August 2020 um 19:22 Uhr
DANKE! Lebensrettend. Ich habe versucht, eine Winkel-App auszuführen, die von meinem Telefon aus mit dem Knoten kommuniziert, und es hat nicht funktioniert. Auch wenn es von meinem Computer aus funktionierte. Wenn der Knoten CORS „Modul nicht gefunden“ nicht finden kann, führen Sie einfach npm install cors aus.

– Ramón Araujo

17. September 2020 um 8:01 Uhr
Diese Antwort gilt auch für NestJS, ich habe den gleichen Fehler auf der Clientseite erhalten und musste hinzufügen { cors: true } Zu NestFactory.create. – ,,,,, app = await NestFactory.create(AppModule, { cors: true });

– Ofir G

26. März 2021 um 14:48 Uhr
Ich verwende Django. Wie kann ich dieses Problem lösen?

– Gipfel

2. Mai 2021 um 16:34 Uhr

Mahdieh Shavandi

Mein Problem war die URL, die ich angefordert hatte. Ich hatte nicht eingefügt http:// am Anfang meiner URL. Ich meine, ich habe eine URL wie angefordert 92.920.920.920/api/Token anstatt http://92.920.920.920/api/Token. Hinzufügen http:// mein Problem gelöst.

Ich benutze das, ich lade sogar meine nodejs-App auf Heroku hoch

– gebundener Schlamm

4. April 2020 um 16:33 Uhr

Es passiert, wenn Sie auf localhost arbeiten und vergessen haben, es hinzuzufügen http://

Falsche Verwendung

  const headers = {
    "Content-Type": "application/json",
    Authorization: apiKey,
  };
  const url = "localhost:5000/api/expenses/get-expenses";

  axios.get(url, { headers });

  // NETWORK ERROR

Das Richtige ist

  const headers = {
    "Content-Type": "application/json",
    Authorization: apiKey,
  };
  const url = "http://localhost:5000/api/expenses/get-expenses";

  axios.get(url, { headers });

  // WORKS FINE IF YOU HANDLED CORS CORRECTLY IN THE SERVER SIDE

Das Vergessen des Ports hat dazu geführt, dass es bei mir nicht funktioniert hat, und diese Hilfe löst den Gedanken aus, danke!

– Jim

23. März 2021 um 19:52 Uhr

Zusätzlich zur Antwort von @jacobhobson hatte ich auch einige Parameter verwendet, damit es funktionierte.

app.use(cors({origin: true, credentials: true}));

Hassan Rana

Ich hatte das gleiche Problem bei der Produktion von Digital Ocean Droplet. Ich benutzte Axios In ReagierenJS anrufen Node.js API.

Obwohl ich cors eingeschlossen habe

const cors = require('cors');
app.use(cors());

Aber ich musste noch hinzufügen

res.header( "Access-Control-Allow-Origin" );

bevor ich meinen Controller rufe. Und es hat bei mir funktioniert. Dort stellte ich fest, dass cors nicht richtig funktioniert. Also habe ich sie deinstalliert und erneut installiert und es funktioniert!

Vollständiger Code ist hier.

Also entweder Sie verwenden

 app.use(function(req, res, next) {
  res.header("Access-Control-Allow-Origin", "*");
  res.header('Access-Control-Allow-Methods', 'GET, POST, OPTIONS, PUT, PATCH, DELETE');
  res.header("Access-Control-Allow-Headers", "x-access-token, Origin, X-Requested-With, Content-Type, Accept");
  next();
});

oder verwenden

app.use(cors());

Es ist das gleiche.

und wo ich cors “` const cors = require(‘cors’); app.use(cors()); “` ?

– jhon

4. Juli 2020 um 8:23 Uhr
Sie können es verwenden, bevor Sie Ihre Routen in server.js aufrufen, oder wenn Sie Middleware verwenden, können Sie diese Zeilen dort einfügen. PS Ich habe meine Antwort auch aktualisiert.

– Hassan Rana

14. Juli 2020 um 17:42 Uhr
Ich habe Verwendung app.use(cors()); obwohl es einen Netzwerkfehler anzeigt. Aber nicht jedes Mal erhalte ich diesen Fehler. Ich rufe eine API für das Hochladen von Videos auf. Nach mehrmaligem Aufrufen wirft es mir den Netzwerkfehler.

– Jayna Tanawala

17. August 2021 um 6:04 Uhr
@JaynaTanawala Hast du cors installiert? Versuchen Sie, “npm install cors –save” auszuführen.

– Hassan Rana

30. November 2021 um 7:58 Uhr
Ja. Habe es installiert.

– Jayna Tanawala

2. Dezember 2021 um 6:03 Uhr

Skoua

Ich habe einen Netzwerkfehler mit Axios 0.27.2 erhalten, als ich versuchte, ein Bild auf unseren Server hochzuladen. Nachdem ich Header wie unten gesetzt habe, wird kein Fehler empfangen.

headers:{"Accept":"application/json, text/plain, /","Content-Type": "multipart/form-data"}

und Sie müssen den Körpertyp Ihrer API-Anfrage in Ihrer Sammlung überprüfen, z.

und wo ich cors “` const cors = require(‘cors’); app.use(cors()); “` ?

– jhon

4. Juli 2020 um 8:23 Uhr
Sie können es verwenden, bevor Sie Ihre Routen in server.js aufrufen, oder wenn Sie Middleware verwenden, können Sie diese Zeilen dort einfügen. PS Ich habe meine Antwort auch aktualisiert.

– Hassan Rana

14. Juli 2020 um 17:42 Uhr
Ich habe Verwendung app.use(cors()); obwohl es einen Netzwerkfehler anzeigt. Aber nicht jedes Mal erhalte ich diesen Fehler. Ich rufe eine API für das Hochladen von Videos auf. Nach mehrmaligem Aufrufen wirft es mir den Netzwerkfehler.

– Jayna Tanawala

17. August 2021 um 6:04 Uhr
@JaynaTanawala Hast du cors installiert? Versuchen Sie, “npm install cors –save” auszuführen.

– Hassan Rana

30. November 2021 um 7:58 Uhr
Ja. Habe es installiert.

– Jayna Tanawala

2. Dezember 2021 um 6:03 Uhr

Amir Mehrnam

In meinem Fall habe ich “https” anstatt “http“, prüfen Sie das auch.

zum Beispiel sollten Sie verwenden https://api.coincap.io/v2/assets Nicht api.coincap.io/v2/assets in der Axios-URL

– Zahldarsfett

21. Mai 2022 um 8:54 Uhr

14419200cookie-checkReaktion: Axios-Netzwerkfehler

#Axios #Javascript #reagieren