Twilio可编程聊天中的图像CORS问题

时间:2018-09-18 06:23:18

标签: javascript image twilio twilio-programmable-chat

我们正在Web应用程序,iOS和Android设备中使用可编程聊天。我们增加了在上述三个平台上上传图像的功能,并遵循Twilio文档中提供的方法。当我们尝试使用JS image.onload 函数在弹出窗口中打开Web应用程序中的图像以获取图像高度和宽度时,会引发CORS错误。 这是图片网址-https://media.us1.twilio.com/MEd2423094d30b8d7950684ea7d328b717?Expires=1537251160&Signature=mi6nRldhnyDlDp1FepiGhaB6QCBx1FDlMFkE43vI81mnkOvtiPsMnRyO~ZRj1KdidzPYTMwlpMEobqkyysC6esfgfes2taaZVGepeyJpKdBcF4nZngAr08FQNqCWrUhSJHUBFif603EdEw-XbYfKVJPt5qK-KpmG5lBm5aMS15UWCPLSSYNQ1z-1IK4OumrSjbB3fQRICnktmBBL9ZOnnZk8gJfLZsSDbaoQUDGErwETXj3bTfskf5D10jFkyBQX8YRJo5O-nFWT6E70bf9nYJg2eRkR9XxqVqwRfEYwDWB9t8p~xFNwpUvbQAwx-uV9jFT9l56Z1ms4wP2GSUNfSQ__&Key-Pair-Id=APKAJWF6YVTMIIYOF3AA

当我尝试使用画布方法将图像URL转换为base64日期

var imgUrl = 'https://media.us1.twilio.com/MEd2423094d30b8d7950684ea7d328b717?Expires=1537251160&Signature=mi6nRldhnyDlDp1FepiGhaB6QCBx1FDlMFkE43vI81mnkOvtiPsMnRyO~ZRj1KdidzPYTMwlpMEobqkyysC6esfgfes2taaZVGepeyJpKdBcF4nZngAr08FQNqCWrUhSJHUBFif603EdEw-XbYfKVJPt5qK-KpmG5lBm5aMS15UWCPLSSYNQ1z-1IK4OumrSjbB3fQRICnktmBBL9ZOnnZk8gJfLZsSDbaoQUDGErwETXj3bTfskf5D10jFkyBQX8YRJo5O-nFWT6E70bf9nYJg2eRkR9XxqVqwRfEYwDWB9t8p~xFNwpUvbQAwx-uV9jFT9l56Z1ms4wP2GSUNfSQ__&Key-Pair-Id=APKAJWF6YVTMIIYOF3AA'
var img = new Image();
img.crossOrigin = "Anonymous";
   img.onload = function(){
    var canvas = document.createElement("canvas");
    canvas.width =this.width;
    canvas.height =this.height;
    var ctx = canvas.getContext("2d");
    ctx.drawImage(this, 0, 0);
    var ansImgDataURL = canvas.toDataURL("image/jpeg",1.0);
    console.log(ansImgDataURL);
   };
img.src = imgUrl;

我得到了 DOMException:无法在'HTMLCanvasElement'上执行'toDataURL':可能无法导出污染的画布。

最终,我希望从图片网址获取图片的base64数据。
有人可以帮我吗?

谢谢, 桑卡尔。

0 个答案:

没有答案