canvas因为图片资源不在同一域名下而导致的跨域
建站知识 2021-07-02 23:00www.168986.cn长沙网站建设
我们要绘制一张图片,内容包括一张背景图和一个动态生成的二维码,前提是背景图是项目本身的静态资源,二维码是服务端动态生成的,二者不在同一域名下。
解决办法把所有图片都重定向同一个域名下
let count = 0;
let bgImg = document.creatElement('img');
let qrImg = document.creatElement('img');
bgImg.src = redirectUrl('x.png');
qrImg.src = redirectUrl('y.png');
[bgImg, qrImg].forEach((e) => {
e.onload = () => {
count ++;
if (count === 2) {
drawerImg(bgImg, qrImg);
}
}
})
function redirectUrl (url) {
return 'https://xxx/view?fileUrl=' + encodeURIComponent(url);
}
function drawerImg (imgContent, qrContent, scaleBy = 2) {
let {bgImgW, bgImgH} = {375, 800};
let {qrx, qry, qrw, qrh} = {20, 700, 50, 50};
let Canvas = document.createElement('canvas');
let ctx = Canvas.getContext("2d");
Canvas.width = bgImgW scaleBy;
Canvas.height= bgImgH scaleBy;
ctx.drawImage(imgContent, 0, 0, bgImgW scaleBy, bgImgH scaleBy);
ctx.drawImage(qrContent, qrx scaleBy, qry scaleBy, qrw scaleBy, qrh scaleBy);
let nodeI = document.createElement("img");
nodeI.src = Canvas.toDataURL();
document.body.appendChild(nodeI)
}
以上就是本文的全部内容,希望对大家的学习有所帮助,也希望大家多多支持狼蚁SEO。
长沙网站设计
- 中小企业SEO优化的技巧(从研究到外链建设,这
- 建站申请书 建站申请书范文
- 影响seo排名的因素有哪些(影响网站速度的因素
- SEO技巧url静态化是什么意思(附动态页面静态化
- 如何提升网站的百度快速收录排名(提升百度S
- 付费社群app 付费社群软件有哪些
- 常州网站开发公司推荐
- seo实战指导 pdf
- 如何快速恢复被降权的网站排名(排除5个影响因
- 新网站如何快速提高搜索引擎排名权重?新站S
- 广告云建站 广告资源发布平台
- 汕头建站前端模板
- 如何进行百度SEO分析?(提升百度排名的关键技
- 提高网站排名SEO的10个窍门(让您的网站在搜索引
- 如何优化网站排名关键词(提高网站排名的8种方
- 迁西个人网页设计制作软件