i try to create a profile, that the imageid is saved inside the database, untill now all the code work good, the image upload work, and res good, and save the files.
but when i try to create a profile alawys the data i get to the createProfile Api
is undefined and cant be reached.
i have tried to use bodyParser,
json.stringtfy as in the code.
the other API work good. just when i try to use fetch inside fetch or pass with axios it alawys reach empty
this my html:
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>Document</title>
</head>
<body>
<form id="createProfile" action="" method="POST" enctype="multipart/form-data">
<p>profile name:</p>
<input type="text" id="name" name="name">
<p>image</p>
<input type="file" name="image">
<input type="submit" value="submit">
</form>
</body>
</html>
this my js:
const form = document.getElementById('createProfile')
const name = document.getElementById('name')
form.addEventListener('submit', async e => {
e.preventDefault()
const data = new FormData(form)
console.log(...data)
try {
const res = await fetch('http://localhost:4000/api/uploadimage', {
method: 'POST',
body: data
})
const resData = await res.json()
console.log(resData)
if (resData.code === 200) {
const resProfile = await fetch(
'http://localhost:4000/api/createProfile',
{
method: 'POST',
body: JSON.stringify({
name: name.value,
imageid: resData.imageid
})
}
)
const resProfileData = await resProfile.json()
console.log(resProfileData.profileid + 'has been created')
}
} catch (err) {
console.log(err.message)
}
})
}
my end point of uploadimage:
exports.uploadimage = async function(req,res){
if (req.file) {
var imgsrc = './images/' + req.file.filename
var insertData = "INSERT INTO images(image)VALUES(?)"
connection.query(insertData,[imgsrc], (err,result)=>{
if(err) throw err
console.log("file uploaded")
console.log(result.insertId);
res.status(200).json({
code:200,
imageid:result.insertId,
success:'image saved successfully'
})
} )
} else {
res.status(400).send("Please upload a valid image");
}
}
my create profile end point:
exports.createProfile = async function ( req, res) {
try {
const requestedData = req.body;
console.log(requestedData.name);
} catch (err) {
console.log(err.message);
}
}
i have tried to use bodyParser,
json.stringtfy as in the code, use cors().
the other API work good. just when i try to use fetch inside fetch or pass with axios it always reach empty.
i just want to be able to get the request with data, and ill deal the rest.
thank you everyone for help.
