react fetch 往后台传数组、list列表

wo.

发布于 2021-06-15 14:21:15

2.3K0

首先, 数据要在网络上传输, 就会涉及到数据序列化的问题, 因为双边数据在内存中的形式极有可能不一样, 这个时候需要约定一种双边都认可并且能实现的序列化方式, 使得数据能够被发送方序列化, 并且在网络中传输, 最终被接收方正确的反序列化. 为了适应不同的数据以及客户端环境, HTTP协议约定通过请求头中的Content-Type字段来确定数据序列化协议, 常用的有:

application/x-www-form-urlencoded

multipart/formdata

application/json

其中第一个和第二个是几乎所有浏览器和服务器都支持的协议, 第一个用来传输文本信息, 而二个用来传输文本信息或者二进制数据, 比如文件上传等. 在没有二进制数据时, 通常使用第一种方式, 因为其压缩比例相对较高. 而第三个就是我们熟悉的JSON序列化.

无论是第一种还是第二种协议, 其所能处理的数据都是只有一层的简单key-value形式. 并且第一种的值只能是字符串, 第二种除了是字符串之外还可以是二进制数据.

所以为了后台接收到数组、列表、布尔类型的值，必须用第三种方式

首先 index.js

const data = {'name':'张三','age':66,'isMan':true,'list':[22,33],}
fetch(url, {
    body: JSON.stringify(data), // must match 'Content-Type' header
    cache: 'no-cache', // *default, no-cache, reload, force-cache, only-if-cached
    credentials: 'same-origin', // include, same-origin, *omit
    headers: {
      'user-agent': 'Mozilla/4.0 MDN Example',
      'content-type': 'application/json'
    },
    method: 'POST', // *GET, POST, PUT, DELETE, etc.

这样在后台接受时,flask_run.py

jsondata = request.json
name = jsondata['name '] # str, '张三'
age = jsondata['age']  # int, 66岁
isMan = jsondata['isMan']  # boolean, True
list= jsondata['list']  # ['33', '22'], list

本文参与腾讯云自媒体同步曝光计划，分享自作者个人站点/博客。

原始发表：2020-02-14，如有侵权请联系 cloudcommunity@tencent.com 删除

文件存储

编程算法

react fetch 往后台传数组、list列表

react fetch 往后台传数组、list列表

所以为了后台接收到数组、列表、布尔类型的值，必须用第三种方式

社区

活动

圈层

关于

腾讯云开发者

热门产品

热门推荐

更多推荐