利用FileReader进行二进制文件传输
一、读取本地二进制文件,上传(数据库文件为例)
二进制文件读取的时候应当直接读取成字节数组,以免在调试时造成误解。比如数据库文件里面的有些字段是utf8编码,因此,采用utf-8编码读出来也能看到一些数据,但任然不应该用指定编码的格式读取。
web端
先读取到ArrayBuffer,在获取ArrayBuffer的Uint8Array字节数组形式,最后用base64编码字节数组用于传输。
var reader = new FileReader();//这是核心,读取操作就是由它完成.
reader.readAsArrayBuffer(selectedFile);//读取文件的内容
reader.onload = function () {
//当读取完成后回调这个函数,然后此时文件的内容存储到了result中,直接操作即可
var file = this.result;//arraybuffer对象(有3种表示方法)
var view = new Uint8Array(file);//提取二进制字节数组,使用Uint8Array表示
console.log("读取");
console.log(binary2base64(view));//base64编码,binary2base64自定义与下文,功能为返回二进制数组的base64编码字符串
}
//二进制字节数组转base64编码的字符串
function binary2base64(bi) {
let str = '';
for (let i = 0, len = bi.length; i < len; i++) {
str += String.fromCharCode(bi[i]);
}
return btoa(str);
}
服务器端
将字符串解码成字节数组再写入文件
//假设已经从Request请求中获得了上传的文件dbfile
public void CreateDB(string dbfile)
{
//创建空文件用于写入数据库
string path = $@"dbfile.db";
File.Create(path).Dispose(); //解码base64数据为二进制字节数组
byte[] file=Convert.FromBase64String(dbfile)); //写入数据库
File.WriteAllBytes(path, file);
}
二、二进制文件下载
服务器端
直接读取文件到字节数组,在编码为base64字符串,传输到web端
public string outPortDB()
{
string path="dbfile.db";
//对于二进制文件,直接读取二进制数据
byte[] file = File.ReadAllBytes(path); //base64编码
string fileStr = Convert.ToBase64String(file);
return fileStr;
}
web端
将字符串解码成字节数组,再模拟点击下载
$.ajax({
url: "...",
type: "post",
data: { ... },
success: function (data) {
//base64解码成二进制字节数组
//base64ToArrayBuffer将字符串解码转换成字节数组,定义在下文
var file = new Blob([base64ToArrayBuffer(data)]);
// 通过a标签把内容下载到本地
var obj = window.URL.createObjectURL(file);
var btn = document.createElement("a");
btn.download = "dbfile.db";
btn.href = obj;
btn.click();
},
error: function (data) {
alert("下载失败");
}
});
//base64转二进制字节数组
function base64ToArrayBuffer(base64) {
//先解码成字符串(utf8编码表示)
var binary_string = window.atob(base64);
var len = binary_string.length;
var bytes = new Uint8Array(len);
for (var i = 0; i < len; i++) {
//获取每个字符的实际二进制字节
bytes[i] = binary_string.charCodeAt(i);
}
//实际上返回的是ArrayBuffer对象
return bytes.buffer;
}
利用FileReader进行二进制文件传输的更多相关文章
- 利用PHP取二进制文件头判断文件类型
<?php $files = array('D:\no.jpg', 'D:\no.png','D:\no2.JPEG','D:\no.BMP'); $fileTypes = array( 779 ...
- html5中利用FileReader来读取文件。
利用FileReader来读取文件的能够来实现即时预览的效果,这个也是在html5中才有的功能. <!DOCTYPE html> <html lang="en"& ...
- WebService之Axis2(4):二进制文件传输
在<WebService大讲堂之Axis2(2):复合类型数据的传递>中讲过,如果要传递二进制文件(如图像.音频文件等),可以使用byte[]作为数据类型进行传递,然后客户端使用RPC方式 ...
- Netty之二进制文件传输
传输会话简要 客户端发起一个文本请求给服务器端, 服务器端解析里面文本, 返回文件给客户端, 客户端解析文件 服务器端 因为示例文件比较小, 所以没有做分段传输, 而是直接一次性把整个文件byte[] ...
- javascript 利用FileReader和滤镜上传图片预览
FileReader 对象允许Web应用程序异步读取存储在用户计算机上的文件(或原始数据缓冲区)的内容,使用 File或 Blob对象指定要读取的文件或数据. 1.FileReader接口的方法 Fi ...
- 利用FileReader实现上传图片前本地预览
引子 平时做图片上传预览时如果没有特殊的要求就直接先把图片传到后台去,成功之后拿到URL再渲染到页面上,这样做在图片比较小的时候没什么问题,大一点的话就会比较慢才能看到预览了,而且还产生了垃圾文件,所 ...
- 洗礼灵魂,修炼python(86)--全栈项目实战篇(12)—— 利用socket实现文件传输/并发式聊天
由于本篇博文的项目都很简单,所以本次开个特例,本次解析两个项目,但是都很简单的 项目一:用socket实现文件传输 本项目很简单,作为小项目的预热的,前面刚学完socket,这里马上又利用socket ...
- Linux下利用ssh远程文件传输 传输命令 scp
在linux下一般用scp这个命令来通过ssh传输文件. 一.scp是什么? scp是secure copy的简写,用于在Linux下进行远程拷贝文件的命令,和它类似的命令有cp,不过cp只是在本机进 ...
- 媒体文件audio 转 base64 编码 (利用 FileReader & Audio 对象)
<!DOCTYPE html> <html> <head> <meta charset="utf-8"> <title> ...
- python学习之利用socketserver的文件传输
使用socketserver进行多用户的文件传输 服务端 class FtpServer(socketserver.BaseRequestHandler): # 继承socketserver.Base ...
随机推荐
- 看你能解锁哪些新身份?OpenHarmony大使、MVP、金码达人在线申报
- Qt调用系统DLL,判断网络连接状态
*: Win32 网络连接 dll 文件名叫:wininet.dll,位置在 C:\WINDOWS\system32 目录下,将 其拷贝到项目工程下. #include <QLibrary> ...
- redis 简单整理——客户端管理[十六]
前言 简单介绍一下客户端管理. 正文 Redis提供了客户端相关API对其状态进行监控和管理,这个一般有很多工具了,看看就好,没有必要去细看.
- three.js实现数字孪生3D仓库一期(开源)
大家好,本文使用three.js实现了3D仓库一期项目,给出了代码,分析了关键点,感谢大家~ 关键词:数字孪生.three.js.Web3D.WebGL.智慧仓库.开源 代码:Github 我正在承接 ...
- 【Oracle】列拆行/对多行数据的单行数据进行分割并多行显示
[Oracle]列拆行/对多行数据的单行数据进行分割并多行显示 参考链接:Oracle 一行字符串拆分为多行_oracle一行拆分成多行-CSDN博客 背景:要对一个表的字段的内容进行分割,分隔符都是 ...
- Serverless 时代下微服务应用全托管解决方案
简介: 本文介绍了 Serverless 时代下微服务的发展以及过程中遇到的相对较复杂的需求,面对这些,阿里云 Serverless 应用引擎 SAE 将"Serverless"的 ...
- MaxCompute跨境访问加速解决方案
简介: MaxCompute联合全球加速服务,为有跨境访问需求的MaxCompute客户提供一套高效稳定的跨境访问加速方案. MaxCompute联合全球加速服务,为有跨境访问需求的MaxComput ...
- [K8s] Pod 与容器设计模式 Sidecar
为什么 Pod 必须是原子调度? 在两个容器紧密协作的场景中,避免调度失败问题. Pod 解决了里面多个容器之间高效共享某些资源和数据,共享网络.共享存储. 容器设计模式? 通过在 Pod 里定义专门 ...
- C语言结构体的内存分配
一.结构体内存分配原则 原则一:结构体中元素按照定义顺序存放到内存中,但并不是紧密排列.从结构体存储的首地址开始 ,每一个元素存入内存中时,它都会认为内存是以自己的宽度来划分空间的,因此元素存放的位置 ...
- STM32定时器原理
一.简介 不同的芯片定时器的数量不同,STM32F10x中一共有11个定时器,其中2个高级控制定时器,4个普通定时器和2个基本定时器,以及2个看门狗定时器和1个系统嘀嗒定时器. 基本定时器:TIM6. ...