如何使用 antd upload React 发送 multipart/form-data

2024-04-25

我正在使用 React 和 antd。
我使用的 antd 组件是拖放 https://ant.design/components/upload.
我正在尝试使用 FormData 对象发送多部分/表单数据。
它发送文件(应作为 blob 发送的 .zip 文件),但不会将其作为 blob 或与其他键和值相关的任何内容发送。
这是一个Sandbox https://codesandbox.io/s/j3q07kyy8w.

预期请求负载:

------WebKitFormBoundaryysdTGvf0cRZVGpQ4
Content-Disposition: form-data; name="file"; filename="aFileName.zip"
Content-Type: application/octet-stream

[0,1,2]
------WebKitFormBoundaryysdTGvf0cRZVGpQ4
Content-Disposition: form-data; name="x2"

y2
------WebKitFormBoundaryysdTGvf0cRZVGpQ4
Content-Disposition: form-data; name="x3"

true
------WebKitFormBoundaryysdTGvf0cRZVGpQ4
Content-Disposition: form-data; name="x4"

2
------WebKitFormBoundaryysdTGvf0cRZVGpQ4

实际请求负载:

------WebKitFormBoundaryysdTGvf0cRZVGpQ4
Content-Disposition: form-data; name="file"; filename="aFileName.zip"
Content-Type: application/zip


------WebKitFormBoundaryysdTGvf0cRZVGpQ4

我已经使用customRequest来解决这个问题。
您可以在这里找到一个示例:使用 antd upload 发送 multipart/form-data #11616 https://github.com/ant-design/ant-design/issues/11616

本文内容由网友自发贡献,版权归原作者所有,本站不承担相应法律责任。如您发现有涉嫌抄袭侵权的内容,请联系:hwhale#tublm.com(使用前将#替换为@)

