如何摆脱污染的帆布 混乱？

Question

好的，我有一个codeigniter应用程序。现在在第1页，我有一个ajax，从page2获取一个充满了谷歌云cdn图像的html内容，然后将内容附加到div。我正在使用html2canvas将div内容转换为page1上的画布。现在很明显，第1页的画布被污染了。我的问题是如何让toDataUrl工作！需要快照画布。

这是我到目前为止所尝试的：

1. 添加了一个代理（两个php n js）与这样的html2canvas ..它帮助我摆脱了html2canvas无法从cdn-加载图像的问题

   html2canvas(div_content,{
               proxy: "proxy.js",
               useCORS: true,allowTaint: true}).then(function(canvas) { 
                                                 var img=canvas.toDataurl(); 
                                                     });

2. 尝试在两个控制器构造函数上添加跨源头文件，这两个控制器构造函数在下面的两个方向上提供page1和page2但是没有用 I.

   header("Access-Control-Allow-Methods: GET, OPTIONS");
       header("Access-Control-Allow-Headers: Content-Type, Content-Length, Accept-Encoding");

   II。 $this->output->set_header('Access-Control-Allow-Origin: *');

P.S：请不要提供在本地存储中下载图像的解决方案，并在第2页上使用它们，因为我使用的是Google App Engine标准，我只能在存储桶中写入/存储文件！

Answer 1

由于时间不够，我不得不实施一个非常明显的快速解决方案。由于我没有使用js加载所有图像元素后cross-origin设置为anonymous的奢侈品，而不是使用来自cdn源的图像，我将它们全部转换为base64编码数据url。如果有人能为此问题提供经过测试的解决方案，请稍后再做。但如果有人匆忙，那么这是一个快速的解决方案。

<img src="<?php echo 'data:image/png;base64,'.base64_encode(file_get_contents(<cdn-img-link>));?>">

P.S：我的所有图像都是png类型