Загрузите файл из реактивной системы с помощью socket.io и act-native-fs

Question

Я хочу загрузить видео на мой сервер socket.io из моего приложения-носителя. Из html-js-клиента загрузка работает отлично.

Когда я пытаюсь сделать это с реактивом-родным, файл отправляется, но на сервере встречается как текст, и после этого я не могу его прочитать.

Видеофайл, сохраненный после захвата, четко виден в телефонной галерее.

import Camera from "react-native-camera";
import SocketIOClient from 'socket.io-client';
import RNFS from 'react-native-fs';

export default class CaptureVideoScreen extends React.Component {

    constructor(props) {
        super(props);

        this.socketInit();

        this.camera = null;
        this.file = null;

        this.state = {
            camera: {
                aspect: Camera.constants.Aspect.fill,
                captureTarget: Camera.constants.CaptureTarget.cameraRoll,
                type: Camera.constants.Type.back,
                captureQuality: "720p",
                flashMode: Camera.constants.FlashMode.auto,
            },
            isRecording: false
        };
    }

    socketInit = () => {
        this.socket = SocketIOClient('https://mywebsite.fr:3001');
        this.socket.on('Upload.RequestData', this.emitData);
        this.socket.on('Upload.Done', this.uploadDone);
    };

    startRecording = () => {
        if (this.camera && !this.state.isRecording) {
            this.camera.capture({mode: Camera.constants.CaptureMode.video})
                .then((data) => {

                    RNFS.readFile(data.path, 'base64').then(contents => {

                        this.file = contents;
                        this.socket.emit('Upload.Start', {'size': contents.length});
                    });
                })
                .catch(err => console.error(err));
            setTimeout(this.stopRecording, 12000);
            this.setState({
                isRecording: true
            });
        }
    };

    stopRecording = () => {
        if (this.camera && this.state.isRecording) {
            this.camera.stopCapture();
            this.setState({
                isRecording: false
            });
        }
    };

    emitData = (data) => {
        var buffer = this.file.slice(data.cursor, data.cursor + data.blockSize);
        console.log(buffer.length);
        this.socket.emit('Upload.Data', {token: data.token, data: buffer});
        console.log(Math.round(data.cursor / this.file.length * 100) + '%');
    };

    uploadDone = (data) => {
        console.log('Upload Done !');
    };

    //... render + camera methods
}

Это проблема кодирования? Как я могу прочитать файл с буфером?

Спасибо, Бастьен

Answer 1

кодировать (буфер) - кодирует ArrayBuffer в строку base64

decode(str) - декодирует строку base64 в ArrayBuffer

с использованием этого пакета npm

https://www.npmjs.com/package/base64-arraybuffer