如何使用 jQuery / Axios 进行 PUT 请求？它总是 returns 错误 400

Question

首先，如何在 JavaScript 中执行 PUT 请求？（对于上下文，我正在开发一个 Vue 应用程序）同样的请求在邮递员或任何其他客户端中都可以完美地工作，我发现问题是 Api 期望正文是 "Content-Type": "application/x-www-form-urlencoded" 但通过 Javascript 发送它只是简单地发送它JSON 或不是 API.

可以理解的格式

我试过了：$.put("...") 但找不到 returns 函数。我尝试使用 type / _method = "put" 进行基本的 Ajax 调用，但它也不起作用，因为发送的内容不匹配。

API 期望什么？

person: {info: {name: "--", surname: "---"}}
location: {info: {city: "--", postalc: "---"}}
ref: 1234

如何发送？

JSON.stringify({
person: {info: {name: "--", surname: "---"}}
location: {info: {city: "--", postalc: "---"}}
ref: 1234
})

或

$.param(({
person: {info: {name: "--", surname: "---"}}
location: {info: {city: "--", postalc: "---"}}
ref: 1234
})

Axios 请求示例：

const res = axios.put(
              "http://" + api + "/sendClientInfo/",
              {
                $.param(({
                person: {info: {name: "--", surname: "---"}}
                location: {info: {city: "--", postalc: "---"}}
                ref: 1234
                }),
              },
              {
                headers: {
                  "Content-Type": "application/x-www-form-urlencoded",
                },
              }
            );

示例jQuery

$.ajax("http://" + api + "/sendClientInfo/", {
              type: "PUT",
              data: JSON.stringify(data),
              contentType: "application/json",
              success: function () {
                console.log("exit");
              },

Answer 1

What does the API expect?

person: {info: {name: "--", surname: "---"}}
location: {info: {city: "--", postalc: "---"}}
ref: 1234

对我来说，这看起来像 API 需要 3 个 application/x-www-form-urlencoded 参数，前两个参数保持 JSON 值。

要做到这一点，您需要这样的东西

const person = { info: { name: "--", surname: "---" } }
const location = { info: { name: "--", surname: "---" } }
const data = {
  person: JSON.stringify(person), // encode these values as JSON
  location: JSON.stringify(location),
  ref: 1234
}

const url = `http://${api}/sendClientInfo/`

// jQuery
$.ajax({
  url,
  method: "PUT",
  data
})

// Axios
axios.put(url, new URLSearchParams(data))

jQuery 的默认数据负载格式是 application/x-www-form-urlencoded。对象通过 $.param() method.

编码

如果出现 URLSearchParams 数据实例，Axios 也将使用 application/x-www-form-urlencoded。这与 $.param()

的作用相同

两个有效载荷都将被编码为

person=%7B%22info%22%3A%7B%22name%22%3A%22--%22%2C%22surname%22%3A%22---%22%7D%7D&location=%7B%22info%22%3A%7B%22city%22%3A%22--%22%2C%22postalc%22%3A%22---%22%7D%7D&ref=1234

如何使用 jQuery / Axios 进行 PUT 请求？它总是 returns 错误 400

How to do a PUT request with jQuery / Axios? It always returns error 400

javascript

jquery

ajax

axios

put