html2Canvas+jsPDF 下载PDF 遇到跨域的对象存储的图片无法显示

 

 

一、问题原因 

对象存储的域名和你网址的域名不一样,此时用Canvas相关插件 将DOM元素转化为PDF,就会出现跨域错误。

二、解决办法  两步

1. 图片元素上设置属性  crossorigin="anonymous"  支持原生img和eleme组件

 2. 存储桶设置资源跨域访问

阿里腾讯云为例:↓

阿里云OSS设置跨域访问-阿里云开发者社区

腾讯云OOS设置跨域访问


 

静待几分钟, 不是立即生效的!

本文来自互联网用户投稿,该文观点仅代表作者本人,不代表本站立场。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如若转载,请注明出处:/a/46350.html

如若内容造成侵权/违法违规/事实不符,请联系我们进行投诉反馈qq邮箱809451989@qq.com,一经查实,立即删除!

相关文章

Redis多级缓存

文章目录 多级缓存背景JVM进程缓存Caffeine案例分析安装MySQL导入SQL Lua语法变量与循环数据类型声明变量循环 函数与条件控制函数条件控制 实现多级缓存安装OpenResty安装opm工具目录结构配置Nginx的环境变量运行启动 快速入门反向代理流程OpenResty监听请求编写item.lua 请求…

2023河南萌新联赛第(三)场:郑州大学 F

把题中所给的式子进行展开,最终可以得到一个等比数列。运用等比数列求和公式即可。 相关知识点:欧拉降幂,逆元。 逆元的用处:因为求和公式需要去除分子,而大数除法去取模会丢失精度,所以可以采用求出分子…

【设计模式——学习笔记】23种设计模式——桥接模式Bridge(原理讲解+应用场景介绍+案例介绍+Java代码实现)

问题引入 现在对不同手机类型的不同品牌实现操作编程(比如:开机、关机、上网,打电话等),如图 【对应类图】 【分析】 扩展性问题(类爆炸),如果我们再增加手机的样式(旋转式),就需要增加各个品牌手机的类,同样如果我们…

C++第三方开发库matplotlib-cpp

Matplotlib-cpp是一个用于在C中绘制图表的开源库。它提供了与Python的Matplotlib库类似的功能,使得在C环境下进行数据可视化变得更加便捷。基于Matplotlib-cpp,我们可以使用各种绘图函数和样式选项来创建各种类型的图表,包括折线图、散点图、…

Qtday2作业

1. 头文件 widget.h #ifndef WIDGET_H #define WIDGET_H#include <QWidget> #include <QDebug> #include<QIcon> #include<QPushButton> #include<QLineEdit> #include<QLabel> #include<QMovie> class Widget : public QWidget…

【多线程带来的的风险-线程安全的问题的简单实例-线程不安全的原因】

