cancel
Showing results for 
Search instead for 
Did you mean: 
Announcements
Update: Find information on Dropbox support during COVID-19 here
Close
cancel
Showing results for 
Search instead for 
Did you mean: 
Highlighted

filesUpload gives corrupted file

New member | Level 2
New member | Level 2

Hello,

 

I'm want to use the Dropbox API/SDK in one of my projects. I have to convert a base64 string I'm getting from my webcam as a screenshot into a real image and then upload it to Dropbox. (I'm more a Designer than a coder, so if I mismatch something - sorry for that.)

 

Following the code I'm currently using: 

 

const base64File = this.webcam.getScreenshot()
const dbx = new Dropbox({ accessToken: this.state.dropboxToken })
const i = base64File.indexOf('base64,')
const buffer = Buffer.from(base64File.slice(i + 7), 'base64')
const name = 'test.png'
const file = new File(buffer, name, { type: 'image/png'})
dbx.filesUpload({path: '/' + file.name, contents: file})
.then(function (response) {
    console.log(response)
})
.catch(function (error) {
    console.error('dropbox error', error)
})

Right now, I'm getting a .png file with 1.2 MByte size but I can't open it. 

If I'm using "file.buffer" in "contents" in the filesUpload function I'm getting a zero size file. 

 

I'm glad for every help I can get. Thanks!

1 Accepted Solution

Accepted Solutions
Highlighted

Re: filesUpload gives corrupted file

Dropboxer
Dropboxer

I believe you should just supply the buffer directly, so all you need to do is:

 

const base64File = this.webcam.getScreenshot()
const dbx = new Dropbox({ accessToken: this.state.dropboxToken })
const i = base64File.indexOf('base64,')
const buffer = Buffer.from(base64File.slice(i + 7), 'base64')
const name = 'test.png'

dbx.filesUpload({path: '/' + name, contents: buffer})
.then(function (response) {
    console.log(response)
})
.catch(function (error) {
    console.error('dropbox error', error)
})

View solution in original post

2 Replies 2
Highlighted

Re: filesUpload gives corrupted file

Dropboxer
Dropboxer

I believe you should just supply the buffer directly, so all you need to do is:

 

const base64File = this.webcam.getScreenshot()
const dbx = new Dropbox({ accessToken: this.state.dropboxToken })
const i = base64File.indexOf('base64,')
const buffer = Buffer.from(base64File.slice(i + 7), 'base64')
const name = 'test.png'

dbx.filesUpload({path: '/' + name, contents: buffer})
.then(function (response) {
    console.log(response)
})
.catch(function (error) {
    console.error('dropbox error', error)
})

View solution in original post

Highlighted

Re: filesUpload gives corrupted file

New member | Level 2
New member | Level 2
That was it! Thanks!

Stupid that i just tried the two options and not the third option..

Work Smarter with Dropbox

The way we work is changing. Share and discover new ways to work smarter with Dropbox in our community.

Sound good? Let's get started.
Who's talking

Top contributors to this post

What do Dropbox user levels mean?
Need more support?