无法在React Native中下载和显示受保护的图像

时间:2018-12-19 15:01:17

标签: react-native expo

我有图像成分:

export default class ImageComponent extends React.Component {
  state = {
      url: null
    }

  componentDidMount = async () => {
     let url = 'http://url/files/e8ffd6c6-dd38-cbda-3fd9-e57aee392f8e';
     let name = shorthash.unique(url)
     let localPath = `${FileSystem.documentDirectory}${name}`
     Expo.FileSystem.deleteAsync(localPath)
     localImage = await FileSystem.getInfoAsync(localPath);
     if (localImage.exists) {
        this.setState({
          url: localPath
        })
     } else {
       let options = {
        headers: {
            Authorization: 'Bearer 1374fae9-a369-4f85-8e01-01e739d25eb9'
          }
        }
       let newImage = await FileSystem.downloadAsync(url, localPath, options);
       this.setState({
         url: newImage.uri
       })
     }
  }

  render() {
    return (
      <View style={styles.viewStyle}>
        <Image
          source={{ uri: this.state.url }}
          style={ styles.image }
        />
        </View>
    );
  }
}

如果图像未使用授权标头保护,则此代码有效,如果我放置一些图像url而不是http://url/files/e8ffd6c6-dd38-cbda-3fd9-e57aee392f8e 例如https://wallpaperbrowse.com/media/images/750814.jpg 该图像显示正确,但如果我尝试获取受保护的图像,则带有授权标头的图像将不会显示。 我认为图像可能存储不正确,但是我无法对其进行检查。

image.uri是: file:///data/user/0/host.exp.exponent/files/ExperienceData/%2540anonymous%252Fvideo-player-f6054981-2034-43a8-a72e-cf83236391ff/15lTjna8-a72e-cf83236391ff/15lTjn

我不知道如何访问此文件。

我感到无助,我也不知道如何检查为什么不起作用

0 个答案:

没有答案