angular中a标签带请求头下载excel
<!DOCTYPE html>
<html lang="en" ng-app="app">
<head>
<meta charset="UTF-8">
<title>Title</title>
<link rel="stylesheet" href="../lib/bootstrap-3.3.7/css/bootstrap.min.css">
<script src="../lib/jquery/jquery.min.js"></script>
<script src="../lib/bootstrap-3.3.7/js/bootstrap.min.js"></script>
<script src="../lib/angular/angular.js"></script>
<script>
var app = angular.module('app', []);
app.controller('myCtrl', function ($scope) {
//前提:后台已经将excel设计完成
$scope.download=function(){
var url = 'download/?filename=aaa.txt';
var xhr = new XMLHttpRequest();
xhr.open('GET', url, true); // 也可以使用POST方式,根据接口
xhr.responseType = "blob"; // 返回类型blob
xhr.setRequestHeader("tokenId", "your token");
// 定义请求完成的处理函数,请求前也可以增加加载框/禁用下载按钮逻辑
xhr.onload = function () {
// 请求完成
if (this.status === 200) {
// 返回200
var blob = this.response;
var reader = new FileReader();
reader.readAsDataURL(blob); // 转换为base64,可以直接放入a表情href
reader.onload = function (e) {
// 转换完成,创建一个a标签用于下载
var a = document.createElement('a');
a.download = '用户信息.xls';
a.href = e.target.result;
$("body").append(a); // 修复firefox中无法触发click
a.click();
$(a).remove();
}
}
};
// 发送ajax请求
xhr.send()
}
});
</script>
</head>
<body ng-controller="myCtrl">
<div class="container"> </div>
</body>
</html>
angular中a标签带请求头下载excel的更多相关文章
- Http消息头中常用的请求头和响应头
作为Web开发对常用http的请求头和响应头熟悉了解一下还是很有必要的.比如请求头中Content-type指定了请求的内容,若类型是application/x-www-form-urlencoded ...
- 在AngularJs中怎么设置请求头信息(headers)及不同方法的比较
在AngularJS中有三种方式可以设置请求头信息: 1.在http服务的在服务端发送请求时,也就是调用http()方法时,在config对象中设置请求头信息:事例如下: $http.post('/s ...
- Vue中axios有关请求头的几点小结
在Vue前端中向后端发起http请求会有着两种写法:一种是在vue文件中直接导入axios模板,另外一种是使用Vue的属性$http. 1.在第一种方式中,在同一个工程中所添加的vue文件直接使用ax ...
- vue 利用axios请求接口下载excel
一般有三种方法: 方法一: 通过a标签下载 // href为文件的存储路径或者地址,download为问文件名 <a href="/images/download.jpg" ...
- HTTP协议---HTTP请求中的常用请求字段和HTTP的响应状态码及响应头
http://blog.csdn.net/qxs965266509/article/details/8082810 用于HTTP请求中的常用请求头字段 Accept:用于高速服务器,客户机支持的数据类 ...
- XMLHttpRequest.withCredentials 解决跨域请求头无Cookie的问题
查看原文 XMLHttpRequest.withCredentials 属性是一个Boolean类型,它指示了是否该使用类似cookies,authorization headers(头部授权)或者 ...
- Feign 自定义编码器、解码器和客户端,Feign 转发请求头(header参数)、Feign输出Info级别日志
Feign 的编码器.解码器和客户端都是支持自定义扩展,可以对请求以及结果和发起请求的过程进行自定义实现,Feign 默认支持 JSON 格式的编码器和解码器,如果希望支持其他的或者自定义格式就需要编 ...
- 在Angular中,如果权限值是异步请求所得,如何将其设置为HTTP请求头的Authorization?
遇到此问题的背景:项目需要实现单点登录,在前后端分离的前提下,前台如何保存token值成为了一个问题.想到的解决方案是,将token值统一存到一个前端程序,其他的前端程序去这个前端程序去取token( ...
- http请求头中的Content-Type属性在angular 和 node中的用法
post请求的请求体有以下两种格式: 1. 字符串: 'name=code_bunny&age=12' 这种格式的请求体,需要配置请求头 'Content-Type':'application ...
随机推荐
- Java冒泡排序、选择排序、插入排序、希尔排序、归并排序、快速排序
冒泡排序 冒泡排序是一种简单的排序算法.它重复地走访过要排序地数列,一次比较两个元素,如果它们地顺序错误就把它们交换过来.走访数列地工作是重复地进行直到没有再需要交换,也就是说该数列已经排序完成. ...
- The Prices
题目描述 你要购买\(m\)种物品各一件,一共有\(n\)家商店,你到第\(i\)家商店的路费为\(d[i]\),在第家商店购买第\(j\)种物品的费用为\(c[i][j]\),求最小总费用. 输入格 ...
- split().reverse().join()代码解析
split() 方法用于把一个字符串分割成字符串数组. reverse() 方法用于颠倒数组中元素的顺序. join() 方法用于把数组中的所有元素放入一个字符串.
- Shell基本语法---if语句
if语句 格式 #单分支 if [ 条件判断 ]; then 执行动作 fi if [ 条件判断 ]; then 执行动作 else 执行动作 fi #多分支 if [条件判断]; then 执行动作 ...
- git pull & git fetch
Git中从远程的分支获取最新的版本到本地有这样2个命令:1. git fetch:相当于是从远程获取最新版本到本地,不会自动merge git fetch origin mastergit log ...
- pycharm控制台输出的日志全是红色的字体?
问题:logging在pycharm控制台输出的日志的字体全是红色的,怎么办? 图片描述: 解决办法:设置 -> 搜索“Console” -> 结果:改完立马生效
- Jarvisoj-web Login
题目入口: http://web.jarvisoj.com:32772/ 有个登陆框,随便提交参数然后bp抓包 get到了一个Hint,给了sql查询的语句 select * from `admin` ...
- 跟老刘学运维day01~谈红帽系统
第0章 谈红帽系统 1.Linux,是一套免费使用和自由传播的类Unix操作系统,其源代码完全开源: 开源:==>将程序与程序的源代码一起提供给用户的服务模式. 开源四大特点:低风险.高品质.低 ...
- rpm -ivh vsftpd-3.0.2-22.el7.x86_64.rpm出现error: open of vsftpd-3.0.2-22.el7.x86_64.rpm failed: No such file or directory的解决方法
情况一: 出现如图问题, 我当时的问题是通过安装rpmbuild工具软件解决的 以前制作rpm时,没有遇到过这个问题,几经搜索也没有解决.后来发现当前的centos没有安装 rpmbuild 工具软件 ...
- 在CentOS 7 上为docker配置端口转发以兼容firewall
在CentOS 7上当我们以类似下列命令将主机端口与容器端口映射时可能遇到无法访问容器服务的问题 docker run --name web_a -p 192.168.1.250:803:80 -d ...