在 Nativescript App 中调整从 URL 接收到的图像大小时出错

Posted 2023-02-19

【中文标题】在 Nativescript App 中调整从 URL 接收到的图像大小时出错

【英文标题】：Getting Error when resize image received from URL in Nativescript App

【发布时间】：2021-06-19 12:19:27

【问题描述】：

从 URL 检索后，我尝试在 Angular+Nativescript 应用程序中调整图像大小，但收到以下错误：-

ERROR 错误：未捕获（承诺）：TypeError：imageSource.resize 是 不是函数。 （在 'imageSource.resize(100)' 中，'imageSource.resize' 是 未定义）

下面是代码：-

image.html

<Image (loaded)="onImageLoaded($event)" class="img-home-event" stretch="aspectFill">
 </Image> 

image.module.ts

onImageLoaded(args)
        
        let image = <Image>args.object;
        
        ImageSource.fromUrl("https://homepages.cae.wisc.edu/~ece533/images/airplane.png")
        .then((imageSource) =>
            image.imageSource = imageSource.resize(100);
            image.height = 150;
            image.width = 150;
        );        

请帮帮我。我需要在我的项目中实现调整大小功能。如果这不可能，请提供一些替代方案。

【问题讨论】：

从页面所在的完全相同Origin获取图片时，是否还会出现此问题？

是的。我的要求是从 Amazon S3 存储桶或互联网获取图像。这个问题还是来了。在我的情况下，页面的原点与图像的原点不同。

尝试调整图像而不是 imageSource 的大小。

你能告诉我动态调整图像大小的方法吗？我想说nativescript中是否有任何功能可以在显示之前调整图像大小。

检查您的控制台中是否有任何 CORS 错误消息。有时，网站上的资产可以直接从浏览器访问，但不能使用 AJAX。还有什么console.log(typeof imageSource)outputs？

【参考方案1】：

当我将我的项目升级到 NS7+ 时，这个错误得到了解决。后来我才知道，resize() 功能在 NativeScript 6.5.9 之后才可以使用