大神们请看这!Jquery如何将2进制流保存为文件?

时间:2021-10-21 12:29:16
如题,因为只是简单html页面,没有后台代码。想通过jquery的函数将返回的json数据内的一个二进制数组保存为文件。
有sample更好,先谢谢。

8 个解决方案

#1


js权限不足。

#2


引用 1 楼 mmm306306 的回复:
js权限不足。

阿。。。权限是个问题啊。

#3


通过服务器端设置响应头来实现。。。js搞不了

#4


服务器方面直接通过response来提供下载么?没办法的话要改设计了

#5


对的,客户端就js没办法将2进制流存为文件

#6


记得是有一个activeX组件
还是vbscript组件
可以提供这些权限。
但是对浏览器的安全设置有非常大的要求。
要求你开很多不安全的设置。。

#7


改设计算了,读了文件之后,生成json的信息发给手机,手机收到之后,自己再解析次。
谢谢各位大大。

#8


如果你要,HTML5可以下载的,不需要后端,纯前端支持。HTML5的一个例子:

var content = "file content!";
var data = new Blob([content],{type:"text/plain;charset=UTF-8"});
var downloadUrl = window.URL.createObjectURL(data);
var anchor = document.createElement("a");
anchor.href = downloadUrl;
anchor.download = "文件名.txt";
anchor.click();
window.URL.revokeObjectURL(data); 

以上代码chrome下亲测,运行即下载一个txt文件,内容就是 file content!

LZ通过json获得的二进制,应该不是实际意义上的二进制吧?
json中的数组不是TypedArray,需要转化一下。
再来一个代码保存二进制的。


var binaryData = [0,0,1,1,1,0,0,0,1,1]; //普通数组
//要保存的数据是10个二进制位,但是一个字节是8位,so,需要16位,2个字节
var binLen = binaryData.length;
var byteLen = Math.ceil(binLen/8);
var buffer = new ArrayBuffer(byteLen ); // 开辟两个字节的缓冲区
var byteData = new Uint8Array(buffer);
for(var i=0; i<byteLen ; i++) { //开始转化为8进制
  byteData[i] = 0;
  for(var j=i*8,k=7; k>=0&&j<binLen; j++,k--) {
    byteData[i] |= binaryData[j] << k;  
    //用按位或运算,将8个二进制一组地组合到byteData中
  }
}
var data = new Blob([buffer],{type:"application/octet-stream"});
var downloadUrl = window.URL.createObjectURL(data);
var anchor = document.createElement("a");
anchor.href = downloadUrl;
anchor.download = "二进制测试.bin";
anchor.click();
window.URL.revokeObjectURL(data);
 
Blob+ArrayBuffer+URL.createObjectURL+anchor.click,一系列特性,完成了无需后端的文件下载。

附一张测试下载的结果图
大神们请看这!Jquery如何将2进制流保存为文件?

#1


js权限不足。

#2


引用 1 楼 mmm306306 的回复:
js权限不足。

阿。。。权限是个问题啊。

#3


通过服务器端设置响应头来实现。。。js搞不了

#4


服务器方面直接通过response来提供下载么?没办法的话要改设计了

#5


对的,客户端就js没办法将2进制流存为文件

#6


记得是有一个activeX组件
还是vbscript组件
可以提供这些权限。
但是对浏览器的安全设置有非常大的要求。
要求你开很多不安全的设置。。

#7


改设计算了,读了文件之后,生成json的信息发给手机,手机收到之后,自己再解析次。
谢谢各位大大。

#8


如果你要,HTML5可以下载的,不需要后端,纯前端支持。HTML5的一个例子:

var content = "file content!";
var data = new Blob([content],{type:"text/plain;charset=UTF-8"});
var downloadUrl = window.URL.createObjectURL(data);
var anchor = document.createElement("a");
anchor.href = downloadUrl;
anchor.download = "文件名.txt";
anchor.click();
window.URL.revokeObjectURL(data); 

以上代码chrome下亲测,运行即下载一个txt文件,内容就是 file content!

LZ通过json获得的二进制,应该不是实际意义上的二进制吧?
json中的数组不是TypedArray,需要转化一下。
再来一个代码保存二进制的。


var binaryData = [0,0,1,1,1,0,0,0,1,1]; //普通数组
//要保存的数据是10个二进制位,但是一个字节是8位,so,需要16位,2个字节
var binLen = binaryData.length;
var byteLen = Math.ceil(binLen/8);
var buffer = new ArrayBuffer(byteLen ); // 开辟两个字节的缓冲区
var byteData = new Uint8Array(buffer);
for(var i=0; i<byteLen ; i++) { //开始转化为8进制
  byteData[i] = 0;
  for(var j=i*8,k=7; k>=0&&j<binLen; j++,k--) {
    byteData[i] |= binaryData[j] << k;  
    //用按位或运算,将8个二进制一组地组合到byteData中
  }
}
var data = new Blob([buffer],{type:"application/octet-stream"});
var downloadUrl = window.URL.createObjectURL(data);
var anchor = document.createElement("a");
anchor.href = downloadUrl;
anchor.download = "二进制测试.bin";
anchor.click();
window.URL.revokeObjectURL(data);
 
Blob+ArrayBuffer+URL.createObjectURL+anchor.click,一系列特性,完成了无需后端的文件下载。

附一张测试下载的结果图
大神们请看这!Jquery如何将2进制流保存为文件?