update app version image gone

[aofeng2009]

When i cover install my app, I found many images gone. On my last version '1.3.5' everything is ok.

import { CachedImage } from 'react-native-cached-image'
....
<CachedImage source={{uri: imageurl}} style={{width:screenWidth, height:screenHeight}}></CachedImage>

[kfiroo]

@aofeng2009 Hey, I'm not sure I understand. Can you provide more info?

[ovaris]

Try clearing the cache, I had similar problem

[aofeng2009]

@ovaris But when we make an update ,we should not clear the cache,It's useful to our app. I dont know if this library cached image's name by app version ? @kfiroo

[tavriaforever]

+1 images gone. Users couldn`t clear cache every time. Any ideas?

[tavriaforever]

What happens in my app after update. Component start to found image in a right directories, found exist image but path is incorrect.

source: https://website_cdn_host.com/n_files/24/11/10000x300/foto_avtotsentra_0x0.jpg

[ovaris]

We also experienced randomly disappearing images after upgrade, so for now I changed our codebase to use Images until things cool down

[tavriaforever]

I fixed it by additional code, I added callback to onError on CachedImage and if internet is available – try to reload image. It works, but seem it is a little bit hack.

import React, { PureComponent } from 'react';
import PropTypes from 'prop-types';

// components
import { Alert, NetInfo } from 'react-native';
import { CachedImage, ImageCacheManager } from 'react-native-cached-image';

export default class Imager extends PureComponent {
  static propTypes = {
    source: PropTypes.shape({
      uri: PropTypes.string.isRequired,
    }).isRequired,
  }

  constructor(props) {
    super(props);

    this.state = {
      imagePath: this.props.source.uri,
    };
  }

  getImageCacheManager = () => {
    if (!this.imageCacheManager) {
      this.imageCacheManager = ImageCacheManager();
    }

    return this.imageCacheManager;
  }

  onError = () => {
    console.log('== Imager Error, try to reload ==');
    const { source: { uri } } = this.props;

    NetInfo.isConnected.fetch().then(isConnected => {
      if (!isConnected) {
        setTimeout(() => Alert.alert('Отсутствует интернет соединение'), 100);
        return;
      }

      this.getImageCacheManager().deleteUrl(uri)
        .then(() => {
          console.log('delete url from cache');
          this.getImageCacheManager()
            .downloadAndCacheUrl(uri)
            .then(cachedImagePath => {
              console.log('== Imager reload ==');
              this.setState({
                imagePath: cachedImagePath,
              });
            });
        });
    });
  }

  render () {
    console.log('== Imager ==');

    return (
      <CachedImage
        {...this.props}
        source={{ uri: this.state.imagePath }}
        onError={this.onError}
      >{this.props.children}</CachedImage>
    );
  }
}

[kfiroo]

@ovaris @aofeng2009 @tavriaforever Hey guys, I'd really like to get to the bottom of this, I'll need your help with some info.

With the new version we introduced a cache manager with cache-policies and cached urls expirations. Previously a url was present in the cache if there was a file in its corresponding file path location, as calculated by the code. Now, a url is present in the cache if the cacheableUrl is found in the cache manager (MemoryCache by default`).

This means that all urls would be re-downloaded and added to the new cache system, so I don't see why things shouldn't work smoothly, just as a fresh install would.

If you have any more info or a simple use-case that reproduces the issue it would be of great help!

Thanks

[keske]

Hello there,

After update the module I had the same issue. I've removed my application from simulator (iOS) and from the device (iPhone) re-built it and now all images show fine.

[aofeng2009]

@kfiroo After debuging I found the problem caused by new memory cache feature. We know that when freshing install iOS app, the sandbox path of our app maybe changed. But now here's code still used the last sandbox path as image path. I make a PR https://github.com/kfiroo/react-native-cached-image/pull/91. I do not know if it is designed correctly .Please check. Thank you. @tavriaforever @ovaris @keske

[augustbjornberg]

What is the status on this and #91 ? Thanks for the update @aofeng2009 .

Package is currently broken, i can't push my updated app to the app store, because i know my users images wont load if they install the update.

Images are cached and retrieved successfully on first install, no matter how many launches. Any install after that, no matter the version or build wont render a single image, since i preloaded them all in the previous install.

[kozillla]

Hello there,

I am experiencing the same issue. If i upgrade (IOS) my app version, all images are gone. Restarting app do not help.Only way to see them back is to delete and reinstall app, which might be quite annoying for users in prod environment.

[aofeng2009]

@augustbjornberg I was waiting for kfiroo checking my request。

[kfiroo]

@aofeng2009 @kozillla @augustbjornberg @keske Hey all, Sorry I'm not responsive, currently in Mexico heading to Belize so internet (and time in front of a computer) is not a common thing :)

I promise I'll try to take a look at the PR and provide a fix in the following week or so.

Thanks for your patience

[SteffeyDev]

Any update on fix for this? @tavriaforever's fix works sometimes but not consistently for me

[chrusart]

I put my two cents in PR #91 :)

[chrusart]

@SteffeyDev , @tavriaforever is really not a resolution for this issue, problem is deeper in the cached-image library, internet connection errors have nothing to do here. It works only because when internet is back and url cache is deleted (which was wrong after app id changed), new one is created with correct app id and file downloaded again, but the file is there, just path is wrong.

[kfiroo]

Is this resolved by https://github.com/kfiroo/react-native-cached-image/pull/97?

[tavriaforever]

I will check it tomorrow

[tavriaforever]

I added into my package.json last commit in #97

"react-native-cached-image": "github:flatfox-ag/react-native-cached-image#d8e1ddd5d1f5cc3213457a05d4ef74c4ec4ea959",

and now bug is gone! 🎉 It`s great, thanks a lot colleagues!

[kfiroo]

@tavriaforever Awesome :) I published v1.4.2 with the fix