Im trying to allow image uploads but I’m falling at the first hurdle!
Im currently using cfs:standard-packages and cfs:filesystem (although Ive tried cfs:gridfs too).
Im using React. In my React component I have an input type of file. When you upload an image and then submit the form the image appears to get logged out OK:
const imgFormSubmit = e => {
e.preventDefault();
const file = e.target.img.files[0];
console.log(file);
}
Im defining a collection. This file isn’t auto loaded to the client or server.
./imports/api/images.js:
Images = new FS.Collection('images', {
stores: [new FS.Store.FileSystem('images', { path: '~/uploads' })],
});
export default Images;
Im importing this into my server/main.js file, although I’m not sure if this is necessary or if the named export is being run?:
import Images from '../imports/api/images';
I also import it into my React component and then attempt to use it in the form:
import Images from '../../../api/images';
const imgFormSubmit = e => {
e.preventDefault();
const file = e.target.img.files[0];
Images.insert(file, function(err, fileObj) {
if (err) {
console.log(err);
} else {
console.log('it worked');
}
});
};
When I submit the form the browser console tells me “it worked” but I also get an error:
The provided value 'undefined' is not a valid enum value of type XMLHttpRequestResponseType.
It seems this is a common error but unlike others in that thread the image isnt uploaded to my filesystem.
Also, I’m not sure if this is whats supposed to happen but in my database I have new tables of cfs._tempstore.chunks and cfs.images.filerecord, but no images table like I suspected.