iPhone에서 S3로 업로드 된 jpeg 이미지를 읽을 수 없습니다. 그러나 포토샵에서 작동

Question

iOS 장치에서 presigned URL을 사용하여 S3로 jpeg 이미지를 업로드하려고합니다. 여기에 내가 뭘 내용은 다음과 같습니다

const file = { 
    uri: imageURL, 
    type: 'image/jpeg' 
}; 

const formData = new FormData(); 
formData.append('photo', file); 
formData.append('Content-Type', 'image/jpeg'); 

const response = await axios({ 
    method: 'PUT', 
    headers: { 
    'Content-Type': 'multipart/form-data' 
    }, 
    url: s3PreSignedURL, 
    data: formData 
}); 

(이 앱은에 기본 반응하고 내가 사진을 촬영하는 반응 - 기본 카메라를 사용합니다.)

문제는 이미지가 업로드됩니다이다. 내가 그것을 다운로드하고 내 맥에서 볼하려고하면 그것은 The file could not be opened라고 말합니다. 하지만 Photoshop에서 열면 작동합니다. 무슨 일이 벌어지고 있는지 알아?

현재 샘플 이미지 찾을 수 있습니다

: https://s3-ap-southeast-1.amazonaws.com/eyesnapdev/scans/1509856619481-71809992-b818-4637-93f1-9a75b6588c2c.jpg

Answer 1

이 이미지를 보내 formData를 사용하지 않는 것 같다가, 오히려 다음과 같이해야합니다 :

const file = { 
    uri: imageURL, 
    type: 'image/jpeg' 
}; 

const formData = new FormData(); 
formData.append('photo', file); 
formData.append('Content-Type', 'image/jpeg'); 

const response = await axios({ 
    method: 'PUT', 
    headers: { 
    'Content-Type': 'multipart/form-data' 
    }, 
    url: s3PreSignedURL, 
    data: formData // not **file** 
}); 

Answer 2

업로드 된 이미지가 전체 다중를 절약 데이터를 형성뿐만 아니라 다음과 같은 정보를 포함합니다 (텍스트 편집기에 S3의 JPG 이미지를여) :

--K_B9dYtGXt4.LjeMIncq0ajcL6vDRYqD1hRiwoIOJzPKYTVi8jTYT_f07RZw37Om1NJwGi content-disposition: form-data; name="photo" content-type: image/jpeg

s3 upload는 멀티 파트 양식이 아닌 게시 ​​할 파일의 데이터 만 필요합니다.

React 고유 코어를 통해 파기 한 후 다음 코드가 작동해야한다고 생각합니다. 아직 불구하고 그것을 자신을 시도하지 않은 :

fetch(s3PreSignedURL,{ 
    method:"PUT", 
    headers: { 
     'Content-Type': 'image/jpg' 
    }, 
    body:{uri:imageURL} 
}); 

또는 사용 Axios의 :

axios({ 
    method: 'PUT', 
    headers: { 
    'Content-Type': 'image/jpg' 
    }, 
    url: s3PreSignedURL, 
    body:{uri:imageURL} 
});