文章目录 前言线程不安全的5大原因1. 抢占式执行和随机调度2. 多个线程同时修改一个变量(共享数据&#xff09;3. 修改操作不是原子性的4. 内存可见性5. 指令重排序 前言 什么是线程安全&#xff1f; 简单来说&#xff0c;如果多线程环境下代码运行的结果是符合我们预期的&am…

【SpringCloud Alibaba】(一)微服务介绍

此专栏内容皆来自于【冰河】的《SpringCloud Alibaba 实战》文档。 1. 专栏介绍 我们先来看看《SpringCloud Alibaba实战》专栏的整体结构吧&#xff0c;先上图 从上图&#xff0c;大家可以看到&#xff0c;专栏从整体上分为十个大的篇章&#xff0c;分别为 专栏设计、微服务…

macOS Ventura 13.5 (22G74) 正式版发布,ISO、IPSW、PKG 下载

macOS Ventura 13.5 (22G74) 正式版发布&#xff0c;ISO、IPSW、PKG 下载 本站下载的 macOS Ventura 软件包&#xff0c;既可以拖拽到 Applications&#xff08;应用程序&#xff09;下直接安装&#xff0c;也可以制作启动 U 盘安装&#xff0c;或者在虚拟机中启动安装。另外也…

全志F1C200S嵌入式驱动开发(GPIO输出)

【 声明:版权所有,欢迎转载,请勿用于商业用途。 联系信箱:feixiaoxing @163.com】 和v3s一样,f1c200s本身的外部引脚比较少。所以这个时候,不可避免地,很多引脚的功能就会重叠在一起。这种情况下,我们就要学会取舍了。比如说,如果是学习sd卡的时候,那么spi的…

阿里云NVIDIA A100 GPU云服务器性能详解及租用费用

阿里云GPU服务器租用费用表包括包年包月、一个小时收费以及学生GPU服务器租用费用&#xff0c;阿里云GPU计算卡包括NVIDIA V100计算卡、T4计算卡、A10计算卡和A100计算卡&#xff0c;GPU云服务器gn6i可享受3折&#xff0c;阿里云百科分享阿里云GPU服务器租用表、GPU一个小时多少…

拦截Bean使用之前各个时机的Spring组件

拦截Bean使用之前各个时机的Spring组件 之前使用过的BeanPostProcessor就是在Bean实例化之后&#xff0c;注入属性值之前的时机。 Spring Bean的生命周期本次演示的是在Bean实例化之前的时机&#xff0c;使用BeanFactoryPostProcessor进行验证&#xff0c;以及在加载Bean之前进…

最新Ai创作源码ChatGPT商用运营源码/支持GPT4.0+支持ai绘画+支持Mind思维导图生成

本系统使用Nestjs和Vue3框架技术&#xff0c;持续集成AI能力到本系统&#xff01; 支持GPT3模型、GPT4模型Midjourney专业绘画&#xff08;全自定义调参&#xff09;、Midjourney以图生图、Dall-E2绘画Mind思维导图生成应用工作台&#xff08;Prompt&#xff09;AI绘画广场自定…

STM32—CAN通信

文章目录 一、CAN通信简介1.1 CAN简介1.2 CAN协议特点1.3 CAN通信的帧类型1.4 数据帧结构1.5 CAN的位时序1.6 CAN的仲裁功能 二、STM32F1的CAN2.1 bxCAN简介2.2 bxCAN工作模式2.2.1 初始化模式2.2.2 正常模式2.2.3 睡眠模式2.2.4 静默模式2.2.5 环回模式 2.3 位时序和波特率 三…

leetCode刷题记录3-面试经典150题

文章目录 不要摆&#xff0c;没事干就刷题&#xff0c;只有好处&#xff0c;没有坏处&#xff0c;实在不行&#xff0c;看看竞赛题面试经典 150 题80. 删除有序数组中的重复项 II189. 轮转数组122. 买卖股票的最佳时机 II 不要摆&#xff0c;没事干就刷题&#xff0c;只有好处&…

阿里云部署 ChatGLM2-6B 与 langchain+ChatGLM

1.ChatGLM2-6B 部署 更新系统 apt-get update 安装git apt-get install git-lfs git init git lfs install 克隆 ChatGLM2-6B 源码 git clone https://github.com/THUDM/ChatGLM2-6B.git 克隆 chatglm2-6b 模型 #进入目录 cd ChatGLM2-6B #创建目录 mkdir model #进入目录 cd m…

安全攻击 --- XSS攻击

XSS跨站脚本攻击 &#xff08;1&#xff09;简介 OWASP TOP 10 之一&#xff0c;XSS被称为跨站脚本攻击&#xff08;Cross-Site-Scripting&#xff09;主要基于JavaScript&#xff08;JS&#xff09;完成攻击行为XSS通过精心构造JS代码注入到网页中&#xff0c;并由浏览器解释…

在nginx上部署nuxt项目

先安装Node.js 我安的18.17.0。 安装完成后&#xff0c;可以使用cmd&#xff0c;winr然cmd进入&#xff0c;测试是否安装成功。安装在哪个盘都可以测试。 测试 输入node -v 和 npm -v&#xff0c;&#xff08;中间有空格&#xff09;出现下图版本提示就是完成了NodeJS的安装…

前端开发实习总结参考范文

▼前端开发实习总结篇四 读了三年的大学&#xff0c;然而大多数人对本专业的认识还是不那么透彻&#xff0c;学的东西真正能够学以致用的东西很少&#xff0c;大家都抱怨没有实践的机会&#xff0c;在很多同学心里面对于本专业还是很茫然。直到即将毕业的时候才知道我们以前学…

【Linux后端服务器开发】HTTPS协议

目录 一、加密算法 二、中间人攻击 三、CA认证 一、加密算法 HTTPS协议是什么&#xff1f;HTTPS协议也是一个应用层协议&#xff0c;是在HTTP协议的基础上引入了一个加密层。 HTTP协议内容是按照文本的方式明文传输的&#xff0c;这就导致在传输过程中出现一些被篡改的情况…

ROS1ROS2之CmakeList.txt和package.xml用法详解

前言&#xff1a;目前还在学习ROS无人机框架中&#xff0c;&#xff0c;&#xff0c; 更多更新文章详见我的个人博客主页【前往】 文章目录 1. CMakeLists.txt与package.xml的作用2. 生成CMakeLists.txt2.1 ROS12.2 ROS2 3. CMakeLists.txt编写3.1 ROS13.2 ROS2 4. package.xml…