代替前端 a 标签浏览器自动下载下载Response Heade

2022-02-28  本文已影响0人  哆啦在这A梦在哪

一:基本知识点解释

Response Header中的Content-Type指定了服务器端返回数据的类型,浏览器自己是可以处理这些类型的,当返回的数据为文件类型时,浏览器会自行下载。具体的类型和content-type的对应方式可见

二:对应类型含义解释

举个类型例子(其他类型自行查找,一查一大堆):

文件扩展名 Content-Type(Mime-Type)
.*( 二进制流,不知道下载文件类型) application/octet-stream
.mp4 video/mpeg4

当Content-Type是一些文件类型时,使用Content-Disposition可以指定浏览器下载文件时的默认文件名
因此,我们想要使用gin实现下载文件的功能,只需要在接口返回时设置Response-Header中的Content-Type为文件类型,并设置Content-Disposition指定默认的文件名,然后将文件数据返回浏览器即可,具体代码如下:

三:举个代码例子

以 gin 框架为模板,做一个简单的文件反馈

func  downloadFileService(ctx *gin.Context) {
    arg := fileModel{}
    ctx.Bind(&arg)

// 这里设置基本的反馈头,"application/octet-stream" 为了适应多个类型的文件,如果是具体的类型就写相关类型即可
    ctx.Header("Content-Type", "application/octet-stream")

// 写入对应的文件名称
    ctx.Header("Content-Disposition", "attachment; filename="+arg.FileName)
    ctx.Header("Content-Transfer-Encoding", "binary")

// 打开需要反馈的文件流
    b, err := os.ReadFile(path.Join(s.defaultFileDir.DefaultAssetsPath, arg.FileName))
    if err != nil {
        response.JsonErr(ctx, err, nil)
        return
    }
    e := path.Ext(arg.FileName)
// ctx.Data的第二个参数直接从名称中获取,所以这里才是e[1:],具体的逻辑自己定
    ctx.Data(http.StatusOK, e[1:], b)
    response.JsonOK(ctx)
}

只要前端请求这个方法,就能直接下载文件了

四:前端代码:

这里用了最简单的一种,直接使用自带window的open打开,请求这个地址即可。需要加逻辑的就需要自己封装逻辑,根据自己业务自己判断。

window.open('http://socket1.cn/api/downfile?file_name=' + filename);
上一篇下一篇

猜你喜欢

热点阅读