.NET MAUI中如何通过Google Book API显示书籍缩略图？

以下是几个可行的排查和解决步骤：

• 验证图片URL有效性
  把拿到的缩略图链接直接在浏览器打开，确认图片能正常加载。如果浏览器里也打不开，说明API返回的URL本身存在问题，需要检查API请求参数或返回数据的解析逻辑。

• 处理HTTP协议的平台限制
  你的图片链接使用HTTP协议，而iOS和Android默认会阻止非HTTPS的网络请求，需要在项目配置中允许HTTP请求：

  • Android：在AndroidManifest.xml的<application>标签中添加android:usesCleartextTraffic="true"
  • iOS：在Info.plist中添加NSAppTransportSecurity字典，将NSAllowsArbitraryLoads设置为true

• 使用UriImageSource显式绑定
  直接绑定字符串URL可能存在解析问题，建议在XAML中显式使用UriImageSource，明确加载规则同时开启缓存：

  <Image>
      <Image.Source>
          <UriImageSource Uri="{Binding ImageUrl}" 
                          CacheValidity="1.0:0:0" 
                          CachingEnabled="True"/>
      </Image.Source>
  </Image>
  

• 确认绑定属性的正确性
  确保数据模型中ImageUrl属性为公共可读，若需动态更新，模型类需实现INotifyPropertyChanged接口：

  public class BookItem : INotifyPropertyChanged
  {
      private string _imageUrl;
      public string ImageUrl
      {
          get => _imageUrl;
          set
          {
              _imageUrl = value;
              OnPropertyChanged();
          }
      }
  
      public event PropertyChangedEventHandler PropertyChanged;
      private void OnPropertyChanged([CallerMemberName] string propertyName = null)
      {
          PropertyChanged?.Invoke(this, new PropertyChangedEventArgs(propertyName));
      }
  }
  

• 添加错误处理排查问题
  给Image控件绑定Error事件，查看加载失败的具体原因：

  <Image Source="{Binding ImageUrl}" 
         Error="Image_OnError"/>
  

  后台代码打印错误信息：

  private void Image_OnError(object sender, ImageErrorEventArgs e)
  {
      Console.WriteLine($"图片加载失败: {e.Message}");
  }
  

内容的提问来源于stack exchange，提问作者Johan