Это утечка памяти при использовании React-Filepond? - PullRequest
0 голосов
/ 23 апреля 2019

В производственном процессе экземпляр FilePond, похоже, ломает всю мою страницу при инициализации внутри пользовательского модального модуля.Появляется стандартное серое поле, но не текст внутри него.Локально это работает, но после запуска в производство, когда я пытаюсь его использовать, вкладка в браузере останавливается, и мне приходится закрываться.Я думаю, что это потенциально утечка памяти.

Версии: React: 16.5.2 multer: 1.4.1 multer-s3: 2.9.0 Узел в разработке: 10.15.3 Узел в производстве: 8.11.4 (Может ли большая разница в версиях узлов i вызывать эту проблему?)

Мой сервер работает на узле и использует пакеты multer в качестве промежуточного программного обеспечения для загрузки файлов.Я возвращаю статус 200 в случае успеха, а также ключ / путь к файлу для ссылки на интерфейс.

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

После моих функций getDerivedStateFromProps и componentDidMount у меня есть функция handleInit:

handleInit() {
    console.log('FilePond instance has initialised', this.pond);
}
return (
    <div className="card mx-3 p-3">
        <FiltersBar leftComponents={leftComponents} rightComponents={rightComponents} />
        <Table data={this.props.contact.attached_files || []} headers={tableHeaders} />
        <Modal
            state={this.state.modalState}
            title="Upload File"
            close={this.closeModal}
        >
            <FilePond
                ref={ref => (this.pond = ref)}
                files={this.state.files}
                allowMultiple={true}
                name="documents"
                oninit={() => this.handleInit()}
                server={
                        {
                            process: {
                                url:
                                    'endpoint-nodeserver',
                            method: 'POST',
                            onload: file => this.props.uploadContactFile(JSON.parse(file).values),
                            headers: {
                                    authorization: this.state.user,
                            },
                            onerror: () => alert('unable to upload this document')
                            },
                        }}
                allowRevert={false}
                onwarning={error => this.handleError(error)}
                onupdatefiles={fileItems => {
                this.setState({
                    files: fileItems.map(fileItem => fileItem.file),
                });
                }}
            />
        </Modal>
    </div>
);
}}

1 Ответ

1 голос
/ 23 апреля 2019

Кажется, что это проблема переднего плана, а не проблема с вашим сервером, поэтому я не думаю, что это будет иметь какое-либо отношение к различиям в вашем сервере узла.

...