如何使用 Fetch 发送 x-www-form-urlencoded 请求？

使用 Fetch 发送 x-www-form-urlencoded 请求

在 Web 开发中，将表单编码的数据 POST 到服务器是一种常见的操作任务。要使用 Fetch API 完成此操作，需要执行几个步骤。

• 定义请求参数：

  • 开始定义您想要 POST 的表单参数。在提供的示例中：

    {
        'userName': '[email protected]',
        'password': 'Password!',
        'grant_type': 'password'
    }

• 构造请求对象：

  • 创建一个带有必要请求的 JavaScript 对象属性：

    var obj = {
      method: 'POST',
      headers: {
        'Content-Type': 'application/x-www-form-urlencoded; charset=UTF-8',
      },
    };

• 编码表单参数：

  • 包含表单编码参数，使用 URLSearchParams对象：

    body: new URLSearchParams({
        'userName': '[email protected]',
        'password': 'Password!',
        'grant_type': 'password'
    })

• 执行请求：

  • 最后，使用新建的对象：

    fetch('https://example.com/login', obj)
      .then(function(res) {
        // Do stuff with result
      }); 

• 简化示例：

  • 为了简单起见，更简洁的方法就是直接在 fetch() 中指定表单参数和 header选项：

    fetch('https://example.com/login', {
        method: 'POST',
        headers:{
          'Content-Type': 'application/x-www-form-urlencoded'
        },
        body: new URLSearchParams({
            'userName': '[email protected]',
            'password': 'Password!',
            'grant_type': 'password'
        })
    });

有关更多详细信息，请参阅 Mozilla 开发者网络文档：https://developer.mozilla.org/en-US/docs /Web/API/WindowOrWorkerGlobalScope/fetch

以上是如何使用 Fetch 发送 x-www-form-urlencoded 请求？的详细内容。更多信息请关注PHP中文网其他相关文章！