首页 > 其他分享 >JS | fetch发送post请求

JS | fetch发送post请求

时间:2024-07-10 17:31:34浏览次数:11  
标签:00 请求 fetch 发送 JSON POST JS post

在使用 fetch API 发送 POST 请求时,通常需要指定请求的方法为 "POST",并且通过 body 参数传递要发送的数据。

示例代码

下面是一个简单的示例,演示如何使用 fetch API 发送 POST 请求:

const url = '/api/endpoint'; // 替换为你的后端接口 URL
const requestData = {
    mmsi: 209838000,
    startTime: '2024-07-10 12:00:00',
    endTime: '2024-07-10 18:00:00'
};

fetch(url, {
    method: 'POST',
    headers: {
        'Content-Type': 'application/json' // 根据实际情况设置请求头
    },
    body: JSON.stringify(requestData) // 将数据转换为 JSON 字符串
})
.then(response => response.json())
.then(data => {
    console.log('Response:', data); // 输出响应数据
})
.catch(error => {
    console.error('Error:', error); // 捕获和处理异常
});

解释

  1. URL 设置:将 url 变量设置为你要发送 POST 请求的后端接口 URL。

  2. 请求方法和选项

    • method: 'POST' 表示使用 POST 方法发送请求。
    • headers 设置了请求头,通常根据后端要求设置合适的 Content-Type,如 application/json
    • body 包含了要发送的数据,这里使用 JSON.stringify()requestData 对象转换为 JSON 字符串。
  3. 处理响应

    • 使用 then() 方法处理成功的响应,response.json() 将响应数据解析为 JSON 格式。
    • 使用 catch() 方法捕获和处理请求过程中的错误。

这样,就可以使用 fetch API 在浏览器中发送 POST 请求,并处理后端返回的数据。

标签:00,请求,fetch,发送,JSON,POST,JS,post
From: https://www.cnblogs.com/echohye/p/18294646

相关文章

  • 精通Postman响应解析:正则表达式的实战应用
    ......
  • 利用 ECharts 地图:实现纹理和图像的效果(上海json)
    注:shanghaiGeoJSON换为你需要的区域json<template><divref="mapContainer"style="width:100%;height:500px"></div></template>import*asechartsfrom'echarts';importshanghaiGeoJSONfrom'@/assets......
  • js高级之-new map()
    newmap() JavaScript中的对象,实质就是键值对的集合,但是在对象里却只能用字符串作为键名。在一些特殊的场景里就满足不了我们的需求了,正因为此,Map 任何值(对象或者原始值)都可以作为一个键名或一个值letm=newMap();m.set([1,2],'张三')//输出为{[1,2]:张三}......
  • 大数据来袭:在Postman中巧妙处理大型响应数据的秘籍
    ......
  • 【面试数据岗必知必会——sql中的行转列、列转行与json函数】
    面试数据岗必知必会——SQL中的行转列、列转行与JSON函数导言:在数据科学和数据分析领域,SQL(StructuredQueryLanguage)是处理和管理关系型数据库的标准语言。掌握SQL的高级技巧,如行转列(Pivot)、列转行(Unpivot)以及JSON函数,能显著提升你在面试中的竞争力,并在实际工作中更加......
  • 【JS】 简单回忆一下 Set 和 Map
    ES6引入了两种新的数据结构:Set和Map。它们提供了一种存储键值对的方式,但与传统的对象(Object)和数组(Array)有所不同。SetSet是一种特殊的类型,它类似于数组,但成员的值都是唯一的,没有重复的值。使用Set创建Setletset=newSet();添加元素使用add()方法添加元素......
  • 为什么我的 Nodejs 的http 服务接收到的IP地址前面会有::ffff:?
    HelloWorld今天介绍一个比较绕口的技术。故事的首先要从测试同学提的一个BUG开始为什么一个ipv4地址前面会有::ffff:呢?是不是你的程序写错了呢。那我们来深究一下这个是什么东西。这种地址叫ipv4mappedipv6。为什么会有这么奇怪的东西呢,与ipv6部署有关。我们知道,ip......
  • 如何在Java中处理JSON数据
    如何在Java中处理JSON数据大家好,我是微赚淘客系统3.0的小编,是个冬天不穿秋裤,天冷也要风度的程序猿!在现代Web开发中,JSON(JavaScriptObjectNotation)已经成为数据交换的标准格式之一。Java提供了多种库来处理JSON数据,最常用的包括Gson、Jackson和org.json等。在本文中,我们将详细介......
  • 计算机毕业设计项目:18655 课程题库管理系统(开题答辩+程序定制+全套文案 )上万套实战教
    摘 要随着科学技术的飞速发展,各行各业都在努力与现代先进技术接轨,通过科技手段提高自身的优势;对于课程题库管理系统当然也不能排除在外,随着网络技术的不断成熟,带动了课程题库管理系统,它彻底改变了过去传统的管理方式,不仅使服务管理难度变低了,还提升了管理的灵活性。这种个......
  • 计算机毕业设计项目: node.js 网上购物商城的设计与实现99525(开题答辩+程序定制+全套文
    摘 要随着社会的发展,计算机的优势和普及使得网上购物商城的开发成为必需。网上购物商城主要是借助计算机,通过对首页、站点管理(轮播图、公告栏)用户管理(管理员、注册用户)内容管理(商城资讯、资讯分类)商城管理(商城中心、分类列表、订单列表)等信息进行管理。减少管理员的工作......