I have an application that invites users to upload image files, which I then intend to store using Firebase's Cloud Storage. I've gotten pretty far using the Firebase docs, but I keep getting a 400 response when I try to upload the files.
Here is the component from which users upload their files:
class JobEntry extends Component {
constructor(props) {
super(props);
}
render() {
return (
<div className="single-job-entry">
<div className="job-item">
<span className="job-item-label">Add doc?:</span>
<input type="file"
id={this.props.id +"file"}
data-id={this.props.id}
onChange={this.props.submitDoc} />
</div>
</div>
);
}
}
export default JobEntry;
And here is the function that uploads the files to Firebase ('storage' and 'resumes' are firebase storage refs):
submitDoc (e) {
let jobId = e.target.dataset.id
let id = this.props.userId
let file = document.getElementById(jobId + 'file').files[0]
var newPath = storage.resumes.child(jobId + '/' + file.name)
newPath.put(file).then(snapshot => {
console.log('Uploaded file')
}).catch(err => {
console.log(err.message)
})
}
Every time I try to upload a files, I get this error:
Firebase Storage: An unknown error occurred, please check the error payload for server response.
I've checked the server response and there's nothing there that seems to point to the problem.
Any help is appreciated!
storage.child(...)
without.resumes
– Rodrigo Mata