react-native-fast-image 8.15.0 → 8.16.0

package/README.md

@@ -146,6 +146,23 @@ Indicates the load order priority of an image. Images with `FastImage.priority.h
 
 ---
 
+### `source.cacheKey?: string`
+
+The key the image is cached under, instead of its uri. Use it for urls that change while the image stays the same, e.g. signed urls with a token or an expiry. Use something that identifies the image, and change it when the image changes (e.g. include a version or the time it was updated), or the old image keeps showing:
+
+```jsx
+<FastImage
+    source={{
+        uri: signedUrl,
+        cacheKey: `avatar-${user.id}-${user.avatarUpdatedAt}`,
+    }}
+/>
+```
+
+Not used with `cache: 'web'`, which follows the HTTP cache (keyed by url).
+
+---
+
 ### `defaultSource?: number`
 
 - An asset loaded with `require(...)`.

package/android/src/main/java/com/dylanvann/fastimage/FastImageKeyedGlideUrl.java

@@ -0,0 +1,37 @@
+package com.dylanvann.fastimage;
+
+import androidx.annotation.NonNull;
+import androidx.annotation.Nullable;
+
+import com.bumptech.glide.load.model.GlideUrl;
+import com.bumptech.glide.load.model.Headers;
+
+// A url cached under the source's `cacheKey` instead of the url. Glide keys
+// its disk cache by getCacheKey(), and its memory cache by equals() and
+// hashCode(), which also compare the headers: here they only use the key, so
+// a url whose token or headers change still hits both caches. The request
+// still uses the url and headers.
+class FastImageKeyedGlideUrl extends GlideUrl {
+    private final String mCacheKey;
+
+    FastImageKeyedGlideUrl(String url, Headers headers, @NonNull String cacheKey) {
+        super(url, headers);
+        mCacheKey = cacheKey;
+    }
+
+    @Override
+    public String getCacheKey() {
+        return mCacheKey;
+    }
+
+    @Override
+    public boolean equals(@Nullable Object other) {
+        return other instanceof FastImageKeyedGlideUrl
+                && mCacheKey.equals(((FastImageKeyedGlideUrl) other).mCacheKey);
+    }
+
+    @Override
+    public int hashCode() {
+        return mCacheKey.hashCode();
+    }
+}

package/android/src/main/java/com/dylanvann/fastimage/FastImageSource.java

@@ -124,9 +124,23 @@ public class FastImageSource extends ImageSource {
         mWebCache = webCache;
     }
 
+    // `cacheKey`: the key to cache the image under instead of its url.
+    @Nullable
+    private String mCacheKey = null;
+
+    void setCacheKey(@Nullable String cacheKey) {
+        mCacheKey = cacheKey == null || cacheKey.isEmpty() ? null : cacheKey;
+    }
+
     public GlideUrl getGlideUrl() {
-        return mWebCache
-                ? new FastImageWebGlideUrl(getUri().toString(), getHeaders())
-                : new GlideUrl(getUri().toString(), getHeaders());
+        String url = getUri().toString();
+        if (mWebCache) {
+            // Follows the HTTP cache, which is keyed by url.
+            return new FastImageWebGlideUrl(url, getHeaders());
+        }
+        if (mCacheKey != null) {
+            return new FastImageKeyedGlideUrl(url, getHeaders(), mCacheKey);
+        }
+        return new GlideUrl(url, getHeaders());
     }
 }

package/android/src/main/java/com/dylanvann/fastimage/FastImageViewConverter.java

@@ -19,6 +19,7 @@ import com.facebook.react.bridge.JSApplicationIllegalArgumentException;
 import com.facebook.react.bridge.NoSuchKeyException;
 import com.facebook.react.bridge.ReadableMap;
 import com.facebook.react.bridge.ReadableMapKeySetIterator;
+import com.facebook.react.bridge.ReadableType;
 
 import java.util.HashMap;
 import java.util.Map;
@@ -63,6 +64,9 @@ class FastImageViewConverter {
         if (source == null) return null;
         FastImageSource imageSource = new FastImageSource(context, source.getString("uri"), getHeaders(source));
         imageSource.setWebCache(getCacheControl(source) == FastImageCacheControl.WEB);
+        if (source.hasKey("cacheKey") && source.getType("cacheKey") == ReadableType.String) {
+            imageSource.setCacheKey(source.getString("cacheKey"));
+        }
         return imageSource;
     }
 

package/dist/index.cjs.js.flow

@@ -76,6 +76,7 @@ export type FastImageSource = {
     headers?: Object,
     priority?: Priorities,
     cache?: CacheControls,
+    cacheKey?: string,
 }
 
 export type FastImageProps = $ReadOnly<{|

package/dist/index.d.ts

@@ -27,6 +27,12 @@ export type Source = {
     };
     priority?: Priority;
     cache?: Cache;
+    /**
+     * The key the image is cached under, instead of its uri. For urls that
+     * change while the image stays the same, e.g. signed urls with a token or
+     * an expiry: use something stable, like the image's id.
+     */
+    cacheKey?: string;
 };
 export interface OnLoadEvent {
     nativeEvent: {

package/dist/index.js.flow

@@ -76,6 +76,7 @@ export type FastImageSource = {
     headers?: Object,
     priority?: Priorities,
     cache?: CacheControls,
+    cacheKey?: string,
 }
 
 export type FastImageProps = $ReadOnly<{|

package/ios/FastImage/FFFDownsampledImage.h

@@ -14,8 +14,8 @@
 + (NSURL*) loadURLForURL: (NSURL*)url;
 
 // Sets a load's context to decode the image for a box (in pixels) to cover
-// or fit in.
-+ (void) addToContext: (SDWebImageMutableContext*)context forURL: (NSURL*)url box: (CGSize)box cover: (BOOL)cover;
+// or fit in. `key` is the source's cache key (its url, or its cacheKey).
++ (void) addToContext: (SDWebImageMutableContext*)context forKey: (NSString*)key box: (CGSize)box cover: (BOOL)cover;
 
 // The size of the full image (in points, like UIImage's size) that an image
 // loaded this way was decoded from, for onLoad, or zero for other images.

package/ios/FastImage/FFFDownsampledImage.m

@@ -100,11 +100,11 @@ static CGSize FFFPixelSize(NSData* data) {
     return components.URL ?: url;
 }
 
-+ (void) addToContext: (SDWebImageMutableContext*)context forURL: (NSURL*)url box: (CGSize)box cover: (BOOL)cover {
++ (void) addToContext: (SDWebImageMutableContext*)context forKey: (NSString*)key box: (CGSize)box cover: (BOOL)cover {
     context[SDWebImageContextAnimatedImageClass] = [FFFDownsampledImage class];
-    // Cached under the url itself (see loadURLForURL:), so the disk cache
-    // keeps one download for every size and for loads that aren't downsampled.
-    NSString* key = url.absoluteString;
+    // Cached under the source's own key (not the url from loadURLForURL:),
+    // so the disk cache keeps one download for every size and for loads
+    // that aren't downsampled.
     context[SDWebImageContextCacheKeyFilter] = [SDWebImageCacheKeyFilter cacheKeyFilterWithBlock: ^NSString* (NSURL* _Nonnull loadURL) {
         return key;
     }];

package/ios/FastImage/FFFastImageSource.h

@@ -1,6 +1,7 @@
 #import <Foundation/Foundation.h>
 #import <UIKit/UIKit.h>
 #import <SDWebImage/SDWebImageDownloaderRequestModifier.h>
+#import <SDWebImage/SDWebImageCacheKeyFilter.h>
 
 typedef NS_ENUM(NSInteger, FFFPriority) {
     FFFPriorityLow,
@@ -27,6 +28,8 @@ typedef NS_ENUM(NSInteger, FFFCacheControl) {
 @property (nonatomic) NSDictionary *headers;
 // cache control mode
 @property (nonatomic) FFFCacheControl cacheControl;
+// The key to cache the image under instead of its url, or nil.
+@property (nonatomic, copy) NSString *cacheKey;
 
 - (instancetype)initWithURL:(NSURL *)url
                    priority:(FFFPriority)priority
@@ -36,4 +39,7 @@ typedef NS_ENUM(NSInteger, FFFCacheControl) {
 // Adds this source's headers to its image requests.
 - (SDWebImageDownloaderRequestModifier *)requestModifier;
 
+// Caches the image under cacheKey, or nil without one.
+- (SDWebImageCacheKeyFilter *)cacheKeyFilter;
+
 @end

package/ios/FastImage/FFFastImageSource.m

@@ -17,6 +17,18 @@
     return self;
 }
 
+- (SDWebImageCacheKeyFilter *)cacheKeyFilter
+{
+    NSString* cacheKey = _cacheKey;
+    // `cache: 'web'` follows the HTTP cache, which is keyed by url.
+    if (cacheKey.length == 0 || _cacheControl == FFFCacheControlWeb) {
+        return nil;
+    }
+    return [SDWebImageCacheKeyFilter cacheKeyFilterWithBlock: ^NSString* _Nullable (NSURL* _Nonnull url) {
+        return cacheKey;
+    }];
+}
+
 - (SDWebImageDownloaderRequestModifier *)requestModifier
 {
     NSDictionary* headers = _headers;

package/ios/FastImage/FFFastImageView.m

@@ -518,6 +518,7 @@ NSString *FFFErrorMessage(NSError *error)
 - (SDWebImageContext*) loadContext {
     SDWebImageMutableContext* context = [NSMutableDictionary dictionary];
     context[SDWebImageContextDownloadRequestModifier] = _source.requestModifier;
+    context[SDWebImageContextCacheKeyFilter] = _source.cacheKeyFilter;
     CGSize box = [self decodeBox];
     self.decodedBox = box;
     self.decodedCover = [self decodeCovers];
@@ -525,7 +526,8 @@ NSString *FFFErrorMessage(NSError *error)
         context[SDWebImageContextAnimatedImageClass] = [SDAnimatedImage class];
         return context;
     }
-    [FFFDownsampledImage addToContext: context forURL: _source.url box: box cover: self.decodedCover];
+    NSString* key = _source.cacheKeyFilter ? _source.cacheKey : _source.url.absoluteString;
+    [FFFDownsampledImage addToContext: context forKey: key box: box cover: self.decodedCover];
     return context;
 }
 

package/ios/FastImage/FFFastImageViewManager.m

@@ -37,6 +37,15 @@ RCT_REMAP_VIEW_PROPERTY(tintColor, imageColor, UIColor)
 static NSMutableArray<dispatch_block_t> *FFFPendingPreloads;
 static NSUInteger FFFPreloadsInFlight;
 
+// A preload's context: the source's headers and cache key.
+static SDWebImageMutableContext *FFFPreloadContext(FFFastImageSource *source)
+{
+    SDWebImageMutableContext *context = [NSMutableDictionary dictionary];
+    context[SDWebImageContextDownloadRequestModifier] = source.requestModifier;
+    context[SDWebImageContextCacheKeyFilter] = source.cacheKeyFilter;
+    return context;
+}
+
 static NSUInteger FFFPreloadLimit(void)
 {
     NSUInteger limit = [SDWebImagePrefetcher sharedImagePrefetcher].maxConcurrentPrefetchCount;
@@ -109,7 +118,7 @@ RCT_EXPORT_METHOD(preload:(nonnull NSArray<FFFastImageSource *> *)sources
                 __block BOOL done = NO;
                 [[SDWebImageManager sharedManager] loadImageWithURL:source.url
                                                             options:options
-                                                            context:@{SDWebImageContextDownloadRequestModifier: source.requestModifier}
+                                                            context:[FFFPreloadContext(source) copy]
                                                            progress:nil
                                                           completed:^(UIImage *image, NSData *data, NSError *error, SDImageCacheType cacheType, BOOL finished, NSURL *imageURL) {
                     if (!finished || done) {

package/ios/FastImage/RCTConvert+FFFastImage.m

@@ -47,6 +47,8 @@ RCT_ENUM_CONVERTER(FFFCacheControl, (@{
     FFFastImageSource *imageSource = [[FFFastImageSource alloc] initWithURL:uri priority:priority headers:headers cacheControl:cacheControl];
     id priorityJSON = json[@"priority"];
     imageSource.hasPriority = priorityJSON && priorityJSON != (id)kCFNull;
+    NSString *cacheKey = [self NSString:json[@"cacheKey"]];
+    imageSource.cacheKey = cacheKey.length > 0 ? cacheKey : nil;
     
     return imageSource;
 }

package/package.json

@@ -1,6 +1,6 @@
 {
     "name": "react-native-fast-image",
-    "version": "8.15.0",
+    "version": "8.16.0",
     "description": "🚩 FastImage, performant React Native image component.",
     "keywords": [
         "cache",