
📌 fetch로 해야댐(서버에서 body로 받을때)
import { useState } from "react";
const FileSendTest = () => {
const [selectedFile, setSelectedFile] = useState<any>(null);
const handleFileChange = (event: any) => {
setSelectedFile(event.target.files[0]);
};
const ObjString: string | null = localStorage.getItem("login-token");
const Obj = ObjString ? JSON.parse(ObjString) : null;
const handleUpload = async () => {
const formData = new FormData();
formData.append("carVin", "KMHTB41BP8A000000");
formData.append("category", "사고");
formData.append("content", "2중 충돌로 인한 운전석 문 파손");
formData.append("insuranceImg", selectedFile);
formData.append("insuranceDt", "2022-10-05T00:00:00");
try {
const response = await fetch("http://192.168.0.64/api/insurance",{
method: "POST",
body: formData,
headers: {
'Content-Type': 'multipart/form-data',
'Authorization': `Bearer ${Obj.value}`
}
});
console.log('File uploaded successfully:', response);
} catch (error) {
console.error("Error uploading file:", error);
}
setSelectedFile(null);
};
return (
<div>
<input type="file" onChange={handleFileChange} />
<button onClick={handleUpload} disabled={!selectedFile}>
Upload
</button>
</div>
);
};
export default FileSendTest;
📌 Axios 요청 시에는 안됨
const formData = new FormData();
formData.append('carVin', "KMHTB41BP8A000000");
formData.append('category', "사고");
formData.append('content', "2중 충돌로 인한 운전석 문 파손");
formData.append('insuranceImg', selectedFile);
formData.append('insuranceDt', "2022-10-05T00:00:00");
try {
const response = await axios({
method: 'POST',
url: 'http://192.168.0.64/api/insurance',
data: formData,
headers: {
'Content-Type': 'multipart/form-data',
'Authorization': `Bearer ${Obj.value}`
}
});
console.log('File uploaded successfully:', response);
} catch (error) {
console.error('Error uploading file:', error);
}
setSelectedFile(null);