Файл PDF поврежден после загрузки - PullRequest
0 голосов
/ 26 октября 2019

Я использую платформу Sharetribe, которая не может коснуться серверного кода, а только получить доступ к пользовательскому скрипту. Поэтому я использую jquery ajax для загрузки и загрузки файлов в Dropbox. Процесс загрузки прошел гладко, но при загрузке возникла проблема с повреждением загруженного файла. Это не может быть открыто любым программным обеспечением PDF. Я также нашел размер файла больше, чем оригинальный файл PDF в моем Dropbox. Оригинальный PDF-файл хорош и может быть прекрасно открыт.

Вот код для загрузки файла

var url = 'https://content.dropboxapi.com/2/files/download';

$.ajax({
    url: url,
    type: 'post',
    responseType: 'arraybuffer',
    headers: {
        "Authorization": "Bearer <TOKEN>",
        "Dropbox-API-Arg": JSON.stringify({"path": "/"+filename})
    },
    success: function (data){
        console.log(data);
        //CAN DOWNLOAD PDF BUT CAN'T OPEN IT. FILE PDF IS CORRUPT
        //var blob = new Blob([data]);
        //var aLink = document.createElement('a');
        //aLink.href = window.URL.createObjectURL(blob);
        //aLink.download = "file_tc.pdf";
        //aLink.click();        
        const url = window.URL.createObjectURL(new Blob([data], { type: 'application/pdf' }));
        window.open(url);
    },
    error: function (data){
        console.log(data);
    }
})

Кто-нибудь может помочь, что не так с приведенным выше кодом?

1 Ответ

0 голосов
/ 27 октября 2019

Я прочитал http://keyangxiang.com/2017/09/01/HTML5-XHR-download-binary-content-as-Blob/. Я обнаружил, что обычный jquery ajax не поддерживает blob или arraybuffer. Затем я добавил обработчик beforeSend, как было предложено, но все еще не работает, поэтому вместо него я использую XMLHTTPRequest. Работает хорошо. Я получил правильный файл PDF и размер. Вот мои изменения кода:

var url = 'https://content.dropboxapi.com/2/files/download';
var token = 'YOUR-ACCESS-TOKEN';

var xhr = new XMLHttpRequest();
xhr.responseType = 'blob';
xhr.onreadystatechange = function () {
    if (xhr.readyState === 4 && xhr.status === 200) {
        var url = (window.URL || window.webkitURL).createObjectURL(xhr.response);
        var aLink = document.createElement('a');
        document.body.appendChild(aLink);
        aLink.href = url;
        aLink.download = filename;
        aLink.click();
    }
};
xhr.open('POST', 'https://content.dropboxapi.com/2/files/download');
xhr.setRequestHeader('Authorization', 'Bearer ' + token);
xhr.setRequestHeader('Dropbox-API-Arg', JSON.stringify({"path": "/"+filename}));
xhr.send();

Надеюсь, это поможет кому-то, кто наткнется на ту же проблему.

...