Fetch 方法不发送带有 post 的内容答案

【问题标题】：Fetch method does not send content with postFetch 方法不发送带有 post 的内容
【发布时间】：2020-11-21 18:51:24
【问题描述】：

Bellow 是我为登录 uni Web 应用程序而编写的代码的一部分。当我在 Postman 中使用以下参数发布帖子时，它允许我登录并将我重定向到个人资料页面，但是当我从我的应用程序发布帖子时没有任何反应。我用Charles查看request，发现request的内容是空的。我在定期通过网络登录时在浏览器（网络监视器和源代码）中发现了这个参数。

这个方法取自 Postman，所以我相信它应该像在 Postman 中一样在应用程序中工作。

const loginHandler = () => {
   console.log("-----------------!!!-------------");
   var myHeaders = new Headers();
   myHeaders.append("Content-Type", "application/x-www-form-urlencoded");
  
   var urlencoded = new URLSearchParams();
   urlencoded.append("__EVENTTARGET", " ");
   urlencoded.append("__EVENTARGUMENT", " ");
   urlencoded.append(
     "__VIEWSTATE",
     "stg"
   );
   urlencoded.append("__VIEWSTATEGENERATOR", " xxx");
   urlencoded.append(
     "__EVENTVALIDATION",
     " /something"
   );
   urlencoded.append("txtLogin", " username");
   urlencoded.append("txtPassword", " pass");
   urlencoded.append("btnLogin", " Login");

   var requestOptions = {
     method: "POST",
     headers: myHeaders,
     body: urlencoded,
     redirect: "follow",
   };

   fetch(
     "http://example/login.aspx",
     requestOptions 
   )
     .then((response) => response.text())
     .then((result) => console.log(result))
     .catch((error) => console.log("error", error));
 };

有没有可能是body没有正确编码？

【问题讨论】：

您可能不想在没有 HTTPS 的情况下发送用户名和密码...此外，CORS 限制可能会阻止您发布到另一个来源。我不相信 Postman 有这个限制。
@PatrickRoberts 的问题在于URLSearchParams() 和标题，我不得不将其更改为FormData() 并出于某种原因删除标题。

标签： javascript reactjs react-native fetch

【解决方案1】：

我找到了解决方案。第一个问题是邮递员生成了fetch() 方法，该方法使用URLSearchParams() 接口作为正文数据，当我将其更改为FormData() 时，它开始按我的意愿工作。第二个问题是，我不明白为什么，当我更改为 FormData() 时，标头给了我一个 error [TypeError: Network request failed]，当我将它们注释掉时，一切都很好了。

我没有尝试将 "Content-Type" 更改为其他内容并检查它是否有效，但我会的。

【讨论】：