Реагируй на родной: скачай pdf файл с помощью rn-fetch-blob нажатием кнопки - PullRequest
0 голосов
/ 04 июля 2019

Я должен позволить пользователю загружать PDF-файл, когда он нажимает на кнопку, и я нахожу, что мне нужно использовать rn-fetch-blob вместо response-native-fetch-blob.В документации есть такой код:

const { config, fs } = RNFetchBlob
let DownloadDir = fs.dirs.DownloadDir // this is the Downloads directory.
let options = {
fileCache: true,
addAndroidDownloads : {
useDownloadManager : true, //uses the device's native download manager.
notification : true,
title : "Notification Title", // Title of download notification.
path: DownloadDir + "/me_"+ '.' + extension, // this is the path where your download file will be in
description : 'Downloading file.'
}
}
config(options)
.fetch('GET',"https://whatever_url_u _want/)
.then((res) => {
//console.log("Success");
})
.catch((err) => {console.log('error')}) // To execute when download cancelled and other errors
}

Я понятия не имею, что я могу с этим сделать!как использовать использовать его в TouchableOpacity onPress prop?Пожалуйста, кто-то может предоставить подробный пример

PS.Я вызываю API с методом POST и получаю ссылку на файл PDF.Я думаю

I have to set this link like that
    config(options)
    .fetch('GET',this.state.data.link)

Ответы [ 2 ]

0 голосов
/ 12 июля 2019

Я попробовал этот код:

  _downloadFile = () => {
    const { config, fs } = RNFetchBlob
    let DownloadDir = fs.dirs.DownloadDir
    let options = {
    fileCache: true,
    addAndroidDownloads : {
    useDownloadManager : true,
    notification : true,
    title : "MY FILE Title",
    path: DownloadDir + "/me_"+ '.' + 'pdf',
    description : 'Downloading file.'
    }
    }
    RNFetchBlob.config(options)
    .fetch('GET','http://www.pdf995.com/samples/pdf.pdf')
    .then((res) => {
    console.warn("Success");
    })
    .catch((err) => {console.log('error')})
 };

и когда я нажимаю на кнопку, у меня появляется уведомление с заголовком «МОЙ ФАЙЛ» в виде заголовка с таким сообщением: «Загрузка не выполнена»

0 голосов
/ 04 июля 2019
  1. Добавить ниже разрешений в AndroidManifest.xml
<uses-permission android:name="android.permission.READ_EXTERNAL_STORAGE" />
<uses-permission android:name="android.permission.WRITE_EXTERNAL_STORAGE" />
<uses-permission android:name="android.permission.DOWNLOAD_WITHOUT_NOTIFICATION" />
Чтобы использовать менеджер загрузок, добавьте ниже намеренное действие в AndroidManifest.xml
<intent-filter>
     <action android:name="android.intent.action.MAIN" />
     <category android:name="android.intent.category.LAUNCHER" />
     <action android:name="android.intent.action.DOWNLOAD_COMPLETE"/>                          
</intent-filter>
Импорт разрешений Android, оповещение от реагировать нативно (только для Android)
import {PermissionsAndroid, Alert} from "react-native";
Теперь в компоненте
actualDownload = () => {
   const { dirs } = RNFetchBlob.fs;
  RNFetchBlob.config({
    fileCache: true,
    addAndroidDownloads: {
    useDownloadManager: true,
    notification: true,
    mediaScannable: true,
    title: `test.pdf`,
    path: `${dirs.DownloadDir}/test.pdf`,
    },
  })
    .fetch('GET', 'http://www.africau.edu/images/default/sample.pdf', {})
    .then((res) => {
      console.log('The file saved to ', res.path());
    })
    .catch((e) => {
      console.log(e)
    });
}

downloadFile = () => {
  try {
      const granted = await PermissionsAndroid.request(PermissionsAndroid.PERMISSIONS.WRITE_EXTERNAL_STORAGE);
      if (granted === PermissionsAndroid.RESULTS.GRANTED) {
        this.actualDownload();
      } else {
        Alert.alert('Permission Denied!', 'You need to give storage permission to download the file');
      }
    } catch (err) {
      console.warn(err);
    } 
}

render(){
  <TouchableOpacity onPress={this.downloadFile}>
    <Text>Download!!!</Text>
  </TouchableOpacity>
}

ВНИМАНИЕ: Вам нужно запросить разрешение на хранение для Android 6 или выше во время выполнения

...