Получить PDF из массива в React Native - PullRequest
Новая
       56

Получить PDF из массива в React Native

0 голосов
/ 18 октября 2018

Веб-сокет на моем сервере отправляет моему реактивному приложению массив буферов PDF, и оттуда я пытаюсь выяснить, как отобразить PDF.Я чувствую, что rn-fetch-blob будет ответом, но я не уверен, что и куда.В браузере я только что сделал это: 

const pdfBlob = new Blob([e.data], {type: "application/pdf"})
const url = URL.createObjectURL(pdfBlob);
pdfViewer.setAttribute("src", url)

Но React Native не поддерживает создание таких BLOB-объектов.Моей следующей попыткой было сделать что-то вроде этого: 

fetch(e.data, {
  responseType: "arraybuffer"
})
  .then(res => res.arrayBuffer())
  .then(res => res.blob())
  .then(pdfBlob => {
    const url = URL.createObjectURL(pdfBlob);
    /** ... */
  })
  .catch(e => console.error(e));

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

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

1 Ответ

0 голосов
/ 31 мая 2019

Ммм, это было некоторое время назад, поэтому я не очень уверен в своем собственном коде или если он уже устарел.Я помню, как читал что-то о том, что RNFetchBlob не нужен в более новых версиях React, но вот как я это сделал: 

import RNFetchBlob from "rn-fetch-blob";
const { fs } = RNFetchBlob;

connection.onmessage = e => {
  if (typeof e.data === "string") {
    /* not array buffer */
  } else if (e.data.constructor === ArrayBuffer) {
    const base64 = binaryToBase64(e.data);
    const filePath = `${fs.dirs.CacheDir}/${shortid.generate()}.pdf`;

    RNFetchBlob.fs.createFile(filePath, base64, "base64").then(path => {
      // necessary ?
      RNFetchBlob.session("all").add(path);
    });
  }
};

Я думаю, что я добавил путь к session, чтобы позже я мог массово удалить PDF-файлыпо их идентификатору сессии.В противном случае, я думаю, что с этим путем вы можете просто передать его в компонент PDF следующим образом: 

<Pdf source={{ uri: path, cache: false }} />
...