web-dev-qa-db-de.com

Wie kann ich einer Axios-Anfrage Rohdatenkörper hinzufügen?

Ich versuche, mit einer API aus meiner React-Anwendung über Axios zu kommunizieren. Es ist mir gelungen, die GET-Anfrage zum Laufen zu bringen, aber jetzt brauche ich eine POST.

Ich brauche den Körper als Rohtext, da ich eine MDX-Abfrage darin schreiben werde. Hier ist der Teil, in dem ich die Anfrage stelle:

axios.post(baseUrl + 'applications/' + appName + '/dataexport/plantypes' + plan,
    {
      headers: { 'Authorization': 'Basic xxxxxxxxxxxxxxxxxxx',
      'Content-Type' : 'text/plain' }
    }).then((response) => {
      this.setState({data:response.data});
      console.log(this.state.data);
    });

Hier habe ich den Inhaltstyp Teil hinzugefügt. Aber wie kann ich den Körperteil hinzufügen?

Vielen Dank.

Bearbeiten:

Hier ist ein Screenshot der funktionierenden Postman-Anfrage  Postman working request

2
Karim Taha

Wie wäre es mit der direkten axios-API?

axios({
  method: 'post',
  url: baseUrl + 'applications/' + appName + '/dataexport/plantypes' + plan,
  headers: {}, 
  data: {
    foo: 'bar', // This is the body part
  }
});

Quelle: axios api

3
Ukasyah

Sie können das unten stehende verwenden, um den Rohtext zu übergeben.

axios.post(baseUrl + 'applications/' + appName + '/dataexport/plantypes' + plan, body,
  {
  headers: { 'Authorization': 'Basic xxxxxxxxxxxxxxxxxxx',
  'Content-Type' : 'text/plain' }
  }).then((response) => {
  this.setState({data:response.data});
  console.log(this.state.data);
});

Lassen Sie einfach Ihren Rohtext in body oder übergeben Sie ihn direkt in Anführungszeichen als 'raw text to be sent' anstelle von body.

Die Unterschrift des axios-Postens lautet axios.post(url[, data[, config]]), daher übergeben Sie die data an dem Anforderungshauptteil.

1
Madhu Bhat

Ich habe das gleiche Problem. Also habe ich mir das Axios-Dokument angesehen. Ich habe es gefunden. du kannst es so machen. Das ist der einfachste Weg. und super einfach.

https://www.npmjs.com/package/axios#using-applicationx-www-form-urlencoded-format

var params = new URLSearchParams();
params.append('param1', 'value1');
params.append('param2', 'value2');
axios.post('/foo', params);

Sie können .then, .catch verwenden.

1
hahaha

Originalreferenz von axios.post auf Github .

axios.post(`${baseUrl}applications/${appName}/dataexport/plantypes${plan}`, {
    mdxQuery: '<your_mdx_query>',
  })
  .then(function (response) {
    console.log(response);
  })
  .catch(function (error) {
    console.log(error);
  });

Die zusätzlichen Parameter von request sollten als drittes Argument verwendet werden (zB wie in diesem Issue-Snippet ):

axios.post(`${baseUrl}applications/${appName}/dataexport/plantypes${plan},
   {
     mdxQuery: '<your_mdx_query>',
   },
   {
     headers: { 
       'Authorization': 'Basic xxxxxxxxxxxxxxxxxxx',
       'Content-Type': 'text/plain'
     }
   }
);
0
Xarvalus

Das hast du in meinem Projekt gemacht

 axios({
  method: "POST",
  url: "https://URL.com/api/services/fetchQuizList",
  headers: {
    "x-access-key": data,
    "x-access-token": token
  }
   data: {
     quiz_name: quizname,

   }
})
  .then(res => {
    console.log("res", res.data.message);

  })
  .catch(err => {
    console.log("error in request", err);
  });

Das sollte helfen

0
Adnan shah