2017-02-13 9 views
0

Zendesk 파일 업로드 API 끝점에 base64 인코딩 된 PDF 파일을 게시하려고하지만 API에서 반환 된 파일 URL이 파일이 손상되었음을 보여줍니다.AJAX로 base64 인코딩 된 PDF 파일 게시

먼저 PDF를 base64로 인코딩 된 문자열로 별도의 API 호출에서받습니다. base64String이라고 부르 자.

내가 window.open("data:application/pdf;base64," + base64String)을하면 내 브라우저에서 PDF를 볼 수 있습니다.

이제 API를 통해 파일을 업로드하는 데 here 문서를 따르려고합니다. 예제에 표시된 것처럼 성공적으로 cURL 호출을 완료 할 수 있습니다. 그러나 jQuery AJAX 호출은 PDF 파일을 손상시킵니다.

client.request({ 
    url: '/api/v2/uploads.json?filename=test.pdf', 
    type: 'POST', 
    data: atob(base64String), 
    contentType: 'application/binary' 
}).then(function(data) { 
    window.open(data.upload.attachment.content_url); // corrupt file 
}, function(response) { 
    console.log("Failed to upload file to Zendesk."); 
    console.log(response); 
}); 

내가 말했듯이,이 성공하지만 난 content_url를 방문 할 때 PDF가 표시되지 않습니다. POST 요청에서 파일이 손상되었다고 확신합니다.

다른 것들 중에서 행운이없이 base64 문자열 (atob()으로 디코딩하지 않고)로 파일 업로드를 시도했습니다.

UPDATE 나는 아직도 블롭 base64로 문자열을 변환 후 PDF를 볼 수 아니에요

.

var blob = base64ToBlob(base64String); 
console.log(blob); // Blob {size:39574, type: "application/pdf"} 

client.request({ 
    url: '/api/v2/uploads.json?filename=test.pdf', 
    type: 'POST', 
    data: blob, 
    processData: false, 
    contentType: 'application/pdf' 
}).then(function(data) { 
    window.open(data.upload.attachment.content_url); // corrupt file 
}, function(response) { 
    console.log("Failed to upload file to Zendesk."); 
    console.log(response); 
}); 

function base64ToBlob(byteString) { 
    // write the bytes of the string to an ArrayBuffer 
    var ab = new ArrayBuffer(byteString.length); 
    var ia = new Uint8Array(ab); 
    for (var i = 0; i < byteString.length; i++) { 
    ia[i] = byteString.charCodeAt(i); 
    } 

    // write the ArrayBuffer to a blob, and you're done 
    var blob = new Blob([ab], {type: 'application/pdf'}); 
    return blob; 
}; 
+0

왜'contentType'을''application/binary''로 설정합니까? – guest271314

+0

[cURL 예] (https://developer.zendesk.com/rest_api/docs/core/attachments#upload-files)를 보면 헤더가 있습니다. – rosendin

+0

다른 언어로 서버에 대한 POST 요청을 처리하여 클라이언트 문제인지 확인해 보셨습니까? – user2867288

답변

0

은 내가 젠 데스크 응용 프로그램 프레임 워크가 요청을 JQuery와 AJAX 래퍼를 사용하고 arraybuffer 유형이 지원되지 않는, 그래서 파일이 손상하기 것을 배웠습니다. 앱 프레임 워크 팀이 문제를 해결했습니다.