Javascript 否'；访问控制允许原点'；使用htmlToImage时，请求的资源上存在标头

我正在尝试使用htmlToImage方法，但显示错误“获取/aws图像url/的访问权限”“起源”http://localhost:4200'已被CORS策略阻止：请求的资源上不存在'Access Control Allow Origin'标头。如果不透明响应满足您的需要，请将请求的模式设置为“无cors”，以获取禁用cors的资源。“

我在

img

标记中使用的图像url来自aws s3 bucket。在aws s3上，我们已经配置了CORS

允许的来源为“*”

允许的标题为“*”

注:

这在firefox浏览器中运行良好，但在chrome浏览器和Opera浏览器中不起作用

当我在浏览器选项卡中打开genrated base64时，图像不会出现。只有空白图像出现

我的html代码是：

<div id="editedimage">
   <img class="img-style" src="<imgUrl>" alt="image"> 
<div>

    var node = document.getElementById('editedimage');
    htmlToImage.toPng(node)
      .then((dataUrl) => {
        console.log("url", dataUrl);
      .catch((error) => {
      console.error("error", error);
      });

团队，帮帮我。

---

提前感谢。

如果要显示base 64图像，需要先清理url，然后才能在模板中使用它

import { DomSanitizer } from '@angular/platform-browser';

constructor( private sanitizer: DomSanitizer, .... ) {
    this.displayImage = this.sanitizer.bypassSecurityTrustUrl("data:Image/*;base64,"+imageData);
}