当前位置: 首页 > news >正文

前端传递参数时,form-data 和 json 的区别

在传递参数时,form-dataJSON 是两种常见的数据格式。

  1. form-data 是一种多部分表单数据格式,通常用于上传文件或包含二进制数据的表单提交。它使用 multipart/form-data 格式来编码数据。在使用 form-data 格式时,数据会被分割成多个部分,每个部分都有自己的头部信息。

  2. JSON(JavaScript Object Notation)是一种轻量级的数据交换格式,常用于前后端数据传输。它使用键值对的形式来表示数据,并且支持嵌套结构。JSON 数据格式是纯文本的,易于阅读和编写,同时也易于解析和生成。

生成 form-data 格式的数据通常需要使用 FormData 对象来处理,示例代码如下:

const formData = new FormData();
formData.append('username', 'John');
formData.append('avatar', file); // 上传文件// 发送请求
axios.post('/api/endpoint', formData, {headers: {'Content-Type': 'multipart/form-data'}
});

生成 JSON 格式的数据可以通过创建一个包含键值对的 JavaScript 对象,并使用 JSON.stringify 方法将其转换为字符串,示例代码如下:

const data = {username: 'John',age: 25
};// 发送请求
axios.post('/api/endpoint', JSON.stringify(data), {headers: {'Content-Type': 'application/json'}
});

在示例中,axios 是一个常用的 HTTP 请求库,用于发送请求。headers 部分用于设置请求头,确保服务器能够正确解析请求数据的格式。

需要根据具体的需求和后端接口的要求选择使用 form-data 还是 JSON 格式的数据传递。

相关文章:

前端传递参数时,form-data 和 json 的区别

在传递参数时,form-data 和 JSON 是两种常见的数据格式。 form-data 是一种多部分表单数据格式,通常用于上传文件或包含二进制数据的表单提交。它使用 multipart/form-data 格式来编码数据。在使用 form-data 格式时,数据会被分割成多个部分&…...

FairyGUI-Unity侧菜单扩展

目录 缘由: 分析: 准备: 完整代码: 缘由: 在使用FairyGUI作为项目UI开发时,有时会使用FairyGUI提供的Scripting Define Symbols。当前FairyGUI中的Scripting Define Symbols有: 骨骼动画 …...

学习笔记十八:污点、容忍度

污点、容忍度 污点、容忍度管理节点污点把k8snode2当成是生产环境专用的,其他node是测试的给k8snode1也打上污点 污点、容忍度 给了节点选则的主动权,我们给节点打一个污点,不容忍的pod就运行不上来,污点就是定义在节点上的键值属…...

amis百度前端框架,在js中使用amis写json转页面

amis百度前端框架,在js中使用用amis写的json页面 1.在项目中使用百度 amis 的sdk做开发库。 <script src="./sdk/sdk/sdk.js"></script> 2。加载sdk中的库: amis = amisRequire(amis/embed);amisLib = amisRequire(amis);const match = amisRequire…...

openEuler安装jdk、openEuler离线安装jdk、openEuler设置jdk、openEuler在线安装

记录一下本人使用openEuler安装jdk的过程,希望能帮到看到帖子的你! 方式一:在线安装: 在 openEuler 上安装 JDK(Java Development Kit)的步骤如下: 更新系统: 在安装 JDK 之前,建议先更新系统软件包。打开终端并执行以下命令: sudo dnf update 这将更新系统中的软…...

Photoshop制作漂亮光泽感3D按钮

