Skip to content

RCTImageCache working incorrectly. #17647

@ghost

Description

Is this a bug report?

Yes

Have you read the Contributing Guidelines?

Yes

Environment

Environment:
OS: macOS Sierra 10.12.6
Node: 8.9.3
Yarn: Not Found
npm: 5.6.0
Watchman: 4.9.0
Xcode: Xcode 9.2 Build version 9C40b
Android Studio: 2.3 AI-162.4069837

Packages: (wanted => installed)
react: ^16.0.0 => 16.0.0
react-native: ^0.51.0 => 0.51.0

Steps to Reproduce

(Write your steps here:)
untitled
Precondition: images was saved in local before.

  1. Name images as 1,2,3,4 for easily tracking
  2. Display images in FlatList as Gif above (Image component must have same width and height)
  3. Change the name of image 4.jpg to 5.jpg and 3.jpg to 4.jpg

Expected Behavior

Image 3.jpg after rename to 4.jpg display correct image

Actual Behavior

I think RCTImageCache was fetched wrong image because of NSString *cacheKey = RCTCacheKeyForImage(url, size, scale, resizeMode, responseDate); line. In the example above. suppose data1 is 4.jpg and data2 is 3.jpg. so when we change 4.jpg to 5.jpg, we have cached data1 with file:///xxx/documents/downloads/4.jpg and file:///xxx/documents/downloads/4.jpg keys.(file:///xxx/documents/downloads/xxx.jpg is absolute path to image). Then when change 3.jpg to 4.jpg it will fetched data1 with file:///xxx/documents/downloads/4.jpg key (which was saved by another image before). So wrong image was fetched

I think the bug can be fixed if Image component support keyExtractor like FLatList for cache-key

Reproducible Demo

The instructions I have give in the give above.
(I'm sorry for my bad english)

Metadata

Metadata

Assignees

No one assigned

    Labels

    Ran CommandsOne of our bots successfully processed a command.StaleThere has been a lack of activity on this issue and it may be closed soon.

    Type

    No type

    Projects

    No projects

    Milestone

    No milestone

    Relationships

    None yet

    Development

    No branches or pull requests

    Issue actions