Vanilla JS ( no frameworks )
I’m trying to implement Uppy when someone pastes from clipboard on the whole browser window. So far I’ve not been able to source any examples or documentation to support this feature.
I’m trying to have Uppy instantiated when someone pastes ( I have the paste logic already, but the Uppy config is the issue) to use the target as document.body ( only for paste) then to remove itself as to not be triggered again if a user clicks on the document.body again which seems to trigger Uppy again.
Here is my initial implementation ( docs could benefit from more detail and examples ) that is called when pasting an image from clipboard anywhere in the browser window.
Uppy tries to use ‘GET’ instead of ‘POST’ and there is an upload error in the logs when you try to paste an image.
Uppy seems to not be able to be called in this fashion and the doc’s don’t make mention or if they do, it’s verbose and not easily found. The closest I could find was this post from 2019
Uppy also attempts to add [object%20Promise] to the request URL on POST which I believe it is passing the e.clipboardData.files.
Does anyone have any documentation on working with Uppy in this way, using clipboardData files to pass to Uppy for upload?
const uppy = new Uppy();
uppy.addFile({
data: event.clipboardData.files,
})
uppy
.use(Dashboard, {
target: document.body,
inline: false,
})
.use(XHRUpload , {
endpoint: '/some/endpoint/here'),
formData: false,
headers: (file) => {
return {
...
}
});