JS模拟Form表单下载视频和音频

1、最开始的采取的做法是window.open和window.location.href这两种形式请求后台下载文件的，前台代码：

 

        $BTN.click(function(){
              var videoUrl = $("#videoUrl").val();
              window.open(projectPath + '/downloadResource?url='+videoUrl );

        })

 

• 存在问题：

　　当下载文件不存在时就会出现页面加载失败的情况。采用window.open这种方式就会打开一个新的窗口页面出现请求失败；采用window.location.href这种形式就会在当前页面直接跳转，然后显示页面加载失败的情况。

 

2、优化后通过form表单提交：

由于ajax函数的返回类型只有xml、text、json、html等类型，没有“流”类型，所以通过ajax去请求该接口是无法下载文件的，所以我们创建一个新的form元素来请求接口。

/*js部分*/

$Btn.click(function(){

    var videoUrl = $("#videoUrl").val();

    var $eleForm = $("<form method='get'></form>");
    $eleForm.attr("action",projectPath + '/downloadResource?');
    // 隐藏域传递参数
    $eleForm.append($("<input></input>").attr("type", "hidden").attr("name", "url").attr("value", videoUrl));

    $(document.body).append($eleForm);

    //提交表单，实现下载
    $eleForm.submit().remove();

 });

参考网址：https://www.cnblogs.com/hamsterPP/p/6763458.html

　　　　　http://www.baikeyang.com/code/97427.html