VUE前端处理后端接口返回octet-stream 并展示在前端界面 

后端返回的链接放在浏览器里直接下载了,要求展示在前端
这个后端返回的url链接(格式是Content-Type:application/octet-stream;charset=UTF-8)不能直接用在img里 需要做一下处理

 function fetchImage() {
            const url = originUrl //后端返回地址
            axios({
                method: 'get',
                url: url,
                responseType: 'blob', // 重要:设置响应类型为blob
            })
            .then(response => {
                // 创建一个Blob URL
                this.imageUrl = URL.createObjectURL(new Blob([response.data]));
            })
            .catch(error => {
                console.error('Fetch error:', error);
            });
        }

——————————————————————————————

async function rawDataDownload(node) {
  try {
    const analyzeFilePath = node.analyzeFilePath || {};
    if (!analyzeFilePath) {
      return ElMessage.warning("暂不支持下载!");
    }
    ElMessage.info("正在下载数据,请稍后...");
    const response = await downAnalysisProductData(analyzeFilePath);
    if (response.data.size !== 0) {
      const link = document.createElement("a");
      const fileName =
        analyzeFilePath.split("/").pop() || "analyzeFilePath.tar.gz";
      link.href = URL.createObjectURL(response.data);
      link.download = fileName;
      link.click();
      URL.revokeObjectURL(link.href);
    }
  } catch {
    ElMessage.error("下载失败!");
  }
}
最后编辑于
©著作权归作者所有,转载或内容合作请联系作者
平台声明:文章内容(如有图片或视频亦包括在内)由作者上传并发布,文章内容仅代表作者本人观点,简书系信息发布平台,仅提供信息存储服务。

推荐阅读更多精彩内容