Как отправить » приложение/zip` в react-native

#react-native #zip #zipfile #react-native-fetch-blob

Вопрос:

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

 handlePendingItems = async (routeId: number) => {
    try {
      await dbClient.addLogLine(`Need to delete photos.`);
      const [debugLogs, pendingTasks, pendingUploads] = await this.getPendingItems();
      const dbVersion = await dbClient.getUserSchemaVersion();
      let appInfo = `Database Version = ${dbVersion}n`;
      appInfo  = `App Version = ${version}`;
      const zip = new JSZip();
      zip.file('app-info.txt', appInfo);
      if (debugLogs.length) {
        const debugLogsCsv = convertDataToCSV(debugLogs);
        zip.file('debug-logs.csv', debugLogsCsv);
      }
      if (pendingTasks.length) {
        const pendingTasksCsv = convertDataToCSV(pendingTasks);
        zip.file('pending-tasks.csv', pendingTasksCsv);
      }
      if (pendingUploads.length) {
        const pendingUploadsCsv = convertDataToCSV(pendingUploads);
        zip.file('pending-uploads.csv', pendingUploadsCsv);
      }
      const test = await zip.generateAsync({ type: 'binarystring' });
      console.log(test);
      const res = PhotoService.uploadLogs(routeId, test);

      // const zipFile = await zip.generateAsync({
      //   type: 'blob',
      //   compression: 'DEFLATE',
      //   compressionOptions: {
      //     level: 9
      //   }
      // });
    } catch (error) {
      console.log(error);
    }
  };
 

Я не могу использовать тип: ‘blob’ в react-native, он выдает ошибку как неподдерживаемый на этой платформе. При этом я пытаюсь использовать другие типы для передачи в react-native-fetch-blob. Будет отправлено с помощью следующего кода.

   uploadLogs(driverRouteId: number, logs: string) {
    const store = getStore();
    const token = store.getState()?.auth?.token || '';

    return new Promise((resolve, reject) => {
      RNFetchBlob.fetch(
        'POST',
        `${API_HOST}driver/route/${driverRouteId}/logs`,
        {
          'Content-Type': 'application/zip',
          Authorization: `Bearer ${token}`
        },
        logs
      ).then(
        (res) => {
          console.log(res);
          resolve(res);
        },
        (err) => {
          console.log(err);
          debugger;
          reject(err);
        }
      );
    });
  }
 

Я читал, что большой двоичный объект выборки попытается проанализировать строку base64, если кодировка содержимого относится к определенному типу, который в данном случае должен быть application/zip (поэтому в данном случае разбора нет), поэтому я пытаюсь вызвать generateAsync с типом string , однако, zip-файл, который хранит сервер in an unsupported format . Как я могу сгенерировать zip-файл, содержащий три csv-файла и файл txt, и отправить его, используя либо большой двоичный объект, либо просто axios в react-native.

Ответ №1:

Придумал решение, используя другую библиотеку для zip.

 npm install react-native-zip-archive --save
npm install react-native-fs --save
npm install rn-fetch-blob --save
import RNFetchBlob from 'rn-fetch-blob';
import { zip } from 'react-native-zip-archive';
import RNFS from 'react-native-fs';

const pathsToZip = [];
const zipPath = `${RNFS.DocumentDirectoryPath}/test.zip`;
const appInfo = 'App info string to put in txt file'
const appInfoPath = RNFS.DocumentDirectoryPath   '/appInfo.txt';
await RNFS.writeFile(appInfoPath, appInfo, 'utf8');
pathsToZip.push(appInfoPath);
await zip(pathsToZip, zipPath);

await uploadLogs(zipPath) {
    return new Promise((resolve, reject) => {
      RNFetchBlob.fetch(
        'POST',
        `postpath`,
        {
          'Content-Type': 'application/zip',
        },
        RNFetchBlob.wrap(zipPath)
      ).then(
        (res) => {
          console.log(res);
          resolve(res);
        },
        (err) => {
          console.log(err);
          debugger;
          reject(err);
        }
      );
    });
}