Javascript

[Javascript] FormData에 파일 배열 사용하기 및 데이터 확인

먹세 2021. 8. 24. 14:56

파일 업로드시 multiple 을 사용하여 여러개의 파일을 한번에 사용할 때 formData에 배열을 이용한다.

그런데 formData를 console.log로 찍으면 안보임

아래처럼 가공해서 확인 가능하다.

fileUpload(e) {
    const config = {
        headers : {'content-type': 'multipart/form-data'}
    };
    const formData = new FormData();
    const images = new Array();
    e.target.files.Foreach(function(item, key, arr){
    	formData.append('images[]', item); //images 배열에 item을 하나씩 넣는다.
    });
    
    //param.settings
    formData.append('user_id', this.profile.user_id);
    formData.append('user_name', this.profile.user_name);
    
    //formData 확인
    for(var value of formData.values()) {
    	console.log(value);
    }
    
    axios.post('/profile/familyfiles/upload', formData, config)
      .then((response) => {
        console.log(`response : ${JSON.stringify(response.data)}`);
    }).catch(error => {
        console.log(error.response);
    });
    
}

 

laravel 에서 확인

public function uploadFiles(Request $request) {
    dd($request->file('images'));
}

위처럼 배열로 확인 가능

반응형