已知一个下载文件的后端接口,前端如何请求该接口,实现点击按钮、下载文件到本地。
来源:互联网 发布:java反射到底是什么 编辑:程序博客网 时间:2024/06/07 19:56
有两个方法:window.open()和通过form表单来提交。
在线例子:https://hamupp.github.io/gitblog/app/jsBasic/jsButtonDownloadFile/index.html
方法一:window.open("下载文件的后端接口");
*html结构*
<button type="button" id="btn1">下载一个zip(方法1)</button><button type="button" id="btn2">下载一个zip(方法2)</button>
/*js部分*/
var $eleBtn1 = $("#btn1"); var $eleBtn2 = $("#btn2"); //已知一个下载文件的后端接口:https://codeload.github.com/douban/douban-client/legacy.zip/master //方法一:window.open() $eleBtn1.click(function(){ window.open("https://codeload.github.com/douban/douban-client/legacy.zip/master"); });
然而有个问题:浏览器会打开一个新窗口,然后迅速自动关闭,体验非常不好。
方法二:通过form提交
由于ajax函数的返回类型只有xml、text、json、html等类型,没有“流”类型,所以通过ajax去请求该接口是无法下载文件的,所以我们创建一个新的form元素来请求接口。
/*js部分*/
//方法二:通过form $eleBtn2.click(function(){ var $eleForm = $("<form method='get'></form>"); $eleForm.attr("action","https://codeload.github.com/douban/douban-client/legacy.zip/master"); $(document.body).append($eleForm); //提交表单,实现下载 $eleForm.submit(); });
阅读全文
0 0
- 已知一个下载文件的后端接口,前端如何请求该接口,实现点击按钮、下载文件到本地。
- java 把已知下载路径的文件复制到本地
- java 把已知下载路径的文件复制到本地
- 文件下载的三种方式,前端和后端实现
- 文件的下载的接口
- JS实现点击按钮,下载文件
- 将文件以流的形式传给前端,前端点击按钮下载
- 下载文件到本地
- 如何从网络下载文件到本地
- QT实现,通过URL下载文件的接口实现
- 一个下载Http文件到本地的Demo
- .Net WebAPI 高速下载文件接口实现
- java实现网上下载文件到本地
- PHP实现远程下载文件到本地
- php后端强制前端下载文件
- PHP代码实现远程下载文件到本地的函数
- jsp 下载 服务端的文件到本地
- jsp 下载 服务端的文件到本地
- Yii2中连接mongoDb以及基础的查询
- 如何解决高并发问题
- 为网站添加新的插件和主题配置文件权限
- CSS样式集结
- PostgreSQL PostGIS pgrouting 泰国(thailand)全国路网分析(2)入库的数据处理
- 已知一个下载文件的后端接口,前端如何请求该接口,实现点击按钮、下载文件到本地。
- OpenTCS的一些说明
- IT管理中的八大错误
- 关于 zsh 控制台乱码的问题
- Scala学习(四)---映射和元组
- 8583报文手动组包——详细分析每个示范域
- Windows的CMD控制台输出到TEXT文档
- 精心收集的 48 个 JavaScript 代码片段,仅需 30 秒就可理解
- C++ STL中哈希表Map 与 hash_map 介绍