如何使用 antd upload React 发送 multipart/form-data 的相关文章

  • 如何在 React 中实现拖放行为

    我正在尝试使用 React 和实现拖放行为反应美丽 dnd https github com atlassian react beautiful dnd图书馆 我想使用选择一些图像反应 dropzone https react dropzo
  • redux 减速器类型“从不”

    我想使用 useSelector 来选择 rootStore 的正确状态 但无法正确获取状态 原因是主题缩减器根状态给我类型never export type RootState ReturnType
  • 如何禁用 mui 文本字段自动完成?

    我正在使用最新版本的 mui 我有一个包含邮政编码字段的用户联系信息表单 如果值为空 我不希望此字段自动完成 但它会随着浏览器中保存的电子邮件自动完成 这是我到目前为止所尝试过的 自动完成 关闭 自动完成 关闭 自动完成 不 这是我的文本字
  • 使用异步数据初始化组件

    我想弄清楚如何以及在哪里在react redux thunk中为我的选择框加载数据 即在我的操作上调用调度 我不确定它是否应该放入我的应用程序容器的构造函数中 或者我应该将其加载到我的组件中 在我的示例中 MyDropdown 我的主要应用
  • 在 Storybook 中隐藏每个故事的插件

    我正在使用 Storybook 和 React 构建一个组件库 使用 CSF 方法包含故事 我有多个插件 并在显示单个故事时使用它们 我还在一个视图中一起显示所有故事 作为参考 我想禁用特定插件的就是这个故事 在这种情况下 我想禁用旋钮 当
  • 如何在 React 中使用原生 Node.js 插件

    我有一个反应项目 我想在其中使用this https github com svenpaulsen node ts3sdk client原生 Node js 插件 它是 C SDK 的包装器 我过去曾在 Electron 项目中成功使用过此
  • 根据 ID 更新 React.js 中的特定组件实例

    在react js应用程序中 我想知道为每个组件提供一个ID的最佳实践是什么 该ID可用于根据需要仅更新该组件的信息 例如 如果我们有一个显示销售信息的组件 并且我们创建并显示其中 20 个组件 因为我们有 20 个产品 那么我们会每隔一段
  • 我们如何调用react-navigation中的特定类型的action?

    如何使用 NavigationAction 调用操作 如果用户没有令牌 则会返回初始页面 我想重置 初始化 MainTabNavigator componentWillReceiveProps nextProps if nextProps
  • 获取:使用获取响应设置变量并从函数返回[重复]

    这个问题在这里已经有答案了 我对 JavaScript 和 React 还很陌生 我有一个来自组件的回调 该组件从给定 id 的服务器获取 customer name 提取工作正常 console log 正确打印全名 但最后一个 then
  • 如何等待在react.js中渲染视图直到$.get()完成?

    您好 我正在用 Reactjs 编写一个聊天客户端 并希望使用从 REST 调用检索到的数据来渲染我的组件 但是 我的组件是在 REST 请求返回数据之前渲染的 当我在我的子组件中调用 this props 时 这会导致错误 var Mai
  • 使用 React 组件内的 标签进行锚定导航

    我正在尝试在我的反应应用程序内的页面组件之一中设置锚点导航 我正在尝试模仿所看到的相同功能在 Draft js 上 https draftjs org docs getting started installation它使用子标题作为锚点
  • 在react-query中使用(isLoading或isFetching)的原因

    我是一个使用react的用户 我在使用react query时没有很好地使用isloading函数 在ui方面 我认为正在加载用于向用户显示加载屏幕 我认为我不必显示加载 因为数据获取速度很快 但突然 我想到了这个想法 如果你把 props
  • 未捕获的类型错误:提供您的根 Epic 来 createEpicMiddleware(rootEpic)

    我收到这个错误 未捕获的类型错误 将您的根 Epic 提供给createEpicMiddleware rootEpic 不再支持 而是使用epicMiddleware run rootEpic 简单使用时 import rxjs impor
  • Chart.JS 工具提示回调标签和标题 (v3.5)

    请注意 v2 有很多答案 这是 v3 的 我正在尝试设置工具提示label and title对于圆环图 Code Create the donut chart donut new Chart questions positivity do
  • 提交后清除 React 中的表单

    我试图在使用 Axios 创建表单提交后清除表单数据 消息处理良好 响应记录到页面 但每个文本字段中的数据在提交后仍保留在页面上 我尝试添加一个resetForm函数 我将表单设置回原来的空白状态 但这不起作用 import React C
  • 无法从静态文件夹加载图像

    如何在 Next js 的组件中加载图像 我必须先构建项目吗 如果是 有没有办法在不先构建的情况下加载图像 无论我如何尝试 我都无法让它发挥作用 来自文档 https nextjs org docs basic features stati
  • 如何在redux中设置初始状态

    我试图弄清楚如何在 redux 中设置商店的初始状态 我在用着https github com reactjs redux blob master examples todos with undo reducers index js htt
  • 在ReactJS中,如果我们不为useEffect提供依赖数组,是否会导致该函数每次都被调用?

    我看到在ReactJS 文档 https reactjs org docs hooks overview html的依赖数组useEffect fn 是可选的 不提供它应该与提供空数组相同 但是 如果我的代码如下 https codesan
  • userRef 或 createRef 在功能组件中返回未定义

    我在这里阅读了很多答案 但它们都是类组件的潮流 如果我有使用 useRef 或 createRef 的简单功能组件 则 ref current 未定义 我将它分配在 div 或 input 之上 但我无法获取它们的任何属性 Console
  • 在 package.json 中声明时 Reactify 转换未运行

    我正在尝试将reactify 转换与browserify 和gulp 结合使用 这个 gulp 任务有效 return browserify paths node modules app scripts entries app script

