Hello, Thanks for the amazing plugin.
I’m using Uppy with Angular 8, regular upload from the browse working perfect with me.
But I’m facing issue with Uploading by Google Drive and URL message retrieved [Uppy]
file are not uploaded to my s3 buckets also no emit success of files URL apeared on json that back from the server.
"@uppy/aws-s3": "^1.6.7",
"@uppy/aws-s3-multipart": "^1.5.2",
"@uppy/core": "^1.8.2",
"@uppy/dashboard": "^1.11.0",
"@uppy/dropbox": "^1.3.8",
"@uppy/google-drive": "^1.4.2",
"@uppy/url": "^1.4.5",
`initializeUppy() {
this.uppyInstance = Uppy({
allowMultipleUploads: true,
autoProceed: true,
debug: false,
restrictions: {
maxFileSize: this.maxFileSize || null,
maxNumberOfFiles: this.maxNumberOfFiles || null,
minNumberOfFiles: this.minNumberOfFiles || null,
allowedFileTypes: this.allowedFileTypes || null
},
})
.use(AwsS3Multipart, {
companionUrl: environment.uploadCompanionUrl,
createMultipartUpload(file) {
return fetch(`${environment.uploadCompanionUrl}/s3/multipart`, {
method: 'post',
credentials: 'same-origin',
headers: {
Accept: 'application/json',
'Content-Type': 'application/json',
},
body: JSON.stringify({
filename: file.name,
type: file.type,
metadata: {}
})
}).then((response) => response.json());
}
})
.use(Dashboard, {
target: this.dragZoneSelector,
inline: true,
proudlyDisplayPoweredByUppy: false,
width: this.width,
height: this.height,
locale: {
strings: {
browse: '',
dropPaste: '%{browse} Drag and drop or upload from device'
}
}
})
.use(GoogleDrive, {
target: Dashboard,
companionUrl: environment.uploadCompanionUrl
})
.use(Dropbox, {
target: '.dropbox',
companionUrl: environment.uploadCompanionUrl
})
.use(Url, {
target: '.url',
companionUrl: environment.uploadCompanionUrl
});
}
attachEventListeners() {
this.uppyInstance.on('file-added', (file) => {
this.myEmitter.emit('file-added', file);
});
this.uppyInstance.on('complete', (result: UppyUploadResultInterface) => {
this.myEmitter.emit('complete', result);
});
this.uppyInstance.on('upload-progress', (file, progress) => {
this.myEmitter.emit('upload-progress', file, progress);
});
this.uppyInstance.on('cancel-all', (result) => {
this.myEmitter.emit('cancel-all', result);
});
this.uppyInstance.on('upload-error', (file, error, response) => {
this.myEmitter.emit('upload-error', file , error , response);
});
}`
Uppy Server
const express = require('express');
const companion = require('@uppy/companion');
const bodyParser = require('body-parser');
const session = require('express-session');
var cors = require('cors');
const dotenv = require('dotenv');
// initialize configuration
dotenv.config();
const app = express();
// view engine setup
app.use(bodyParser.json());
app.use(session({
secret: process.env.COMPANION_SESSION_SECRET,
resave: true,
saveUninitialized: true
}));
// CORS configuration
var corsOptions = {
origin: '*',
methods: "GET,HEAD,PUT,PATCH,POST,DELETE,OPTIONS",
optionsSuccessStatus: 200
}
app.use(cors(corsOptions));
app.use((req, res, next) => {
res.setHeader('Access-Control-Allow-Origin', req.headers.origin || '*');
res.setHeader(
'Access-Control-Allow-Methods',
'GET, POST, OPTIONS, PUT, PATCH, DELETE'
);
res.setHeader(
'Access-Control-Allow-Headers',
'Authorization, Origin, Content-Type, Accept'
);
next();
});
// Routes
app.get('/', (req, res) => {
res.setHeader('Content-Type', 'text/plain');
res.send('Welcome to Companion');
});
const uppyOptions = {
providerOptions: {
google: {
key: process.env.COMPANION_GOOGLE_KEY,
secret: process.env.COMPANION_GOOGLE_SECRET
},
dropbox: {
key: process.env.COMPANION_DROPBOX_KEY,
secret: process.env.COMPANION_DROPBOX_SECRET
},
// you can also add options for dropbox here
s3: {
getKey: (req, filename, metadata) => filename,
key: process.env.COMPANION_AWS_KEY,
secret: process.env.COMPANION_AWS_SECRET,
bucket: process.env.COMPANION_AWS_BUCKET,
region: process.env.COMPANION_AWS_REGION,
useAccelerateEndpoint: process.env.COMPANION_AWS_USE_ACCELERATE_ENDPOINT === 'true',
expires: parseInt(process.env.COMPANION_AWS_EXPIRES),
acl: process.env.COMPANION_AWS_ACL
}
},
server: {
host: process.env.COMPANION_DOMAIN,
protocol: process.env.COMPANION_PROTOCOL
},
filePath: process.env.COMPANION_DATADIR,
secret: process.env.COMPANION_SECRET
};
console.log(process.env);
app.options('*', cors(corsOptions));
app.use(companion.app(uppyOptions));
// handle 404
app.use((req, res, next) => {
return res.status(404).json({ message: 'Not Found' });
});
// handle server errors
app.use((err, req, res, next) => {
console.error('\x1b[31m', err.stack, '\x1b[0m');
res.status(err.status || 500).json({ message: err.message, error: err });
});
companion.socket(app.listen(process.env.COMPANION_PORT), uppyOptions);
console.log('Welcome to Companion!');
console.log(`Listening on http://0.0.0.0:${process.env.COMPANION_PORT}`);
module.exports = app;
can anyone help me on this or at least help me how to upload my external files to s3 multipart buckets and get my uploaded URL to push it to the successful array since these data are not retrieved now and my successful result on complete is empty ```
{successful: Array(0), failed: Array(0), uploadID: “cke9swcuh00023h98prolnmit”}
failed: []
successful: []
uploadID: “cke9swcuh00023h98prolnmit”
Uppy Companion Version of the server "@uppy/companion": "^1.9.5",