Hello everyone,
if I try to upload a file using the Dropbox integration, I get Error: Unknown multipart upload error.
Here’s my setup:
React Frontend: localhost:3000
import React, { useEffect } from 'react';
import { Uppy, debugLogger } from '@uppy/core';
import { Dashboard } from '@uppy/react';
import XHRUpload from '@uppy/xhr-upload'
import Dropbox from '@uppy/dropbox';
// Don't forget the CSS: core and the UI components + plugins you are using.
import '@uppy/core/dist/style.min.css';
import '@uppy/dashboard/dist/style.min.css';
import '@uppy/webcam/dist/style.min.css';
// Don’t forget to keep the Uppy instance outside of your component.
const uppy = new Uppy({ logger: debugLogger })
.use(XHRUpload, {
endpoint: 'http://localhost:5000/api/fileManager/upload',
fieldName: 'file',
formData: true
})
.use(Dropbox, {
companionUrl: 'http://localhost:3020',
});
function FileManager() {
return <Dashboard uppy={uppy} plugins={['Dropbox']} />;
}
export default FileManager;
Uppy Companion (docker compose): localhost:3020
services:
companion:
image: "transloadit/companion:latest"
ports:
- "3020:3020"
environment:
COMPANION_DATADIR: "./output"
COMPANION_DOMAIN: "localhost:3020"
COMPANION_PORT: "3020"
COMPANION_ALLOW_LOCAL_URLS: "true"
COMPANION_DROPBOX_KEY: ...
COMPANION_DROPBOX_SECRET: ...
volumes:
- ./output:/app/output
Flask API: localhost:5000/api
from flask import Blueprint, request
import os
import multipart
import boto3
fileManager = Blueprint('fileManager', __name__)
@fileManager.route('/fileManager/upload', methods=["GET"])
def get():
return {"message":"this is a test"}, 200
@fileManager.route('/fileManager/upload', methods=["POST"])
def post():
file = request.files['file']
file.save(os.path.join('./output', file.filename))
from .AWSManager import aws_manager
aws_manager.upload_file('modulu-public-dev', "output/" + file.filename)
return {"message":"this is a test"}, 200
As you can see, I also set up an XHR upload, which works fine. The XHR upload is the uploader and according to the docs, the Dropbox integration i.e. companion will use the same uploader.
If I click on Dropbox in the UI Widget and choose a file and click upload, I get the following error: (taken from the Uppy Companion logs)
::ffff:172.18.0.1 - - [16/Aug/2023:12:10:28 +0000] "OPTIONS /dropbox/get/%2Flegalease_impactreport.pdf HTTP/1.1" 204 0 "http://localhost:3000/" "Mozilla/5.0 (X11; Linux x86_64; rv:109.0) Gecko/20100101 Firefox/116.0"
companion: 2023-08-16T12:10:28.024Z [info] companion.client.version uppy client version @uppy/companion-client=3.2.2
companion: 2023-08-16T12:10:28.312Z [debug] d874a835-8525-41d8-84b2-aaee93d5243anull Instantiating uploader.
companion: 2023-08-16T12:10:28.313Z [debug] d874a835-8525-41d8-84b2-aaee93d5243anull Starting download stream.
companion: 2023-08-16T12:10:29.507Z [debug] d874a835-8525-41d8-84b2-aaee93d5243anull Waiting for socket connection before beginning remote download/upload.
companion: 2023-08-16T12:10:29.508Z [debug] d02d6549 uploader.socket.wait waiting for socket connection
::ffff:172.18.0.1 - - [16/Aug/2023:12:10:29 +0000] "POST /dropbox/get/%2Flegalease_impactreport.pdf HTTP/1.1" 200 48 "http://localhost:3000/" "Mozilla/5.0 (X11; Linux x86_64; rv:109.0) Gecko/20100101 Firefox/116.0"
companion: 2023-08-16T12:10:29.557Z [info] socket.connect connection received from d02d6549-1024-40d9-a96d-64fc7decc286
companion: 2023-08-16T12:10:29.558Z [debug] d02d6549 uploader.socket.wait socket connection received
companion: 2023-08-16T12:10:29.558Z [debug] d874a835-8525-41d8-84b2-aaee93d5243anull Socket connection received. Starting remote download/upload.
companion: 2023-08-16T12:10:29.558Z [debug] d02d6549 controller.get.provider.size need to download the whole file first
companion: 2023-08-16T12:10:29.558Z [debug] d02d6549 uploader.download fully downloading file
companion: 2023-08-16T12:10:29.560Z [debug] d02d6549 uploader.total.progress 8192 1471998 0.56%
companion: 2023-08-16T12:10:30.001Z [debug] d02d6549 uploader.download finished fully downloading file
companion: 2023-08-16T12:10:30.012Z [error] upload.multipart.error RequestError: connect ECONNREFUSED 127.0.0.1:5000
at ClientRequest.<anonymous> (/app/node_modules/got/dist/source/core/index.js:970:111)
at Object.onceWrapper (node:events:510:26)
at ClientRequest.emit (node:events:402:35)
at ClientRequest.origin.emit (/app/node_modules/@szmarczak/http-timer/dist/source/index.js:43:20)
at Socket.socketErrorListener (node:_http_client:447:9)
at Socket.emit (node:events:390:28)
at emitErrorNT (node:internal/streams/destroy:157:8)
at emitErrorCloseNT (node:internal/streams/destroy:122:3)
at processTicksAndRejections (node:internal/process/task_queues:83:21)
at TCPConnectWrap.afterConnect [as oncomplete] (node:net:1161:16) {
code: 'ECONNREFUSED',
timings: {
start: 1692187830007,
socket: 1692187830009,
lookup: 1692187830010,
connect: undefined,
secureConnect: undefined,
upload: undefined,
response: undefined,
end: undefined,
error: 1692187830011,
abort: undefined,
phases: {
wait: 2,
dns: 1,
tcp: undefined,
tls: undefined,
request: undefined,
firstByte: undefined,
download: undefined,
total: 4
}
}
}
companion: 2023-08-16T12:10:30.013Z [debug] d02d6549 cleanup
companion: 2023-08-16T12:10:30.013Z [error] d02d6549 uploader.error Error: Unknown multipart upload error
at Uploader.<anonymous> (/app/lib/server/Uploader.js:568:23)
at Generator.throw (<anonymous>)
at rejected (/app/lib/server/Uploader.js:5:65)
at processTicksAndRejections (node:internal/process/task_queues:96:5)
Now, there’s one particular part of the error that’s interesting to me: RequestError: connect ECONNREFUSED 127.0.0.1:5000
I’m not sure what request Companion tried to do here but if it made a POST to localhost:5000 then that’s wrong, it should be localhost:5000/api/fileManager/upload.
Thanks for any input