原文链接(https://img-blog.csdnimg.cn/45472c07f29944458570b59fe1f9a0e0.png)...

【网络爬虫】模拟登录与代理

代理...

无线局域网基础知识与架构

1.1 无线局域网 无线局域网(Wireless Local Area Network&#xff0c;WLAN)是指以无线信道作为传输 媒介的计算机局域网络&#xff0c;是计算机网络与无线通信技术相结合的产物&#xff0c;它以无线多 址信道作为传输媒介&#xff0c;提供传统有线局域网的功能&#xff0c;能…...

uniapp tabbar 浏览器调试显示 真机不显示

解决方案&#xff0c;把tabBar里面的单位全改为px&#xff0c;rpx是不会显示的&#xff01; 注意了&#xff0c;改完一定要重新运行&#xff0c;不然无效&#xff0c;坑爹 "tabBar": {"borderStyle": "black","selectedColor": &quo…...

极智AI | 地平线BPU跑通YOLOv5

欢迎关注我的公众号 [极智视界],获取我的更多经验分享 大家好,我是极智视界,本文来介绍一下 地平线BPU跑通YOLOv5。 邀您加入我的知识星球「极智视界」,星球内有超多好玩的项目实战源码下载,链接:https://t.zsxq.com/0aiNxERDq 硬件设备为地平线旭日x3,开发环境和执行环…...

循环服务器(同时连接多个客户端,为每个客户端创建一个子进程处理其消息)

服务器 客户端 结果...

【从零学习python 】38.Python包的使用及导入方式

文章目录 包的使用1. 导入包的方式总结2. __init__.py文件有什么用3. __all__ 注意事项进阶案例 包的使用 一个模块就是一个 py 文件&#xff0c;在 Python 里为了对模块分类管理&#xff0c;就需要划分不同的文件夹。多个有联系的模块可以将其放到同一个文件夹下&#xff0c;为…...

docker 容器满了常用处理方法

docker 容器满了常用处理方法 1、运行 df -h 查看剩余磁盘占用情况 2、进入到docker目录 cd /var/lib/docker 3、运行du -h --max-depth1 &#xff08;检索文件的最大深度1&#xff0c;即只检索汇总计算当前目录下的文件&#xff09; 4、进入占用最大的 /containers文件夹&am…...

28、springboot的静态模版(前端页面)重加载和 devtools开发者工具

springboot的静态模版重加载和 devtools开发者工具 总结&#xff1a;实现静态模板重加载的两个方法 方法1&#xff1a;在 yml 配置文件&#xff0c;关闭页面模板缓存&#xff0c; 再按 ctrlf9 重新构建 方法2&#xff1a;直接添加 devtools 依赖&#xff0c;再按 ctrlf9 重新构…...

[FPGA IP系列] FPGA常用存储资源大全(RAM、ROM、CAM、SRAM、DRAM、FLASH)

本文主要介绍FPGA中常用的RAM、ROM、CAM、SRAM、DRAM、FLASH等资源。 一、RAM RAM(Random Access Memory)是FPGA中最基本和常用的内部存储块&#xff0c;根据不同架构可以实现不同容量&#xff0c;最大可达几十Mb。 FPGA中的RAM主要包括: 分布式RAM&#xff1a;存在于逻辑块…...

Spark SQL优化:NOT IN子查询优化解决

背景 有如下的数据查询场景。 SELECT a,b,c,d,e,f FROM xxx.BBBB WHERE dt ${zdt.addDay(0).format(yyyy-MM-dd)} AND predict_type not IN ( SELECT distinct a FROM xxx.AAAAAWHERE dt ${zdt.addDay(0).format(yyyy-MM-dd)} ) 分析 通过查看SQL语句的执行计划基本…...

代码审计-java项目-组件漏洞审计

代码审计必备知识点&#xff1a; 1、代码审计开始前准备&#xff1a; 环境搭建使用&#xff0c;工具插件安装使用&#xff0c;掌握各种漏洞原理及利用,代码开发类知识点。 2、代码审计前信息收集&#xff1a; 审计目标的程序名&#xff0c;版本&#xff0c;当前环境(系统,中间件…...

接口测试的测试用例该怎么写呢

接口测试是软件测试中非常重要的一部分&#xff0c;因为接口的稳定性和可靠性对于整个系统的质量和用户体验都有很大的影响。在接口测试中&#xff0c;编写有效的测试用例是非常关键的一步。本文将介绍如何编写接口测试的测试用例&#xff0c;包括测试用例的设计和编写方法&…...

C语言例题讲解(if语句,循环语句,函数)

目录 if语句例题题目分析代码题目总结 循环语句例题题目分析代码题目总结 函数例题题目分析代码题目总结 if语句例题 计算1/1-1/21/3-1/41/5 …… 1/99 - 1/100 的值&#xff0c;打印出结果题目分析 1&#xff1a;首先我们不难看出算式中的加号和减号是交替出现的&#xff0…...

深入探索JavaEE单体架构、微服务架构与云原生架构

课程链接&#xff1a; 链接: https://pan.baidu.com/s/1xSI1ofwYXfqOchfwszCZnA?pwd4s99 提取码: 4s99 复制这段内容后打开百度网盘手机App&#xff0c;操作更方便哦 --来自百度网盘超级会员v4的分享 课程介绍&#xff1a; &#x1f50d;【00】模块零&#xff1a;开营直播&a…...

【根据当天日期输出明天的日期(需对闰年做判定)。】2022-5-15

缘由根据当天日期输出明天的日期(需对闰年做判定)。日期类型结构体如下&#xff1a; struct data{ int year; int month; int day;};-编程语言-CSDN问答 struct mdata{ int year; int month; int day; }mdata; int 天数(int year, int month) {switch (month){case 1: case 3:…...

【HarmonyOS 5.0】DevEco Testing:鸿蒙应用质量保障的终极武器

——全方位测试解决方案与代码实战 一、工具定位与核心能力 DevEco Testing是HarmonyOS官方推出的​​一体化测试平台​​&#xff0c;覆盖应用全生命周期测试需求&#xff0c;主要提供五大核心能力&#xff1a; ​​测试类型​​​​检测目标​​​​关键指标​​功能体验基…...

数据链路层的主要功能是什么

数据链路层&#xff08;OSI模型第2层&#xff09;的核心功能是在相邻网络节点&#xff08;如交换机、主机&#xff09;间提供可靠的数据帧传输服务&#xff0c;主要职责包括&#xff1a; &#x1f511; 核心功能详解&#xff1a; 帧封装与解封装 封装&#xff1a; 将网络层下发…...

Cloudflare 从 Nginx 到 Pingora:性能、效率与安全的全面升级

在互联网的快速发展中&#xff0c;高性能、高效率和高安全性的网络服务成为了各大互联网基础设施提供商的核心追求。Cloudflare 作为全球领先的互联网安全和基础设施公司&#xff0c;近期做出了一个重大技术决策&#xff1a;弃用长期使用的 Nginx&#xff0c;转而采用其内部开发…...

论文解读:交大港大上海AI Lab开源论文 | 宇树机器人多姿态起立控制强化学习框架(一)

宇树机器人多姿态起立控制强化学习框架论文解析 论文解读&#xff1a;交大&港大&上海AI Lab开源论文 | 宇树机器人多姿态起立控制强化学习框架&#xff08;一&#xff09; 论文解读&#xff1a;交大&港大&上海AI Lab开源论文 | 宇树机器人多姿态起立控制强化…...

关于 WASM:1. WASM 基础原理

一、WASM 简介 1.1 WebAssembly 是什么&#xff1f; WebAssembly&#xff08;WASM&#xff09; 是一种能在现代浏览器中高效运行的二进制指令格式&#xff0c;它不是传统的编程语言&#xff0c;而是一种 低级字节码格式&#xff0c;可由高级语言&#xff08;如 C、C、Rust&am…...

Spring AI与Spring Modulith核心技术解析

Spring AI核心架构解析 Spring AI&#xff08;https://spring.io/projects/spring-ai&#xff09;作为Spring生态中的AI集成框架&#xff0c;其核心设计理念是通过模块化架构降低AI应用的开发复杂度。与Python生态中的LangChain/LlamaIndex等工具类似&#xff0c;但特别为多语…...

Mobile ALOHA全身模仿学习

一、题目 Mobile ALOHA&#xff1a;通过低成本全身远程操作学习双手移动操作 传统模仿学习&#xff08;Imitation Learning&#xff09;缺点&#xff1a;聚焦与桌面操作&#xff0c;缺乏通用任务所需的移动性和灵活性 本论文优点&#xff1a;&#xff08;1&#xff09;在ALOHA…...

Angular微前端架构:Module Federation + ngx-build-plus (Webpack)

以下是一个完整的 Angular 微前端示例&#xff0c;其中使用的是 Module Federation 和 npx-build-plus 实现了主应用&#xff08;Shell&#xff09;与子应用&#xff08;Remote&#xff09;的集成。 &#x1f6e0;️ 项目结构 angular-mf/ ├── shell-app/ # 主应用&…...

GitFlow 工作模式(详解)

今天再学项目的过程中遇到使用gitflow模式管理代码&#xff0c;因此进行学习并且发布关于gitflow的一些思考 Git与GitFlow模式 我们在写代码的时候通常会进行网上保存&#xff0c;无论是github还是gittee&#xff0c;都是一种基于git去保存代码的形式&#xff0c;这样保存代码…...