随机推荐

  • android 中软键盘上方需要上一个、下一个按钮

    我想在键盘上方显示带有 上一个 下一个 按钮的虚拟键盘 当用户单击 上一个 按钮时 光标应移动到上一个编辑文本输入字段 单击 下一个 按钮应转到视图中的下一个编辑文本字段 如果我们在Android浏览器中打开任何要求输入的页面 我们就可以看
  • 将静态对象添加到资源字典中

    我有一个在多个视图中引用的类 但我希望它们之间只共享该类的一个实例 我已经像这样实现了我的课程 using System public class Singleton private static Singleton instance pr
  • GoDaddy Linux 上的 PHP 共享尝试通过 GMAIL SMTP 发送

    我已经尝试过 StackOverflow 和其他网站上发布的每一个脚本 代码 方法 但没有运气 我在 GoDaddy 上托管 我已经设置了一个 Google App 帐户 设置了 MX 记录所需的一切 使用 GoDaddy 工具 甚至尝试从
  • 在没有未定义行为的情况下,哪些 float 值无法转换为 int [c++]?

    我刚刚从 C 14 标准中读到了这个 我的重点 4 9 浮点积分转换 conv fpint 1浮点类型的纯右值可以转换为整数类型的纯右值 转换截断 也就是说 小数部分被丢弃 如果无法截断值 则行为未定义 以目标类型表示 这让我思考 其中 如
  • jQueryUI 可拖动 + 可排序错误(无法读取未定义的属性“选项”)

    我的问题似乎类似于这个问题 从可排序列表拖动到拖放插件 https stackoverflow com questions 17928139 dragging from a sortable list to a drag and drop
  • 如何从 ispell 私人词典中删除条目?

    我想知道如何从 ispell 私人词典中删除一个 错误插入的 条目 单词 EDIT 经过更多挖掘后 我仍然无法从默认字典中删除条目 但我认为解决方案可能是构建哈希程序 问题是生成要删除的条目列表 我找不到简单的示例 您应该能够编辑您的个人词
  • 使用 Shell 脚本自动安装 R-Studio

    有没有办法在 Linux 系统上自动安装 R Studio 它应该自动检测操作系统并安装具有所需依赖项的 R 和 R Studio 谢谢 我准备了以下 shell 脚本来使安装完全自动化 bin bash Program R Studio
  • 使用 Retrofit 通过 GSON 获取嵌套 JSON 对象

    我正在使用 Android 应用程序中的 API 所有 JSON 响应如下所示 status OK reason Everything was fine content lt some data here gt 问题是我所有的 POJO 都
  • 在 JavaScript 中动态创建 SVG 链接

    我正在从 JavaScript 动态创建 SVG 元素 它对于像矩形这样的视觉对象工作得很好 但是我在生成功能性的 xlinks 时遇到了麻烦 在下面的示例中 第一个矩形 静态定义 在单击时可以正常工作 但其他两个 用 JavaScript
  • Oracle SQL Regexp_replace 匹配

    这是我需要完成的一个时髦的匹配 A5 1 9 11 2 需要成为 A05 01 09 11 02 DOT 部分的数量从没有到很多不等 字母 A 将始终存在并且始终为 1 个字符 我想使用 regexp replace 函数 以便将其用作排序
  • 检查节点js中特定时区的午夜

    比方说 我有用户的时区 时区 America New York 我想根据用户的时区在午夜执行一些任务 如何检查该时区是否已到达午夜 特定时区的最后午夜 new Date new Date toLocaleDateString en US t
  • 结束两个对等方之间的 WebRTC 视频通话

    我已经使用以下命令在两个同伴之间建立了视频聊天WebRTC 我想让一个对等方结束聊天 并让另一个对等方知道聊天已结束 聊天结束后 需要为双方执行一些代码 这PeerConnection对象有一个removeStream 应该触发的方法onr
  • 颤振中的全宽浮动操作按钮? [关闭]

    Closed 此问题正在寻求书籍 工具 软件库等的推荐 不满足堆栈溢出指南 help closed questions 目前不接受答案 如何在不使用颤动屏幕底部填充的情况下实现全宽浮动操作按钮 您可以使用不同的方法 您可以使用堆栈实现相同的
  • C# 计算并验证 SEPA (XML) 付款文件的 SHA256 值

    我正在与马库斯 德雷尔 Markus Dreyer 一样面临同样的问题 C 计算 SEPA XML 付款文件的 SHA256 值 https stackoverflow com questions 18254277 c sharp calc
  • SSMS:在脚本中选择字符串时突出显示相同的文字

    在 Visual Studio 中 当我选择任何文字时 它会突出显示同一文字的所有出现位置 SQL Server Management Studio中有类似的功能吗 假设我的脚本中有 My Temp Table 当选择文字 My Temp
  • 云集成:创建项目时出错。请重试

    我创建了一个新的 GAE 应用程序 但 设置 页面上的 云集成 部分告诉我 创建项目时发生错误 请重试 我在几个小时内多次按下 重试 按钮 但它不起作用 我发现 它反复说问题已解决 但对我来说还没有解决 有人来自 Google 监控这个论坛
  • 使用 grunt 从 browserify 生成源映射

    我已按照此处的说明进行操作 https www npmjs org package grunt browserify https www npmjs org package grunt browserify 尝试在 grunt 上为 bro
  • Aurelia Post 使用 http-fetch-client 生成选项请求

    我正在创建一个小型论坛 我们公司的人员可以使用 aurelia 为他们想要即时销售的商品或服务发布广告 我有一个广告页面列表 工作正常 每个广告的详细信息页面都工作正常 都使用来自 api 的 get 请求 然而 当有人想在广告上添加评论时
  • 删除列表中不包含另一个列表中出现的子字符串的项目的优雅方法

    最近我遇到了这个问题 假设有一个我要处理的内容列表 process list test fruit apple test fruit pineapple test fruit banana test tech apple pen test
  • 如何使用 antd upload React 发送 multipart/form-data

    我正在使用 React 和 antd 我使用的 antd 组件是拖放 https ant design components upload 我正在尝试使用 FormData 对象发送多部分 表单数据 它发送文件 应作为 blob 发送的 z