Я пытаюсь загрузить файл одним нажатием кнопки в Angular. Файл, который загружается, но имеет размер 0 КБ и не открывается.
Это код, который у меня есть в Angular и Spring MVC.
Угловой:
public downloadFile(fileName:string){
console.info("ready to download");
let param:any = {'messageId':this.loadedMessageService.messageId, 'attachmentName':fileName}
this.http.get(`https://fakeurl.com/abc/getFile`,{params:param,responseType:'blob'}).subscribe(
(data) => {
let b:Blob = new Blob([data])
//,{type: 'application/octet-stream',}
// const fileName :string= "RL.xlsx"
var url = window.URL.createObjectURL(b);
const a : HTMLAnchorElement = document.createElement('a') as HTMLAnchorElement;
// const a = document.createElement('a');
document.body.appendChild(a);
a.href = url;
a.download = fileName;
a.click();
document.body.removeChild(a);
URL.revokeObjectURL(url);
}
)
}
Весенний МВК:
@GetMapping(value = "/getFile")
public @ResponseBody byte[] getFile() throws IOException {
try {
return messageAttachmentService.getFile(Integer.parseInt(request.getParameter("messageId")), request.getParameter("attachmentName"));
} catch (NumberFormatException e) {
StringWriter sw = new StringWriter();
e.printStackTrace(new PrintWriter(sw));
logger.error(sw.toString());
} catch (Exception e) {
StringWriter sw = new StringWriter();
e.printStackTrace(new PrintWriter(sw));
logger.error(sw.toString());
}
return null;
}
Прямо сейчас, когда я нажимаю кнопку, файл загружается, но его размер составляет 0 КБ и он не открывается. Раньше я использовал type как application/octet-stream, поскольку загружаемый файл мог быть либо PDF, либо текстовым файлом, либо xls. Я также сослался на другие вопросы и попытался изменить тип ответа на arraybuffer. Это тоже не решило проблему. Что не так с моим кодом?
В этом случае я загружаю весь файл с расширением «файл». Если я попытаюсь открыть это с помощью Acrobat Reader (поскольку я тестирую PDF-файл), он откроется нормально.
Ok. В этом случае код на стороне сервера, вероятно, не имеет значения. Почему вы хотите использовать библиотеку/подписку Angular HTTP с загрузкой файла. Не проще ли было просто перейти по ссылке для скачивания по старинке и все заработало?
каков вывод console.info(data) на угловой стороне?
может быть дубликатом, см. здесь: stackoverflow.com/questions/35138424/…





Вы можете попробовать так.
public downloadFile(fileName:string){
console.info("ready to download");
let param:any = {'messageId':this.loadedMessageService.messageId, 'attachmentName':fileName}
this.http.get(`https://fakeurl.com/abc/getFile`,{params:param,responseType:'blob'}).subscribe(
(data) => {
const a = document.createElement('a');
document.body.appendChild(a);
const blob: any = new Blob([data], { type: 'octet/stream' });
const url = window.URL.createObjectURL(blob);
a.href = url;
a.download = data.fileName;
a.click();
window.URL.revokeObjectURL(url);
}
)
}
Было бы неплохо, если бы вы добавили свои рассуждения, почему решение OP не работает, а ваше работает. Просто кусок кода не является хорошим ответом, так как трудно понять, почему это может что-то решить.
Вы можете попробовать с пакетом файл-сохранитель. Это простой в использовании.
import * as FileSaver from 'file-saver';
const blob: any = new Blob([data], { type: 'octet/stream' });
saveAs(blob, "hello world.txt");
Что произойдет, если вы пропустите часть Angular и перейдете прямо к URL-адресу загрузки вашего бэкэнда из браузера?