Http请求

在网络请求中,通常有两种主要的方式用于向服务器发送数据:通过 URL 查询参数(Query Parameters)和通过请求体(Request Body)。

  1. Query Parameters:

    • 查询参数是附加在 URL 后面的键值对,用于向服务器传递数据。
    • 查询参数通常用于 GET 请求,但也可以在其他类型的请求中使用。
    • 查询参数以 ? 开头,然后是键值对,键和值之间使用 = 分隔,不同的键值对之间使用 & 分隔。
    • 例如:https://example.com/api/users?id=123&name=John
  2. Request Body:

    • 请求体是 HTTP 请求的一部分,用于在 POST、PUT、PATCH 等请求中向服务器发送数据。

    • 请求体通常是以 JSON 格式或表单数据的形式发送。

    • 请求体可以包含更大、更复杂的数据,如 JSON 对象或者文件上传。

    • 请求体的格式通常由请求头中的 Content-Type 指定。

    • 例如 JSON 格式的请求体:

      复制代码
      {
        "id": 123,
        "name": "John"
      }

通常来说,如果数据较小且简单,使用查询参数可以更加方便和直观。而如果数据较大或者复杂,或者包含敏感信息,建议使用请求体。在实际开发中,根据具体的需求和后端 API 的要求来选择合适的方式传递参数。

接口文档中 请求参数是Query参数时:要传递的参数是在 URL 上,因此使用了 params 对象将 id 参数包裹起来。这样可以确保 id 参数被正确地拼接在 URL 的末尾,发送给后端进行处理。

javascript 复制代码
// 删除文章分类
export const artDelChannelService = (id) =>
  request.delete('/my/cate/del', {
    params: { id }
  })
//请求的url:https://big-event-vue-api-t.itheima.net/my/cate/del?id=1070

接口文档中 请求参数是body参数时:数据是通过请求体(Request Body)传递的,而不是通过 URL 参数。因此,数据 data 直接作为请求体发送给后端。

javascript 复制代码
export const artAddCate = ({ cate_name, cate_alias }) =>
  request.post('/my/cate/add', { cate_name, cate_alias })
相关推荐
用户5427784851540几秒前
Vue 3 中开发高阶组件(HOC)与 Renderless 组件
前端
幼儿园老大10 分钟前
告别代码屎山!UniApp + Vue3 自动化规范:ESLint 9+ 扁平化配置全指南
javascript·vue.js
HIT_Weston14 分钟前
67、【Ubuntu】【Hugo】搭建私人博客(一)
前端·ubuntu·hugo
阿里巴啦26 分钟前
用React+Three.js 做 3D Web版搭建三维交互场景:模型的可视化摆放与轻量交互
前端·react·three.js·模型可视化·web三维·web三维交互场景
Liu.77437 分钟前
vue3组件之间传输数据
前端·javascript·vue.js
|晴 天|37 分钟前
前端闭包:从概念到实战,解锁JavaScript高级技能
开发语言·前端·javascript
开发者小天38 分钟前
react的拖拽组件库dnd-kit
前端·react.js·前端框架
用户4445543654261 小时前
在Android开发中阅读源码的指导思路
前端
用户54277848515401 小时前
ESM 模块(ECMAScript Module)详解
前端
全栈前端老曹1 小时前
【ReactNative】核心组件与 JSX 语法
前端·javascript·react native·react.js·跨平台·jsx·移动端开发