Как сохранить PDF в файловой системе Android, а затем просмотреть PDF-response-native

Question

Я использую react-native-fs, и я пытаюсь сохранить base64 pdf-файла в моей файловой системе эмуляторов Android.

Получаю pdf-код с кодировкой base64 с сервера.
Я тогда декодировать base64 строку с линией: функция

var pdfBase64 = 'data:application/pdf;base64,'+base64Str; 

SAVEFILE()

saveFile(filename, pdfBase64){ 

    // create a path you want to write to 
    var path = RNFS.DocumentDirectoryPath + '/' + filename; 

    // write the file 
    RNFS.writeFile(path, base64Image, 'base64').then((success) => { 
     console.log('FILE WRITTEN!'); 
    }) 
    .catch((err) => { 
     console.log("SaveFile()", err.message); 
    }); 
} 

Ошибка
При попытке спасения pdfBase64 файла сохранения() функция ловит следующая погрешность:

bad base-64 

Вопрос
Может ли кто-нибудь сказать, где или что я делаю неправильно? Спасибо.

Answer 1

Для тех, у кого такая же проблема, вот решение.

Решение

реагируют-nativive-PDF-взгляд должен принять путь к файлу в pdf_base64.

Во-первых, я использовал react-native-fetch-blob для запроса pdf base64 с сервера. (Поскольку API RN fetch еще не поддерживает BLOB).

Также я обнаружил, что response-native-fetch-blob также имеет API-интерфейс FileSystem, который лучше документирован и более понятен, чем библиотека «response-native-fs». (Check out its FileSystem API documentation)

Прием base64 PDF и сохранить его в путь к файлу:

var RNFetchBlob = require('react-native-fetch-blob').default; 

const DocumentDir = RNFetchBlob.fs.dirs.DocumentDir; 

getPdfFromServer: function(uri_attachment, filename_attachment) { 
    return new Promise((RESOLVE, REJECT) => { 

     // Fetch attachment 
     RNFetchBlob.fetch('GET', config.apiRoot+'/app/'+uri_attachment) 
     .then((res) => { 

      let base64Str = res.data; 
      let pdfLocation = DocumentDir + '/' + filename_attachment; 

      RNFetchBlob.fs.writeFile(pdfLocation, pdf_base64Str, 'base64'); 
      RESOLVE(pdfLocation); 
     }) 
    }).catch((error) => { 
     // error handling 
     console.log("Error", error) 
    }); 
} 

Что я делаю неправильно было вместо сохранения pdf_base64Str на местоположение файла, как я сделал в приведенном выше примере. Я сохранял это следующим образом:

var pdf_base64= 'data:application/pdf;base64,'+pdf_base64Str; 

который был не прав.

Populate вид PDF с путем к файлу:

<PDFView 
    ref={(pdf)=>{this.pdfView = pdf;}} 
    src={pdfLocation} 
    style={styles.pdf} 
/> 

Answer 2

Существует новый пакет для обработки выборки данных (на основе react-native-fetch-blob) и отображение в формате PDF с помощью URL: react-native-pdf.