cancel
Showing results for 
Show  only  | Search instead for 
Did you mean: 
Announcements
What’s new: end-to-end encryption, Replay and Dash updates. Find out more about these updates, new features and more here.

Dropbox API Support & Feedback

Find help with the Dropbox API from other developers.

cancel
Showing results for 
Show  only  | Search instead for 
Did you mean: 

Re: filesUpload gives corrupted file

filesUpload gives corrupted file

Sega
New member | Level 2
Go to solution

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

Greg-DB
Dropbox Staff
Go to solution

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

Greg-DB
Dropbox Staff
Go to solution

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)
})

Sega
New member | Level 2
Go to solution
That was it! Thanks!

Stupid that i just tried the two options and not the third option..
Need more support?