Question

这是当前代码：

toBase64(url, callback, outputFormat){
  var img = new Image();
  img.crossOrigin = 'Anonymous';
  img.onload = function(){
    var canvas = document.createElement('CANVAS');
    var ctx = canvas.getContext('2d');
    var dataURL;
    canvas.height = this.height;
    canvas.width = this.width;
    ctx.drawImage(this, 0, 0);
    dataURL = canvas.toDataURL(outputFormat);
    callback(dataURL);
    canvas = null; 
  };
  img.src = url;
}

我找不到通过CORS错误检索外部图像的方法此外，我在我的NodeJS服务器中使用x-ray，它能够检索相同的图像。我假设，这意味着也可以在客户端检查CORS错误。

Answer 1

不幸的是，CORS限制特别适用于网页。您的服务器不会遇到CORS错误，因为它存在于您可以控制计算机并且是受信任的用户的世界中。浏览器中的网页是一个不同的故事。它们完全受浏览器的授权，可以批准和促进任何网络使用。

也就是说，有许多着名的方法可以绕过CORS，例如通过利用脚本标签提出的更自由的限制。但是，几乎所有这些都只涉及GET请求，所以你可能会运气不好。

我的建议是将您的服务器用作一种代理。在您通过自己的服务器路由请求和响应的位置创建特殊端点，您将从根本上逃脱CORS。它给你的服务器带来了更大的压力，但我之前做过这件事并且效果很好。

如何在客户端WebApp上获取外部映像并将其编码为base64？

1 个答案: