uni-app uni.getImageInfo无法获取webp图片的信息，返回结果getImageInfo:fail invalid

在使用 uni.getImageInfo 获取图片信息时，如果遇到无法获取 webp 图片信息并返回 getImageInfo:fail invalid 错误，可能是由于以下原因之一：

1. 平台支持问题：

   • uni.getImageInfo 在某些平台上可能不支持 webp 格式的图片。不同平台（如微信小程序、H5、App等）对图片格式的支持程度可能有所不同。例如，某些平台可能不支持 webp 格式，或者支持的版本较旧。

2. 图片链接问题：

   • 确保图片链接是有效的，并且可以在浏览器中直接打开。如果图片链接无效或无法访问，uni.getImageInfo 也会返回失败。

3. 图片格式问题：

   • 确保图片确实是 webp 格式，并且没有损坏。你可以尝试将图片转换为其他格式（如 png 或 jpg），然后再次尝试获取图片信息。

4. 网络问题：

   • 如果图片是从远程服务器加载的，确保网络连接正常，并且图片可以正常加载。

解决方案

1. 检查平台支持：

   • 查看 uni-app 官方文档，确认当前平台是否支持 webp 格式。如果不支持，考虑使用其他格式的图片。

2. 转换图片格式：

   • 如果平台不支持 webp，可以将图片转换为 png 或 jpg 格式，然后使用 uni.getImageInfo 获取信息。

3. 使用其他方法获取图片信息：

   • 如果 uni.getImageInfo 无法获取 webp 图片信息，可以考虑使用其他方法，例如在 H5 环境下使用 Image 对象来获取图片的宽高信息。

   const img = new Image();
   img.src = 'your-image-url.webp';
   img.onload = function() {
     console.log('Image width:', img.width);
     console.log('Image height:', img.height);
   };
   img.onerror = function() {
     console.error('Failed to load image');
   };
   

4. 检查图片链接：

   • 确保图片链接是有效的，并且可以在浏览器中直接打开。

5. 使用第三方库：

   • 如果需要处理 webp 格式的图片，可以考虑使用第三方库来处理图片信息。

示例代码

uni.getImageInfo({
  src: 'your-image-url.webp',
  success: function(res) {
    console.log('Image width:', res.width);
    console.log('Image height:', res.height);
  },
  fail: function(err) {
    console.error('Failed to get image info:', err);
  }
});