Мы хотим нарисовать изображение, которое включает в себя фоновое изображение и динамически генерируемый QR-код. Предполагается, что фоновое изображение является статическим ресурсом самого проекта, а QR-код динамически генерируется сервером, и они оба являются таковыми. не под тем же доменным именем.
Решение: перенаправьте все изображения на одно и то же доменное имя:
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}; {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); Canvas.toDataURL(); document.body.appendChild(nodeI)}Выше приведено все содержание этой статьи. Я надеюсь, что она будет полезна для изучения всеми. Я также надеюсь, что все поддержат сеть VeVb Wulin.