BLOB对象的上传与下载，前端JS、后台node.js

最新推荐文章于 2024-08-26 12:08:18 发布

木头怪

最新推荐文章于 2024-08-26 12:08:18 发布

阅读量8.7k

点赞数 3

分类专栏： Blob JavaScript node.js 文章标签： Blob

本文链接：https://blog.csdn.net/qq_29092379/article/details/86135920

版权

本文介绍了如何使用Blob对象进行文件上传和下载。在前端，利用jQuery的ajax提交Blob文件到服务器，并通过FormData和设置contentType避免数据处理。后端接收到文件后保存并修改文件名。下载时，后端读取文件内容转换为base64发送到前端。

摘要由CSDN通过智能技术生成

1：背景

react编项目的时候遇到一个需求，实现作品的保存与下载编辑功能：将网页上的blob对象上传到服务器，以文件的形式保存；下载服务器的作品到网页上进行编辑，读取文件内容并发送到前端。

当前只记录实现的流程，blob对象具体的解释见文章底部的参考链接

2：blob上传

2.1：前端操作：上传

使用jquery的ajax提交文件上传

var fd = new FormData();
fd.append('filetitle', filetitle);//文件名：string
fd.append('filedata', filedata);//文件内容：blob
$.ajax({
    type: 'POST',
    url: "/api/saveProject",
    data: fd,
    processData: false,
    contentType: false
}).done(function (data) {
    //data: 服务器返回的数据
    //TODO ......
});

其中关键参数：

1、FormData：这里利用FormData对象来异步上传文件，对象放入的上传数据为键值对。

2、processData：默认为 true ，通过data选项传进来的数据&#