Help with uploading images to Sanity from frontend of app
3 replies
Last updated: Mar 31, 2021
R
If someone could help me with this, I would greatly appreciate it! I’m sure it’s some sill mistake. Trying to upload an image to sanity from the frontend of my app with the following code and receiving this error:
×
TypeError: Object(...) is not a function
updateImage
http://localhost:8888/main.2d91281bd3c8b2276edd.hot-update.js:295:142
This is my code:
×
TypeError: Object(...) is not a function
updateImage
http://localhost:8888/main.2d91281bd3c8b2276edd.hot-update.js:295:142
292 | event.preventDefault();
293 | console.log(event.target.files[0]);
294 | const filePath = event.target.files[0].name;
> 295 | _sanitySetup__WEBPACK_IMPORTED_MODULE_2__["default"].assets.upload('image', Object(fs__WEBPACK_IMPORTED_MODULE_5__["createReadStream"])(`${event.target.files[0].name}`), {
| ^
296 | filename: `${event.target.files[0].name}`
297 | }).then(document => {
298 | console.log('The image was uploaded!', document);This is my code:
const updateImage = (event) => { event.preventDefault()
console.log(event.target.files[0])
sanityClient.assets`.upload('image', createReadStream(
${event.target.files[0].name}), {filename: ${event.target.files[0].name}})` .then((document) => { console.log('The image was uploaded!', document) })
.catch((error) => { console.error('Upload failed:', error.message) })
}
Mar 29, 2021, 3:58 AM
G
Are all your imports configured like here ?
Mar 30, 2021, 5:36 PM
B
Hi
Instead you could try uploading the
File instance directly, something like this should work:
user R
- looks like you're trying to upload using createReadStream from the fsmodule, which only works in Node.js.
Instead you could try uploading the
File instance directly, something like this should work:
const updateImage = (event) => {
event.preventDefault()
console.log(event.target.files[0])
sanityClient.assets
.upload('image', event.target.files[0], {filename: `${event.target.files[0].name}`})
.then((document) => {
console.log('The image was uploaded!', document)
})
.catch((error) => {
console.error('Upload failed:', error.message)
})Mar 30, 2021, 6:14 PM
R
user A
thank you so much for this!!And, if I could ask one more question, I’m really struggling with the listener. I posted this above but no one was able to help me with it:
https://sanity-io-land.slack.com/archives/C9Z7RC3V1/p1616589626032500
Mar 31, 2021, 1:46 AM
Sanity– build remarkable experiences at scale
The Sanity Composable Content Cloud is the headless CMS that treats content as data to power your digital business. Free to get started, and pay-as-you-go on all plans.