React Native Image Cache忽略图像URL的查询参数

Question

在我们的本机项目中，我们获得了图像网址，并在图像网址后附加了签名密钥。像http://my_bucket.s3.amazon.com/my_profile.jpg?signing_key=I_am_changeable_every_time。

我们将以上网址显示如下：

<ImageView source={{ uri: photo.uri }} />

我们希望反应原生图像组件可以为我们处理图像缓存。虽然反应原生图像组件每次都会加载图像。一个可能的原因是反应原生图像组件实际上没有做任何缓存。

然后我们试图找到一些外部react-image-cache library。

但正如我的理解，几乎所有图像缓存库都将整个图像URL视为缓存键。如果我们的图像有一个随时间变化的signing_key参数，我们该怎么办？

我们曾考虑使用image_path而不是image_full_url或业务上下文中的image_id作为缓存键。虽然我们没有找到任何可以给我们这种能力的图书馆。

我的问题是：我们如何处理可更改的图像url缓存，是否有您推荐的库？

谢谢！

Answer 1

试试react-native-cached-image。您可以告诉它忽略查询参数。

type ImageCacheManagerOptions = {
  headers: PropTypes.object,                      // an object to be used as the headers when sending the request for the url. default {}

  ttl: PropTypes.number,                          // the number of seconds each url will stay in the cache. default 2 weeks

  useQueryParamsInCacheKey: PropTypes.oneOfType([ // when handling a URL with query params, this indicates how it should be treated:
    PropTypes.bool,                               // if a bool value is given the whole query string will be used / ignored
    PropTypes.arrayOf(PropTypes.string)           // if an array of strings is given, only these keys will be taken from the query string.
  ]),                                             // default false

  cacheLocation: PropTypes.string,                // the path to the root of the cache folder. default the device cache dir 

  allowSelfSignedSSL: PropTypes.bool,             // true to allow self signed SSL URLs to be downloaded. default false
};