Невозможно отобразить изображение с s3 в React Native с помощью API-интерфейса Amplify Storage

Question

Я просто пытаюсь показать изображение из корзины s3, используя хранилище AWS Amplify и реагировать на него.Мой код следующий:

class App extends React.Component {

  state = { fileUrl: '' }

  componentDidMount() {
        Storage.get('vlad-tchompalov-450777-unsplash.jpg')
          .then(data => {
            console.log("data: ", data)
            this.setState({
              fileUrl: data
            })
          })
          .catch(err => {
            console.log("error fetching image", err)
          })
      }

  render() {
    return (
      <View style={styles.container}>
      { this.state.fileURL != '' && console.log('state: ', this.state.fileUrl) &&
        <Image source={{ uri: this.state.fileUrl }} style={{ width: 100, height: 100 }} />
      }
      </View>
    );
  }
}

Из console.log () я действительно получаю правильный URL-адрес фотографии (если я нажимаю на нее, я вижу фотографию), и она имеет https, так чтоЭто не проблема: console

Я не добавил уровень доступа к вызову API, поэтому по умолчанию используется значение public, что мне и нужно.

Iпроверил конфигурацию и разрешения и, кажется, все в порядке.

Спасибо!

Answer 1

console.log('state: ', this.state.fileUrl)

всегда представляет ложное значение, поэтому

<Image source={{ uri: this.state.fileUrl }} style={{ width: 100, height: 100 }} />

никогда не будет учитываться и добавляться в метод рендеринга.Удаление этого исправит ошибку.Просто как:

{ this.state.fileURL != '' && <Image ... /> }