今天有一个导出相应数据为excel表的需求。后端的接口返回一个数据流,一开始我用axios(ajax类库)调用接口,返回成功状态200,但是!但是浏览器没有自动下载excel表,当时觉得可能是ajax的安全性问题导致无法下载。下面列觉两种我测试成功的方式:

  1.window.location.href = '接口地址'

    含义:当前页面打开URL页面.

    和在浏览器输入接口地址一样,可以下载excel文件.但是缺点是无法执行POST请求

  

  2.利用隐藏表单解决(我这里假设加入了JQuery库):

var exportData = [
{'list1':'xiaodo1'},
{'list2':'xiaodo2'}
] //模拟后台需要接收的参数
let form = $("<form>"); //创建form标签 form.attr("style","display:none");
from.attr("method","post");//设置请求方式
form.attr("action","接口地址"); //action属性设置请求路径
$("body").append(form); //页面添加form标签 let input1 = $("<input>") //创建input标签
input1.attr("type","hidden") //设置隐藏域
input1.attr("name","data") //设置发送后台数据的参数名
input1.attr("value",JSON.Stringify(exportData)); form.submit();//表单提交即可下载!

  

上面就是我测试成功的两种方法.后面我去百度了一下axios如何导出excel文件,发现也是可以的.

axios导出excel文件可以参考这篇文章:https://blog.csdn.net/u013224660/article/details/79981350

谢谢!

前端调用后端接口下载excel文件的几种方式的更多相关文章

  1. PHP导出excel文件的几种方式

    PHP导出excel文件的几种方式 先说说动态生成的内容当作文件来下载的方法: 1.通过把Content-Type设置为application/octet-stream,可以把动态生成的内容当作文件来 ...

  2. 转:PHP导出excel文件的几种方式

    PHP导出excel文件的几种方式 文章来源:http://www.cnblogs.com/fredshare/archive/2012/10/29/2744243.html 先说说动态生成的内容当作 ...

  3. C#中的Excel操作【1】——设置Excel单元格的内容,打开Excel文件的一种方式

    前言 作为项目管理大队中的一员,在公司里面接触最多的就是Excel文件了,所以一开始就想从Excel入手,学习简单的二次开发,开始自己的编程之路! 程序界面 功能说明 打开文件按钮,可以由使用者指定要 ...

  4. Nginx解决前端调用后端接口跨域问题

    1.项目中遇到的问题描述: 前端调用zuul统一网关服务接口,请求状态码200,但是无返回数据. 浏览器控制台报错信息:No  Access-Control-Allow-Origin header i ...

  5. 前端调用后台接口下载word文档的两种方法

    1传统的ajax虽然能提交到后台,但是返回的数据被解析成json,html,text等字符串,无法响应浏览器下载.就算使用bob模拟下载,数据量大时也不方便 废话不多说:上代码(此处是Layui监听提 ...

  6. C/C++读写excel文件 的几种方式

    因为有些朋友问代码的问题,将OLE读写的代码分享在这个地方,大家请自己看. http://blog.csdn.net/fullsail/article/details/8449448 C++读取Exc ...

  7. 前端调用后端接口返回200(成功状态码),后端有返回,但是控制台Network Response为空,没展示任何信息

    解决方法: 1.在js里面debugger,可以看到后台是否有返回数据. 2.直接console.log(),直接把返回值打印出来,查看返回的数据格式,方便前端进行数据的处理. PS:因为后端返回的数 ...

  8. STM32下载Bin文件的几种方式

    一.STM32 ST-LINK Utility 1.下载安装软件 官网下载地址:http://www.st.com/zh/development-tools/stsw-link004.html 百度网 ...

  9. java读取excel文件的两种方式

    方式一: 借用 package com.ij34.util; /** * @author Admin * @date 创建时间:2017年8月29日 下午2:07:59 * @version 1.0 ...

随机推荐

  1. linux 查找locate find

    1.locate locate指令和find找寻档案的功能类似,但locate是透过update程序将硬盘中的所有档案和目录资料先建立一个索引数据库,在 执行loacte时直接找该索引,查询速度会较快 ...

  2. 前端框架VUE----node.js的简单介绍

    一.什么是node.js? 它是可以运行JavaScript的服务平台,可以吧它当做一门后端程序,只是它的开发语言是JavaScript 二.安装 1.node.js的特性: - 非阻塞IO模型 - ...

  3. K8S学习笔记之Flannel解读

    0x00 概述 我们知道docker官方并没有提供多主机的容器通信方案,单机网络的模式主要有host,container,brige,none.none这种模式,顾名思义就是docker本身不去管理网 ...

  4. JavaScript document open() 方法:打开一个新文档

    <html> <head> <script type="text/javascript"> function createNewDoc() { ...

  5. 02: docker高级篇

    1.1 Docker Compose 1.Docker Compose 介绍 1. Compose是一个定义和管理多容器的工具,使用Python语言编写. 2. 使用Compose配置文件描述多个容器 ...

  6. linux日常管理

    1.压缩和解压 tar压缩tar -czf hxl_product.tar.gz ./product tar解压tar -xzvf hxl_app.tar.gz z选项会将该压缩文件直接解压到目录,要 ...

  7. linux 关于redis-trib.rb构建redis集群

    之前搭建集群漏下的坑, 今次再搭一次. 环境 ruby环境 yum install ruby rubygems -y redis的gem环境 gem install redis-3.2.2.gem 部 ...

  8. Android之socket服务端

    import java.io.DataInputStream; import java.io.IOException; import java.io.PrintWriter; import java. ...

  9. 2018-2019-2 《网络对抗技术》Exp3 免杀原理与实践 20165211

    目录 2018-2019-2 <网络对抗技术>Exp3 免杀原理与实践 20165211 1. 基础问题回答 (1)杀软是如何检测出恶意代码的? (2)免杀是做什么? (3)免杀的基本方法 ...

  10. topcoder srm 698 div1 -3

    1.定义重复串$S=T+T$,即$S$可以表示成一个串的叠加.给定一个串$s$,可以通过删除字符.修改字符.增加字符来使得其变为重复串.问最少的次数. 思路:首先将$s$分成个串$s_{0},s_{1 ...