Загрузить файл с помощью Vue.js и Python Flask - PullRequest
0 голосов
/ 08 октября 2019

My Flask - это REST-сервер.

На моем маршруте фляги вот что у меня есть:

@app.route('/v1/download', methods=['POST'])
def download_tissue():
    f = open('path_to_zip_file', 'rb') // or r for text file
    return f.read()

(Ранее я использовал Flask send_file(). Но я неуверен, что send_file делает то, что я не могу сделать, просто читая его, и я пытаюсь упростить случай, чтобы выяснить проблему.)

На клиенте у меня есть приложение Vue, делающее асинхронный запрос:

axios.post('download')
.then((res) => {
    let data = res.data;
    const blob = new Blob([data], { type: 'application/zip' })
    let link = document.createElement('a')
    link.href = window.URL.createObjectURL(blob)
    link.download = 'test.zip'
    link.click()
})
.catch(error => {
    console.error(error);
});

Проблема в том, что я не могу разархивировать его на Mac. Невозможно расширить test.zip для загрузки. (Ошибка 1 - Операция не разрешена.) Также размер файла просто неправильный. Это почти 22 МБ вместо оригинального 12.

Если я открою обычный текстовый файл, он будет работать, но не zip-файл.

Ответы [ 2 ]

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

ОК, я понял это. Мне действительно нужно настроить тип ответа axios следующим образом:

axios({
        url: url
        method: 'POST',
        responseType: 'blob', // important
})
.then((res) => {
})

На самом деле я бы предпочел использовать настройку URL по умолчанию, но у меня не сработало следующее.

axios.post('download', {
    responseType: 'blob',
})
.then((res) => {
0 голосов
/ 08 октября 2019

Я предполагаю, что вы открыли файл в байтовом режиме, но когда он возвращается в функции просмотра, Flask пытается декодировать его в строку, а затем кодировать обратно в байты. Вот почему вы получаете файл большего размера.

попробуйте вернуть

flask.send_file("path/to/file.zip", mimetype="application/zip", as_attachment=True, attachment_filename="filenamefordownload.zip")
Добро пожаловать на сайт PullRequest, где вы можете задавать вопросы и получать ответы от других членов сообщества.
...