* feat: add QUERY HTTP method support Add support for the HTTP QUERY method as defined in draft-ietf-httpbis-safe-method-w-body. QUERY is a safe, idempotent method like GET but carries a request body, making it suitable for complex queries that cannot be expressed in a URL. Changes: - Add axios.query(url, data, config) and axios.queryForm() shorthands - Register 'query' in default headers initialization - Include 'query' in header cleanup during request dispatch - Add 'QUERY' to Method type in TypeScript definitions (d.ts and d.cts) - Add query/queryForm signatures to Axios class type definitions - Add 'query' to HeadersDefaults interface - Update unit and module typing tests Closes #5465 Signed-off-by: Pierluigi Lenoci <pierluigilenoci@gmail.com> * test: add thorough QUERY method tests Add comprehensive tests for the QUERY HTTP method covering: - Request method correctness (via mock adapter and real HTTP server) - Request body support (QUERY accepts a body like POST/PUT/PATCH) - Custom headers handling - baseURL configuration with instances - Content-Type auto-detection (application/json for objects) - Instance method and defaults merging - Generic request form axios({ method: 'query' }) - queryForm() multipart/form-data support - Integration tests against a real HTTP server verifying the QUERY method string arrives correctly on the wire Signed-off-by: Pierluigi Lenoci <pierluigilenoci@gmail.com> * chore: updated docs with all translations * chore: drop formquery method as this is probably not a real use case * chore: remove un-needed file --------- Signed-off-by: Pierluigi Lenoci <pierluigilenoci@gmail.com> Co-authored-by: Jay <jasonsaayman@gmail.com>
4.6 KiB
请求别名
axios 提供了一组发起 HTTP 请求的别名方法,这些别名是 request 方法的快捷方式,设计简洁、使用方便。
axios 尽量遵循 RFC 7231 和 RFC 5789 规范,别名方法与这些规范中定义的 HTTP 方法保持一致。
axios
axios 可以通过仅传入配置对象来发起 HTTP 请求,完整的配置对象文档见此处。
axios(url: string | AxiosRequestConfig, config?: AxiosRequestConfig);
方法别名
以下是可用的请求别名方法:
request
request 方法是发起 HTTP 请求的主方法,接受一个配置对象并返回解析为响应对象的 Promise,可用于发起任意类型的 HTTP 请求。
axios.request(config: AxiosRequestConfig<C>): AxiosResponse<R>;
get
get 方法用于发起 GET 请求,接受 URL 和可选配置对象,返回解析为响应对象的 Promise。
axios.get(url: string, config?: AxiosRequestConfig<C>): AxiosResponse<R>;
delete
delete 方法用于发起 DELETE 请求,接受 URL 和可选配置对象,返回解析为响应对象的 Promise。
axios.delete(url: string, config?: AxiosRequestConfig<C>): AxiosResponse<R>;
head
head 方法用于发起 HEAD 请求,接受 URL 和可选配置对象,返回解析为响应对象的 Promise。
axios.head(url: string, config?: AxiosRequestConfig<C>): AxiosResponse<R>;
options
options 方法用于发起 OPTIONS 请求,接受 URL 和可选配置对象,返回解析为响应对象的 Promise。
axios.options(url: string, config?: AxiosRequestConfig<C>): AxiosResponse<R>;
post
post 方法用于发起 POST 请求,接受 URL、可选数据对象和可选配置对象,返回解析为响应对象的 Promise。
axios.post(url: string, data?: D, config?: AxiosRequestConfig<C>): AxiosResponse<R>;
put
put 方法用于发起 PUT 请求,接受 URL、可选数据对象和可选配置对象,返回解析为响应对象的 Promise。
axios.put(url: string, data?: D, config?: AxiosRequestConfig<C>): AxiosResponse<R>;
patch
patch 方法用于发起 PATCH 请求,接受 URL、可选数据对象和可选配置对象,返回解析为响应对象的 Promise。
axios.patch(url: string, data?: D, config?: AxiosRequestConfig<C>): AxiosResponse<R>;
query
query 方法用于发起 QUERY 请求,这是一种安全且幂等的、可以携带请求体的方法。它接受 URL、可选数据对象和可选配置对象,返回解析为响应对象的 Promise。当读取类操作的参数过于复杂或敏感、不适合放在 URL 中时,可以使用该方法。
axios.query(url: string, data?: D, config?: AxiosRequestConfig<C>): AxiosResponse<R>;
// 将复杂的搜索条件作为请求体发送
const { data } = await axios.query("/api/search", {
selector: ["name", "email"],
filter: { active: true, role: "admin" },
});
::: warning 草案规范
QUERY 方法目前由 IETF 的 Internet-Draft 定义,尚未成为正式标准。其语义乃至方法名称都可能在最终发布前发生变化,并且服务器、代理和 CDN 的支持情况参差不齐。在用于生产环境之前,请确认你的整个链路都能够正确处理 QUERY 请求。
:::
表单数据快捷方法
这些方法与上述对应方法等价,但会预设 Content-Type 为 multipart/form-data,是上传文件或提交 HTML 表单的推荐方式。
postForm
axios.postForm(url: string, data?: D, config?: AxiosRequestConfig<C>): AxiosResponse<R>;
// 从浏览器文件输入框上传文件
await axios.postForm("/api/upload", {
file: document.querySelector("#fileInput").files[0],
description: "Profile photo",
});
putForm
axios.putForm(url: string, data?: D, config?: AxiosRequestConfig<C>): AxiosResponse<R>;
// 用表单数据替换资源
await axios.putForm("/api/users/1/avatar", {
avatar: document.querySelector("#avatarInput").files[0],
});
patchForm
axios.patchForm(url: string, data?: D, config?: AxiosRequestConfig<C>): AxiosResponse<R>;
// 使用表单数据更新特定字段
await axios.patchForm("/api/users/1", {
displayName: "New Name",
avatar: document.querySelector("#avatarInput").files[0],
});
::: tip
postForm、putForm 和 patchForm 接受与基础方法相同的所有数据类型——普通对象、FormData、FileList 以及 HTMLFormElement。更多示例请参阅文件上传。
:::