1

我有一个 react-native 项目,有时我需要更新我的资产,我在 app.js 附近的项目根目录中有一个“app/assets”文件夹,我安装了“react-native-fetch-blob”来下载文件和还使用它的文件系统 api 将其写入我的“资产”文件夹但我无法将其保存在我的文件夹中我只能使用我不知道它在哪里的“RNFetchBlob.fs.dirs.DocumentDir”而且我不能在我的代码,如何将下载的文件完全写入我的“资产”文件夹中?这是我的代码:

import RNFetchBlob from 'rn-fetch-blob'

type Props = {};
export default class App extends Component<Props> {

  constructor(){
    super();
    this.state = {
        download : 'not yet'
    }
  }

  componentDidMount(){
    this._testDownload();
  }
  _testDownload = () => {
    RNFetchBlob.fetch('GET', 'https://www.gstatic.com/webp/gallery3/1.png', {
    Authorization : 'Bearer eyJhbGciOiJIUzI1NiIsInR5cCI6IkpXVCJ9.eyJleHAiOjE1NzIwMDY4MDEsInVpZCI6Mjk5LCJ1c2VybmFtZSI6Imd1ZXN0XzM5MjQ4NDUiLCJlbWFpbCI6IiIsInJvbGVzIjpbIlVTRVIiXX0.gQ_Gqehx3tcWYI0C5CGmpaTfT33t_TPCKbuIYYOqVBU',
    'Content-Type' : 'octet-stream',
    // more headers  ..
  })
  .then((res) => {
    let status = res.info().status;
    console.log('status' , status)
    if(status == 200) {

      // the conversion is done in native code
      let base64Str = res.base64()     
      RNFetchBlob.fs.writeFile(`${RNFetchBlob.fs.dirs.DocumentDir}/app/assets/1.png`, base64Str, 'base64')
              .then(()=>{
                console.log('here check')
              }).catch(err => console.log('err', err))      
    } else {
      // handle other status codes
    }
  })
  // Something went wrong:
  .catch((errorMessage, statusCode) => {
    // error handling
  })
  }

  render() {
    return (
      <View style={styles.container}>
        <Text style={styles.welcome}>Welcome to React Native!</Text>
        <Text style={styles.instructions}>To get started, edit App.js</Text>
        <Text style={styles.instructions}>{this.state.download}</Text>
      </View>
    );
  }
}
4

1 回答 1

1
Use this code for download image using RNFetchBlob 
more information visit 

https://www.npmjs.com/package/rn-fetch-blob?activeTab=dependents

import RNFetchBlob from 'rn-fetch-blob'

type Props = {};
export default class App extends Component<Props> {

  constructor(){
    super();
    this.state = {
        download : ''
    }
  }

  componentDidMount(){
    this._testDownload();
  }
  _testDownload = () => {

        PermissionsAndroid.request(
          PermissionsAndroid.PERMISSIONS.WRITE_EXTERNAL_STORAGE,
          {
            title: "Storage",
            message: "This app would like to store some files on your phone"
          }
        )
          .then(() => {
            let dirs =
              `/storage/emulated/0/app/assets/`


              RNFetchBlob.config({
                path: dirs + '/1.png',
                fileCache: true
              })
                .fetch("GET",' https://www.gstatic.com/webp/gallery3/1.png', {})
                .then(res => {
                  console.log("res.data============================", res.data);

                })
                .catch(err => {
                  console.log("Error ", err);
                });
            }

          })


  }

  render() {
    return (
      <View style={styles.container}>
        <Text style={styles.welcome}>Welcome to React Native!</Text>
        <Text style={styles.instructions}>To get started, edit App.js</Text>
        <Text style={styles.instructions}>{this.state.download}</Text>
      </View>
    );
  }
}
于 2019-08-26T07:31:20.973 回答