Javascript 在浏览器中下载文件

在我的网页上，我有下载mp3文件的链接

在用户单击时，我会调用ajax并在服务器上创建一个mp3文件

我将文件的路径返回到脚本，但是现在，如何让它下载到用户系统

<SCRIPT TYPE="text/javascript">
    function voice(id){
        $.ajax({
                url:'/download/',
                type:"POST",
                data:{'id':id,'csrfmiddlewaretoken':$('input[name=csrfmiddlewaretoken]').val()},
                success:function(return_data) {
                    alert(return_data['url']);
                },
                error: function(){
                    alert("Some Error");
                }
            });
    }
</SCRIPT>

功能语音（id）{
$.ajax({
url:“/download/”，
类型：“POST”，
数据：{'id'：id，'csrfmiddlewaretoken'：$（'input[name=csrfmiddlewaretoken]）.val（），
成功：函数（返回\u数据）{
警报（返回_数据['url']）；
},
错误：函数（）{
警惕（“某些错误”）；
}
});
}

我在警报中获取mp3文件的url，但如何下载它

---

谢谢。

您可以执行

window.location=return_data['url']假设您有一个以http开头的url。。。这种方法相当于用户单击mp3的链接。另一种方法是创建一个iframe，将src设置为新创建的链接。使用此方法，用户浏览器将提示下载文件，而无需更改位置（从当前页面导航）。我推荐第一种方法。
这应该可以：

<SCRIPT TYPE="text/javascript">
    function voice(id){
        $.ajax({
            url:'/download/',
            type:"POST",
            data:{'id':id,'csrfmiddlewaretoken':$('input[name=csrfmiddlewaretoken]').val()},
            success:function(return_data) {
                window.location.href = return_data['url'];
            },
            error: function(){
                alert("Some Error");
            }
        });
}
</SCRIPT>


功能语音（id）{
$.ajax({
url:“/download/”，
类型：“POST”，
数据：{'id'：id，'csrfmiddlewaretoken'：$（'input[name=csrfmiddlewaretoken]）.val（），
成功：函数（返回\u数据）{
window.location.href=返回_数据['url']；
},
错误：函数（）{
警惕（“某些错误”）；
}
});
}
在HTML中创建一个使用CSS隐藏的anchortag

 <a href="#" id="someID" class"hiddenUrl" style="visibility: hidden" target="_blank">Hidden</a>



在你的javascript中

<SCRIPT TYPE="text/javascript">
    function voice(id){
        $.ajax({
                url:'/download/',
                type:"POST",
                data:{'id':id,'csrfmiddlewaretoken':$('input[name=csrfmiddlewaretoken]').val()},
                success:function(return_data) {
                  var url= return_data['url'];
                   $('.hiddenUrl').attr('href',url) //adding value to the href attribute
                    $('.hiddenUrl').attr('download','any_filename.mp3');
                     $('.hiddenUrl')[0].click();

                },
                error: function(){
                    alert("Some Error");
                }
            });
    }
    </SCRIPT>


功能语音（id）{
$.ajax({
url:“/download/”，
类型：“POST”，
数据：{'id'：id，'csrfmiddlewaretoken'：$（'input[name=csrfmiddlewaretoken]）.val（），
成功：函数（返回\u数据）{
var url=返回_数据['url']；
$（'.hiddenUrl'）.attr（'href'，url）//向href属性添加值
$（'.hiddenUrl'）.attr（'download'，'any_filename.mp3'）；
$（'.hiddenUrl'）[0]。单击（）；
},
错误：函数（）{
警惕（“某些错误”）；
}
});
}
我想这会管用的
功能语音（id）{
$.ajax({
url:“/download/”，
类型：“POST”，
数据：{'id'：id，'csrfmiddlewaretoken'：$（'input[name=csrfmiddlewaretoken]）.val（），
成功：函数（返回\u数据）{
var url=返回_数据['url']；
window.location.assign（url）；
},
错误：函数（）{
警惕（“某些错误”）；
}
});
}
当我执行时
window.location=return_data['url']浏览器尝试自己播放文件。Mp3文件有时会损坏，浏览器拒绝播放，但如果下载，它会在本地媒体播放器中正常播放。使用您的解决方案，浏览器会尝试播放Mp3文件。我想下载。谢谢。@Stark很好，谢谢，我只是想帮你。坚持下去，伙计。用你的解决方案，浏览器会尝试播放mp3文件。我想下载。谢谢。好的，所以你需要阅读这个答案
I think this will work
 <SCRIPT TYPE="text/javascript">
        function voice(id){
            $.ajax({
                url:'/download/',
                type:"POST",
                data:{'id':id,'csrfmiddlewaretoken':$('input[name=csrfmiddlewaretoken]').val()},
                success:function(return_data) {
                    var url= return_data['url'];
                    window.location.assign(url);
                },
                error: function(){
                    alert("Some Error");
                }
            });
    }
    </SCRIPT>