Question

我正在尝试使用Axios与我的React应用程序中的API通信。我设法使GET请求起作用，但现在我需要一个POST。

我需要正文为原始文本，因为我将在其中编写一个MDX查询。这是我发出请求的部分：

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);
    });

在这里，我添加了内容类型部分。但是如何添加身体部位？

谢谢。

编辑：

这是工作邮递员请求的屏幕截图

Answer 1

如何使用直接axios API？

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

来源：axios api

Answer 2

axios({
  method: 'post',     //put
  url: url,
  headers: {'Authorization': 'Bearer'+token}, 
  data: {
     firstName: 'Keshav', // This is the body part
     lastName: 'Gera'
  }
});

Answer 3

关键是使用@MadhuBhat提到的"Content-Type": "text/plain"。

axios.post(path, code, { headers: { "Content-Type": "text/plain" } }).then(response => {
    console.log(response);
});

如果使用.NET，要注意的一点是，控制器的原始字符串将返回415 Unsupported Media Type。要解决此问题，您需要将原始字符串封装在这样的连字符中，并以"Content-Type": "application/json"的形式发送：

axios.post(path, "\"" + code + "\"", { headers: { "Content-Type": "application/json" } }).then(response => {
    console.log(response);
});

C＃控制器：

[HttpPost]
public async Task<ActionResult<string>> Post([FromBody] string code)
{
    return Ok(code);
}

https://weblog.west-wind.com/posts/2017/sep/14/accepting-raw-request-body-content-in-aspnet-core-api-controllers

如果有帮助，您还可以使用查询参数进行POST：

.post(`/mails/users/sendVerificationMail`, null, { params: {
  mail,
  firstname
}})
.then(response => response.status)
.catch(err => console.warn(err));

这将发布带有两个查询参数的空正文：

开机自检 http：// localhost：8000 / api / mails / users / sendVerificationMail？mail = lol％40lol.com＆firstname = myFirstName

来源：https://stackoverflow.com/a/53501339/3850405

Answer 4

您可以使用以下内容传递原始文本。

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);
});

只需将您的原始文本放在body中，或直接将其引为引号内的'raw text to be sent'代替body。

axios帖子的签名为axios.post(url[, data[, config]])，因此data是您传递请求正文的地方。

Answer 5

有许多方法可以通过post请求发送原始数据。我个人喜欢这个。

    const url = "your url"
    const data = {key: value}
    const headers = {
        "Content-Type": "application/json"
    }
    axios.post(url, data, headers)

Answer 6

你可以像这样传递参数

await axios.post(URL, {
  key:value //Second param will be your body
},
{
headers: {
  Authorization: ``,
  'Content-Type': 'application/json'
}

这也使得在 Jest 中测试/模拟更容易

Answer 7

axios.post on 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);
  });

请求的附加参数应作为第3个参数（例如in this Issue snippet）：

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

Answer 8

您在我的项目中做到了

<?php if (date("j") == 4): ?>
<div align="center" style="background-color: #61FF33; padding: 7px 0px; display: none;">
   <marquee style="color: black; font-size: 20px; width: 90%">Today is 4th</marquee>
</div>
<?php endif ?>

这应该有帮助

Answer 9

axios请求的格式如下：

axios.post（url [，data [，config]]）; 身体可以传递数据，标头可以在配置中传递。

Answer 10

我发现唯一可行的解决方案是transformRequest属性，该属性使您可以在发送请求之前覆盖axios准备的额外数据。

    axios.request({
        method: 'post',
        url: 'http://foo.bar/',
        data: {},
        headers: {
            'Content-Type': 'application/x-www-form-urlencoded',
        },
        transformRequest: [(data, header) => {
            data = 'grant_type=client_credentials'
            return data
        }]
    })

Answer 11

您可以使用邮递员生成代码。看看这张图片。按照第 1 步和第 2 步操作。

如果您的端点只接受使用 Body 发送的数据（在邮递员中），您应该发送 FormData。

var formdata = new FormData();
//add three variable to form
formdata.append("imdbid", "1234");
formdata.append("token", "d48a3c54948b4c4edd9207151ff1c7a3");
formdata.append("rate", "4");
      
let res = await axios.post("/api/save_rate", dataform);

如何将原始数据主体添加到axios请求中？

11 个答案: