美文网首页
图片下载非同源跨域cross解决

图片下载非同源跨域cross解决

作者: litielongxx | 来源:发表于2020-10-28 18:26 被阅读0次

1图片下载和其他

图片的下载特殊一些,不像txt/xls其他格式,多会涉及跨域的问题。
1跨域服务端的同源
可以用canvans,或转base64,又或转blob都行。
非同源:
目前可以先试,下载图片时,禁用浏览器缓存,下载。

downloadImg (src, name) {
      var x = new XMLHttpRequest() // 禁止浏览器缓存;否则会报跨域的错误
      x.open('GET', src + '?t=' + new Date().getTime(), true)
      x.responseType = 'blob'
      x.onload = function (e) {
        var url = window.URL.createObjectURL(x.response)
        var a = document.createElement('a')
        a.href = url
        a.download = name
        a.click()
      }
      x.send()
    },

ps:跨域是浏览器本身的行为,为一种设计保护行为,解决一般后端设置cross或者其他都可以。

相关文章

  • 图片下载非同源跨域cross解决

    1图片下载和其他 图片的下载特殊一些,不像txt/xls其他格式,多会涉及跨域的问题。1跨域服务端的同源可以用ca...

  • 跨域问题的解决方案

    跨域(Cross Domain) 什么是跨域 先来说下 同源策略同源:在多个地址中,相同协议,相同域名,相同端口 ...

  • Flask-cors跨域

    什么是跨域 为什么要考虑跨域问题 同源策略 解决跨域问题 方式一: 使用 JSONP (一种非Ajax技术,需要前...

  • ajax跨域请求原理及解决方案分析

    什么是跨域(Cross-site)? 想了解跨域,必须先了解一下“同源策略(same origin policy)...

  • Nginx跨域

    Nginx解决跨域问题(CORS) CORS(Cross-Origin Resource Sharing) 跨域资...

  • 面试官:那有没遇到跨域问题,如何解决跨域?

    面试官:有没遇到跨域问题,如何解决跨域? 一、同源策略 谈到跨域问题,要先谈浏览器的同源策略。 二、解决方案 1、...

  • Web前后端跨域问题处理

    跨域问题有前台跨域(iframe间)和后台跨域。 前台跨域的解决方案可以采用跨域文档通讯(Cross domain...

  • H5跨域访问

    跨域访问是源于浏览器的同源策略而引申出来的概念 1、先了解什么是同源策略和跨域访问 同源策略、跨域解决方案 - R...

  • H5 知识点 - 收藏集 - 掘金

    跨域解决方案总结 - 前端 - 掘金为什么需要跨域? 就得先知道同源策略. 同源策略 同源策略是为了保证数据的安全...

  • js常见跨域解决方案

    参考:前端常见跨域解决方案(全) 跨域,什么是“域”? 这里就要先说说同源策略了。所谓同源是指"协议+域名+端口"...

网友评论

      本文标题:图片下载非同源跨域cross解决

      本文链接:https://www.haomeiwen.com/subject/foecvktx.html