学习笔记：前端blob下载文件乱码的几种解决方式加上\ufeff 通常我们加上utf-8 设置responseType

加上\ufeff

通常我们

const blob = new Blob(["\ufeff",data], {type: 'text/plain'});

加上utf-8

const blob = new Blob(["\ufeff",data], {type: 'text/plain;charset=utf-8'});

// or

response.setCharacterEncoding("UTF-8"); // 设置文件流编码格式 不然中文会乱码

设置responseType为blob或者arraybuffer

function fetchData(item, index){
    fetch('/music/file?name='+item.innerText,{
        method: 'get',
        responseType: 'blob' // or arraybuffer
    }).then(res => {     
        return res.blob();
    }).then(blob => {
        let bl = new Blob([blob], {type: "audio/m4a"});
        let fileName = Date.parse(new Date())+".m4a";
        var link = document.createElement('a');
        link.href = window.URL.createObjectURL(blob);
        link.download = fileName;
        link.click();
        window.URL.revokeObjectURL(link.href);
    })
}

注意事项

前后端通信的content-type，一定要严格按照MIME官方文档的类型，否则依然有可能出现乱码