Multer with node.js / react-native not working - node.js

Question

I'm creating an application with reaction-native, and I'm using an image picker to select an image and click the button to create a part that sends the image to the node.js server.
However, in the process of uploading an image, other additional information is normally stored in mysql, but images are not stored in the upload folder.
Multer version 1.4.2.
Node.js version 16.12.0
in react-native code ( data to node.js)
onPress={() => {
if (this.state.image === null) {
alert("이미지를 넣어주세요");
} else {
Alert.alert(
"구인 공고를 등록할까요?",
"등록후, 수정할 수 없으니 꼼꼼히 확인 부탁~!!",
[
{
text: "Cancel",
onPress: () => alert("취소하였습니다."),
style: "cancel"
},
{
text: "OK",
onPress: async () => {
const formData = new FormData();
formData.append("db_title", this.state.title);
formData.append("db_wtype", this.state.type);
formData.append("db_sdate", this.state.start);
formData.append("db_edate", this.state.end);
formData.append("db_money", this.state.money);
formData.append(
"db_address",
this.state.address
);
formData.append(
"db_description",
this.state.addition
);
formData.append("file", this.state.image);
formData.append("db_stime", "9");
formData.append("db_etime", "18");
formData.append("db_smin", "00");
formData.append("db_emin", "30");
await AsyncStorage.getItem("pubKey").then(
(pubKey) => {
formData.append("db_pubkey", pubKey);
}
);
const {
data: { result }
} = await axios.post(
"http://127.0.0.1:4000/upload",
formData
);
console.log(result);
alert(result);
this.props.navigation.navigate("Announce");
}
}
],
{ cancelable: false }
);
}
}}
in my node server code
const multer = require('multer');
const _storage = multer.diskStorage({
destination: function (req, file, cb) {
cb(null, '/upload')
},
filename: function (req, file, cb) {
cb(null, file.fieldname + '-' + Date.now())
}
})
const upload = multer({ storage: _storage });
router.post("/", upload.single("file"), function (req, res) {
console.log(req.body);
console.log(req.body.file);
Article.create({
db_title: req.body.db_title,
db_wtype: req.body.db_wtype,
db_sdate: req.body.db_sdate,
db_edate: req.body.db_edate,
db_stime: req.body.db_stime,
db_etime: req.body.db_etime,
db_smin: req.body.db_smin,
db_emin: req.body.db_emin,
db_pubkey: req.body.db_pubkey,
db_money: req.body.db_money,
db_address: req.body.db_address,
db_description: req.body.db_description,
db_img: req.body.file
})
.then(result => {
console.log("result : " + result);
res.status(201).json({ result: "공고가 등록 되었습니다." });
})
.catch(err => {
console.error("err : " + err);
});
});
module.exports = router;
this is node.js console log
edit image picker (this.state.image)
_pickImage = async () => {
let result = await ImagePicker.launchImageLibraryAsync({
mediaTypes: ImagePicker.MediaTypeOptions.All,
allowsEditing: true,
aspect: [4, 3]
});
console.log("%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%% ");
console.log(
result
);
console.log("%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%% ");
if (!result.cancelled) {
this.setState({ image: result.uri });
}
};

Answer 1

You need to use the path made by multer:
change:
db_img: req.body.file
to
db_img: req.file.path