<input type="file"> 관련하여..

File 데이터를 JSON.stringify로 바로 변환하는 것이 불가능하기 때문입니다. startFile.value 값에 정상적인 File 값이 찍힌다고 하셨으니 startFile.value의 값을 사용해서 다음과 같이 새로운 객체를 생성한 뒤에 새로운 객체를 JSON.stringify로 변환해서 사용하면 될거 같습니다.

1
2
3
4
5
6
7
8
9
10
11
// startFile.value 값을 가진 새로운 객체 생성
const newObject  = {
   'lastModified'     : startFile.value.lastModified,
   'lastModifiedDate' : startFile.value.lastModifiedDate,
   'name'             : startFile.value.name,
   'size'             : startFile.value.size,
   'type'             : startFile.value.type
};  
 
// 새로운 객체를 가지고 JSON.stringify
JSON.stringify(newObject);

' <input type="file"> '에서 파일 데이터를 가져오고 이를 FormData에 추가하여 API로 전송하는 데 문제가 발생한 것 같습니다. 이 문제를 해결하기 위해 아래의 변경사항을 적용해보세요. 1. ' JSON.stringify(startFile.value) '를 사용하지 마세요. 파일 객체를 문자열로 변환하려고 하면 데이터 손실이 발생할 수 있습니다. 대신, FormData에 파일 객체를 직접 추가하세요. 2. FormData에 파일을 추가할 때 ' append ' 메소드의 인수를 올바르게 전달하세요. 첫 번째 인수는 키, 두 번째 인수는 값(파일 객체)입니다. 세 번째 인수는 선택적이며 파일 이름을 지정할 수 있습니다. 변경된 코드는 아래와 같습니다. 아래의 변경사항을 적용하면 파일 객체가 올바르게 FormData에 추가되고 API로 전송됩니다. ----- ✅ Chat GPT의 답변을 평가해 주세요! 틀린 내용은 없는지, 답변이 도움이 되었는지 댓글로 작성해 주세요.

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
const fileUpdateStatusApiHandler = async () => {
  const formData = new FormData();
  console.log('startFile===', startFile.value); // File형식 데이터 정상 찍힘 -> 타입 : 객체(Object)

  formData.append('file_upload', startFile.value, startFile.value.name); // 파일 객체를 직접 추가

  try {
    const res: any = await ApiCert.post(
      API_URL.url,
      formData,
      {
        headers: {
          'Content-Type': 'multipart/form-data',
        },
      }
    );
    console.log('response =====', res);
    if (res.resCode === 'OK') {
      console.log('OK');
    } else {
      alert(res.resMsg);
    }
  } catch (err: any) {
    console.log('error =====', err);
  }
};