前端打开后端返回的HTML格式的数据

前端打开后端返回的 HTML格式 的数据:

后端返回的数据格式如下示例:

 前端通过 js 方式处理(核心代码如下

            console.log('回调', path);    // path 是后端返回的 HTML 格式数据
            // 必须要存进localstorage,否则会报错,显示不完全
            window.localStorage.removeItem('callbackHTML')
            window.localStorage.setItem('callbackHTML', path)
            // 读取本地保存的html数据,使用新窗口打开
            var newWin = window.open('', '_blank')
            newWin.document.write(localStorage.getItem('callbackHTML'))
            // 关闭输出流
            newWin.document.close()

注:如果后端返回的是一个网址则不使用这个方式,可以使用 <iframe /> 标签在本地打开返回的网址:示例如下:

<iframe :src="urlPath" frameborder="0" width="100%" :style="{height: '100%'}" scrolling="auto"></iframe>

<iframe />  具体使用请参考

  • 0
    点赞
  • 4
    收藏
    觉得还不错? 一键收藏
  • 0
    评论
后端返回文件流后,前端可以通过以下几种方式实现文件下载导出: 1. 使用`<a>`标签的`download`属性:可以在前端创建一个`<a>`标签,将后端返回的文件流作为链接的`href`属性值,并设置`download`属性为文件名,这样点击该链接时,浏览器会自动下载文件。 ```html <a href="后端返回的文件流URL" download="文件名">点击下载</a> ``` 2. 使用`window.open()`方法:可以使用JavaScript的`window.open()`方法打开一个新的窗口,并将后端返回的文件流URL作为参数传递给该方法,浏览器会自动下载文件。 ```javascript window.open("后端返回的文件流URL"); ``` 3. 使用`XMLHttpRequest`对象:可以使用JavaScript的`XMLHttpRequest`对象发送GET请求,将后端返回的文件流作为响应内容,然后通过创建`Blob`对象和`URL.createObjectURL()`方法将文件流转换为可下载的URL,最后使用`<a>`标签的`download`属性进行下载。 ```javascript var xhr = new XMLHttpRequest(); xhr.open("GET", "后端返回的文件流URL", true); xhr.responseType = "blob"; xhr.onload = function() { if (xhr.status === 200) { var blob = xhr.response; var url = URL.createObjectURL(blob); var a = document.createElement("a"); a.href = url; a.download = "文件名"; a.click(); } }; xhr.send();``` 请注意,以上方法中的"后端返回的文件流URL"需要替换为实际的后端返回的文件流的URL,"文件名"需要替换为实际的文件名。

“相关推荐”对你有帮助么?

  • 非常没帮助
  • 没帮助
  • 一般
  • 有帮助
  • 非常有帮助
提交
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值