短故事网站模板,网站建设宣传 mp4,宇宙企画网站,品牌网球拍有哪些Content-Type详解、Postman中binary格式、json格式数据转原始二进制流等 背景#xff1a;postman中如何使用binary格式上传文件 Content-TypeContent-Type的格式由三部分组成#xff1a;以下是一些常见的Content-Type示例#xff1a; Postman中 binary格式定义#xff1a;用… Content-Type详解、Postman中binary格式、json格式数据转原始二进制流等 背景postman中如何使用binary格式上传文件 Content-TypeContent-Type的格式由三部分组成以下是一些常见的Content-Type示例 Postman中 binary格式定义用途特点 JSON数据转换为二进制数据 背景
前端拿到数据大对象后post请求传给后端。
postman中如何使用binary格式上传文件
打开Postman启动Postman应用程序。 创建请求在Postman中新建一个POST请求并输入目标API的URL。 选择Body标签在请求窗口中点击“Body”标签页。 选择binary格式在Body标签页中从下拉菜单中选择“binary”作为请求体的格式。 上传文件点击“Select Files”按钮从本地文件系统中选择要上传的二进制文件。或者如果文件已经在Postman的文件管理器中可以直接选择它。 发送请求配置完成后点击“Send”按钮发送请求。Postman会将选定的二进制文件作为请求体发送到服务器。
Content-Type
Content-Type的格式由三部分组成
主类型type、子类型subtype和可选参数parameter。
主类型type 任意字符串表示媒体的大类如text、image、application等。其中如果是“*”号则代表所有类型。 text用于标准化地表示的文本信息文本消息可以是多种字符集或者多种格式。 Multipart用于连接消息体的多个部分构成一个消息这些部分可以是不同类型的数据流的形式常用于上传大型文件。 Application用于传输应用程序数据或者二进制数据日常前后端传输数据常用。 Message用于包装一个E-mail消息。 Image用于传输静态图片数据。 Video用于传输动态影像数据可以是与音频编辑在一起的视频数据格式。
子类型subtype 任意字符串表示媒体的具体类型如html、jpeg、json等用“/”与主类型隔开。其中如果是“*”号则代表所有类型。常见的subtype有text/html、application/x-www-form-urlencoded、application/json、multipart/form-data、application/xml、text/plain、text/css、text/javascript等。
可选参数parameter 指定额外的信息如字符集编码charset、boundary等。 charset指定字符编码的标准常见的有ISO-8859-1、UTF-8、GB2312、ASCII等。 boundary多用于上传文件时使用用于分割数据。当content-type为multipart/form-data类型时需要用boundary指定分隔符。
以下是一些常见的Content-Type示例 HTML文档标记text/html 普通ASCII文档标记text/plain JPEG图片标记image/jpeg GIF图片标记image/gif JavaScript文档标记application/javascript XML文件标记application/xml PDF文档application/pdf 任意二进制数据通常用于文件下载application/octet-stream JSON格式的数据application/json 在表单中进行文件上传或发送包含文件以及非 ASCII 字符的表单数据 axios默认的Content-Type适用于发送JSON格式的数据。在发送JSON数据时可以直接将 JavaScript对象传递给axiosaxios会自动将其序列化为JSON字符串。 一种越来越流行的数据交换格式用于传输结构化数据。与 application/x-www-form-urlencoded 相比它支持更复杂的数据结构并且更适合与 RESTful API 交互。 URL编码的表单数据application/x-www-form-urlencoded 特点键值对形式的数据结构清晰明大部分服务器和编程语言都支持该编码方式不适合 传输大量数据及复杂数据结构。 使用当需要以键值对的形式发送数据登录、注册的简单表单数据一些传统的 Web 服务时可使用。 可以通过使用qs库将js对象序列化为 URL 查询字符串。 import qs from qs;
var data {a:1,b:2}
axios.post(url, qs.stringify(data, { indices: true }));
配置选项 indices 的作用是当对象包含数组时是否在键中包含数组索引。输出 a1b2c[0]zc[1]y 这样可以将对象序列化为keyvaluekeyvalue的形式1 2。 用于上传文件或包含文件的表单数据multipart/form-data 用途是一种MIME 类型。主要用于 POST 请求中将表单数据和文件打包发送给服务器。它是 HTML 表单中文件上传的默认编码类型当表单的 enctype 属性设置为 multipart/form-data 时浏览器会以该编码方式提交表单 在与 RESTful API 交互时如果 API 需要接收文件或多种类型的表单数据通常也会使用 multipart/form-data 编码方式。 示例 form action/upload methodPOST enctypemultipart/form-datainput typetext nameusernameinput typefile namefilebutton typesubmit上传/button
/form通过 Axios 发送一个包含文件和其他字段的 POST 请求// 创建一个FormData实例
const formData new FormData();
// 向FormData中添加数据
// 假设我们有一个文件输入元素其files属性包含用户所选文件
// const fileInput document.querySelector(input[typefile]);
// formData.append(file, fileInput.files[0]); // 从文件输入中获取文件并添加到formData中// 为了演示目的我们创建了一个Blob对象来模拟文件上传。
const fakeFile new Blob([Hello, world!], { type: text/plain });
formData.append(file, fakeFile, example.txt); // 添加文件到formData并指定文件名
//添加其他非文件字段
formData.append(username, JohnDoe);
formData.append(email, johndoeexample.com);// 使用Axios发送POST请求
axios.post(https://example.com/upload, formData, {headers: {// Axios会自动为FormData设置Content-Type为multipart/form-data// 但你可以在这里添加其他自定义头部信息X-Custom-Header: SomeValue// 注意不要手动设置Content-Type头Axios会为你处理// Content-Type: multipart/form-data // 这行应该被注释掉或删除}
})
.then(response {console.log(上传成功:, response.data);
})
.catch(error {console.error(上传失败:, error);
});与 application/x-www-form-urlencoded 相比它支持传输二进制文件并且不受 URL 长度的限制。 在实际应用中正确设置Content-Type对于确保数据在网络上传输和处理的正确性至关重要。开发人员在开发过程中应注意客户端发送请求和服务器响应时的Content-Type设置以确保数据的正确解析和处理。 Postman中 binary格式
定义
binary格式在Postman中对应着HTTP请求中的Content-Type: application/octet-stream表示发送的是原始的二进制数据流。
用途
主要用于上传图片、音频、视频、文档等二进制文件到服务器。
特点
无键值对 与form-data和x-www-form-urlencoded等格式不同binary格式不依赖于键值对来组织数据。它直接上传文件的二进制内容因此一次通常只能上传一个文件。
文件类型 确保选择的文件是二进制文件如图片、音频、视频等。非二进制文件如文本文件虽然也可以以二进制形式发送但可能不是最佳实践。 文件大小 检查服务器对上传文件的大小限制。如果文件过大可能会导致上传失败或服务器错误。 Content-Type 虽然Postman会自动为binary格式设置Content-Type为application/octet-stream但在某些情况下服务器可能期望特定的Content-Type。如果遇到这种情况可以在Headers选项卡中手动设置Content-Type。
JSON数据转换为二进制数据
要将JSON数据转换为二进制数据你需要先将JSON字符串编码为字节序列例如使用UTF-8编码然后将这些字节序列封装成某种二进制格式如ArrayBuffer或Blob。
.将JSON对象转换为字符串如果它还不是字符串
const jsonObj { key: value, num: 123 };
const jsonString JSON.stringify(jsonObj);使用TextEncoder将JSON字符串编码为Uint8Array这是UTF-8编码的字节序列
const encoder new TextEncoder();
const uint8Array encoder.encode(jsonString);可选将Uint8Array转换为ArrayBuffer
const arrayBuffer uint8Array.buffer;可选将Uint8Array或ArrayBuffer封装为Blob如果你需要创建一个可以下载或上传的二进制文件
const blob new Blob([uint8Array], { type: application/json });现在你已经有了一个表示JSON数据的二进制格式ArrayBuffer或Blob。
请求发送 设置axios请求头 //post请求头headers: {Content-Type: application/json;charsetUTF-8;application/octet-stream,},示例
在这个示例中我们创建了一个隐藏的链接a元素设置了它的href属性为指向blob的URL并触发了点击事件来下载文件。下载完成后我们释放了URL对象以避免内存泄漏。
// 假设你有一个JSON对象
const jsonObj { key: value, num: 123 };// 将JSON对象转换为字符串
const jsonString JSON.stringify(jsonObj);// 使用TextEncoder将字符串编码为Uint8ArrayUTF-8编码
const encoder new TextEncoder();
const uint8Array encoder.encode(jsonString);// 将Uint8Array转换为ArrayBuffer如果需要
const arrayBuffer uint8Array.buffer;// 将Uint8Array或ArrayBuffer封装为Blob如果需要
const blob new Blob([uint8Array], { type: application/json });// 现在你可以使用arrayBuffer或blob进行进一步的操作例如通过XMLHttpRequest或Fetch API发送数据
// 或者创建一个指向blob的URL并下载它
const url URL.createObjectURL(blob);
const a document.createElement(a);
a.style.display none;
a.href url;
a.download data.json;
document.body.appendChild(a);
a.click();
window.URL.revokeObjectURL(url);
