当前位置:网站首页 > HTML与CSS基础 > 正文

html2canvas图片跨域问题(html2canvas scale)



环境是vue2 + python + django + nginx + uwsgi的线上服务环境。
最近在项目中发现一个关于html2canvas的问题,生成图片的时候莫名的出现跨域问题。就是页面有其他图片的时候,生成图片会报跨域问题,如下图:
注意:页面图片是直接从访问的django的静态文件夹下的图片的。如:http://xxxx/static/xxx.png
在这里插入图片描述
这包括已经给django添加了白名单,在django导入了中间件等操作,线下环境测试是正常的,线上生产环境就会出问题,使用了网上普遍的办法如下,都没有生效。



在html2canvas添加useCORS的方式,并且在img标签中添加crossorigin=“anonymous”如下:

 
  
 
  

上面标签中拼接了一个new Date().getTime(),这是为了防止浏览器缓存,每次都是重新拿图片,后面接了一个crossorigin=“anonymous”这个属性会导致图片拿不到,但是我这里会继续报跨域问题。

基于上面添加useCORS的配置,通过Nginx模块Http_Headers_Module来添加Access-Control-Allow-Origin允许的地址。

 
  

这些配置完成后,依然报跨域错误。

 
  
 
  
 到此这篇html2canvas图片跨域问题(html2canvas scale)的文章就介绍到这了,更多相关内容请继续浏览下面的相关推荐文章,希望大家都能在编程的领域有一番成就! 
  

                            

版权声明


相关文章:

  • css伪类选择器hover(css伪类选择器有哪几种?)2025-10-12 19:27:06
  • css伪类选择器和伪元素选择器(css 伪类选择器)2025-10-12 19:27:06
  • css获取第一个子元素2025-10-12 19:27:06
  • css实现长度过长时省略号显示2025-10-12 19:27:06
  • css让文本 英文字符自动换行—word-break2025-10-12 19:27:06
  • 跳转链接怎么弄(跳转链接html)2025-10-12 19:27:06
  • css伪类选择器除了第一第(css伪类选择器hover)2025-10-12 19:27:06
  • css2导弹(css-10导弹)2025-10-12 19:27:06
  • vs怎么用html生成css(vs如何创建html文件)2025-10-12 19:27:06
  • css4导弹(css-1导弹)2025-10-12 19:27:06
  • 全屏图片