文件预览时避免暴漏文件服务器地址解决方案

一、背景

我们在做管理系统时避免不了要进行文件的预览和下载，但是有些文件是绝密的只限于预览，不能让下载，用户鼠标右击选择在新窗口打开该图片这时会暴漏文件服务器的地址。我们不希望暴漏文件服务器的地址，以防用户估计修改url查看不属于自己的文件。

二、原因

在做文件预览时后端直接文件服务保存文件的url地址返回给了前端，导致文件服务器url直接暴漏给前端

三、解决方案

前端处理思路如下，让后端返回二进制流，前端将文件流进行处理，生成一个临时的url地址供用户进行预览，这样就避免了url地址的暴漏

axios.get('后端返回文件流的url接口地址',{
       params:{
        id:文件id
       },
       responseType: 'blob',   //这里是声明期望返回的数据类型，为blob
    }).then(res => {
      const blob = new Blob([res], { type: "image/jpeg" })//必须指定类型  pdf为type: 'application/pdf'
       this.photoPath = window.URL.createObjectURL(blob);   //这里调用window的URL方法
      console.log(this.photoPath );
      window.open(this.photoPath)
    })
log打印结果：
blob:http://127.0.0.1/3458d892-c292-4d16-9ea8-3a8f94bb5fe6

完美解决 peace！！