'When downloading a file using ResponseEntity in Spring, byte breaks in reaction

This is a method of downloading files from Spring to ResponseEntity.

When you download it, the byte breaks and comes out.

If you use tag a, you can download the file without breaking it, but it is difficult to put the event after downloading the file using response.

Is there a way?

// Spring

Resource resource = qnaService.loadAsResource(tempFileName);
        File file = resource.getFile();

    if (file.exists()) {
        HttpHeaders headers = new HttpHeaders();
        headers.setContentType(MediaType.APPLICATION_OCTET_STREAM);
        headers.setContentDispositionFormData("attachment", fileName);
        headers.setCacheControl("must-revalidate, post-check=0, pre-check=0");
        headers.set("Content-Transfer-Encoding", "binary");


        return ResponseEntity.ok()
                .header(HttpHeaders.CONTENT_DISPOSITION, "attachment;filename=" + OriginFileName)
                .contentType(MediaType.APPLICATION_XML)
                .contentLength(file.length())
                .body(new InputStreamResource(new FileInputStream(file)));
    }

// React

 const data = await request({
                url: `/api/qna/file/test/${node.qnaFileID}`,
                method: request.method.get(),
            });
            console.log(data);
            const blob = new Blob([data], { type: 'application/xml;charset=utf-8' });
            saveAs(blob, node.name);

// Data is broken.

data: "�PNG\r\n\u001a\n\u0000\u0000\u0000\rIHDR\u0000\u0000\t�\u0000\u0000\u0004z\b\u0006\u0000\u0000\u0000�س]\u0000\u0000\fliCCPICC Profile\u0000\u0000H��W\u0007XS�\u0016�[RIh\u0001\u0004���\u0004�\u001a@J\b-��"�\bI �Ę\u0010T�eQ���\b��U\u0011Ŷ\u0002bǮ,��/\u0016T�uQ\u0017\u0



Solution 1:[1]

just add responseType: blob to your request

Sources

This article follows the attribution requirements of Stack Overflow and is licensed under CC BY-SA 3.0.

Source: Stack Overflow

Solution Source
Solution 1 MrMone13