原生Ajax处理文件流
在通过Ajax处理请求时,可能会遇到需要下载文件的情况,这里简要的说明下处理方法。
let downloadFile = document.getElementById("downloadImportInfo");
let fileUrl = "D:/test.xlsx"; // ajax获取到的文件地址
downloadFile.onclick = function () {
const xhr = new XMLHttpRequest();
let url = "localhost:8000/api/downloadUrl/" + fileUrl; //通过接口处理文件
xhr.responseType = 'blob';
xhr.onload = function () {
if (this.status == "200") {
//获取响应文件流
let blob = this.response;
let a = document.createElement('a');
a.style = 'display:none';
const reader = new FileReader();
reader.readAsDataURL(blob);
reader.onload = function (e) {
a.download = "试验计划信息.xlsx";
a.href = e.target.result;
document.body.append(a);
a.click();
a.remove();
}
}
}
xhr.open("get", url, true);
xhr.send();
}
原生Ajax处理文件流的更多相关文章
- ajax和原生ajax、文件的上传
ajax理解: ajax发送的请求是异步处理的.也就是说如下形式: function f1(){ $.ajax( { ....... success:function(){ a= return a } ...
- 原生ajax实现文件上传
视图层 JS 函数: <input type="file" onchange="sendFile()" id="up" /> ...
- 原生js实现ajax的文件异步提交功能、图片预览功能.实例
采用html5使得选择图片改变时,预览框中图片随之改变.input文件选择框美化.原生js完成文件异步提交 效果图: 代码如下,可直接复制并保存为html文件打开查看效果 <html> & ...
- Ajax异步请求返回文件流(eg:导出文件时,直接将导出数据用文件流的形式返回客户端供客户下载)
在异步请求中要返回文件流,不能使用JQuery,因为$.ajax,$.post 不支持返回二进制文件流的类型,可以看到下图,dataType只支持xml,json,script,html这几种格式,没 ...
- python_way day21 Django文件上传Form方式提交,原生Ajax提交字符处啊,Django文件上传之原生Ajax方式、jQuery Ajax方式、iframe方式,Django验证码,抽屉示例,
python_way day21 1.Django文件上传至Form方式 2.原生Ajax文件上传提交表单 使用原生Ajax好处:不依赖jquery,在发送一个很小的文件或者字符串的时候就可以用原生A ...
- Day21 Django之Form文件上传、原生Ajax和实现抽屉实例
一.Form文件上传 """ Django settings for prev_chouti project. Generated by 'django-admin st ...
- ajax 请求 后台返回的文件流
download(url) { var xhr = new XMLHttpRequest(); xhr.open('GET', url, true); // 也可以使用POST方式,根据接口 xhr. ...
- Django中的文件上传和原生Ajax
概述 Django中的上传有3种方案: form 表单常规上传,但点击提交后会自动刷新页面 Ajax 上传,不刷新页面,(分为原生ajax上传和jQuery上传),IE7以上不兼容 iframe 上传 ...
- flask使用原生ajax、不使用表单(Form)上传文件
〇.知识点 jquery ajax 文档告诉你可以使用默认的 application/x-www-form-urlencoded, multipart/form-data, or text/plain ...
随机推荐
- 用 Windows Server 2019 搭建求生之路服务器
准备工作 要搭建一台 Windows Server 的求生之路服务器需要做以下几点前置工作: 购买一台云服务器,如腾讯云: 下载 SteamCMD: 安装 SourceMod.MateMod.L4dT ...
- Springboot+MybatisPlus多数据源比对数据
欢迎关注博主公众号「Java大师」, 专注于分享Java领域干货文章https://www.javaman.cn/ 基于不同的数据源进行数据比对,比较两个数据库的表之间数据的总量,以及处理后的总量,按 ...
- Typora 最后免费版本也不能用了?简单一招搞定
作者:小牛呼噜噜 | https://xiaoniuhululu.com 计算机内功.JAVA底层.面试相关资料等更多精彩文章在公众号「小牛呼噜噜 」 Typora是一款优秀的 Markdown 编辑 ...
- GIN 索引
GIN(Generalized Inverted Index, 通用倒排索引) 是一个存储对(key, posting list)集合的索引结构,其中key是一个键值,而posting list 是一 ...
- WSUS无法发现客户端
这几天遇到一个问题,刚装好的WSUS服务器同步完补丁后,打算上线使用.挑了几个客户端,使用注册表配置了WSUS,但是迟迟无法在控制台上看到这些客户端.由于部分客户端不在域中,无法使用组策略配置,就写了 ...
- 微信小程序开发总结-怀庄酒业投票活动
使用微信小程序投票活动云开发 怀庄酒业活动 使用云开发.开始准备使用django开发自己的后台,但是发现功能比较简单,使用云开发更省事 项目结构: cloudfunctions目录下是三个云函数 ba ...
- Django 之模版层
一.模板简介 将前端页面和Python 的代码分离是一种的开发模式. 为此 Django专门提供了模板系统 (Template System,即模板层)来实现这种模式. Django 的模板 = HT ...
- Object.keys的‘诡异’特性,你值得收藏!
先从'诡异'的问题入手 例1: 纯Number类型的属性 const obj = { 1: 1, 6: 6, 3: 3, 2: 2 } console.log('keys', Object.keys( ...
- Redash中文版安装问题大全
Redash的安装比较复杂,由于系统环境组件版本不同,可能会出现这样那样的问题,我们把安装过程中常见问题记录如下: 1.git clone 经常提示:RPC失败,远端意外挂断.过早的文件结束符.ind ...
- #Lua:Lua调用C++生成的DLL库
Lua调用C++生成的DLL库 本文参考了某大佬的博客,写得十分详细,推荐!!! 需求: 在之前的求解器中添加了Lua库,使得程序可以在Lua脚本中实现自定义函数功能,考虑到未来可能需要与第三方程序库 ...