0

I have been battling with this one issue for about two days now and don't have any solution. I get data back from an API on our old system with regards to Attachments and other data. Now if I run the query in postman, I get the actual document showing up. Now in VS Code, I do the call on the backend in Nodejs and send that data to my frontend, which when I log it to the console gives me the raw data of the file:

%PDF-1.6

%���� 199 0 obj <</Linearized 1/L 891424/O 201/E 139951/N 6/T 887396/H [ 1236 433]>> endobj

xref 199 47 0000000016 00000 n 0000001669 00000 n 0000001936 00000 n 0000002504 00000 n 0000002546 00000 n 0000002684 00000 n 0000002821 00000 n 0000002959 00000 n 0000003072 00000 n 0000004421 00000 n 0000005810 00000 n 0000006352 00000 n 0000006822 00000 n 0000006961 00000 n 0000007241 00000 n 0000007503 00000 n 0000007529 00000 n 0000008087 00000 n 0000010099 00000 n 0000010543 00000 n 0000010810 00000 n 0000012804 00000 n 0000014560 00000 n 0000016676 00000 n 0000019142 00000 n 0000021085 00000 n 0000030182 00000 n 0000041511 00000 n 0000050173 00000 n 0000059390 00000 n 0000059493 00000 n 0000059770 00000 n 0000059839 00000 n 0000060279 00000 n 0000119811 00000 n 0000121391 00000 n 0000123466 00000 n 0000126935 00000 n 0000129729 00000 n 0000131785 00000 n 0000133109 00000 n 0000135857 00000 n 0000138698 00000 n 0000139745 00000 n 0000139808 00000 n 0000139882 00000 n 0000001236 00000 n trailer <</Size 246/Prev 887384/Root 200 0 R/Info 198 0 R/ID[<8D8F16B67F948647AA1C78C6338DE7E5><623F133706D1C94384C1BFBFEFB70137>]>> startxref 0 %%EOF

245 0 obj<</Length 351/Filter/FlateDecode/I 420/S 260>>stream x�bb����� �bÁ+P���#�8���^�y���3��RZ��_[6�Z��Q�֋m��=wX�˖�

What I need help with is in my callback function....how do I get this data in a format where I can just immediately download it with the correct file structure showing. I have really tried quite a few options and nothing seems to work.

Any advice would be greatly appreciated.

Niishaw
  • 101
  • 3
  • 13
  • Does this answer your question? [How to create a file in memory for user to download, but not through server?](https://stackoverflow.com/questions/3665115/how-to-create-a-file-in-memory-for-user-to-download-but-not-through-server) – Justinas Nov 30 '21 at 10:19

1 Answers1

0

Use js-file-download library:

import fileDownload from 'js-file-download';

fileDownload(downloadData, fineName);
davood Sandoghsaz
  • 674
  • 1
  • 4
  • 13
  • Hi @davood Sandoghsaz, this works as the other methods I've tried, where it does download the file, but the PDF is blank. Should I do something with the data beforehand to make it work correctly? – Niishaw Nov 30 '21 at 11:05
  • Hi @Niishaw, Do you get data from API? – davood Sandoghsaz Nov 30 '21 at 11:06
  • yes on the backend, I do the same call I do in Postman and that brings back the pdf data which I then return to the front-end. I can see the data when I log it to console, but like I said, downloading it, returns a blank PDF file and I'm not sure if I should alter the returned data? As of right now, I only store it in a variable – Niishaw Nov 30 '21 at 11:09
  • How do you call API? Do you use of Axios? – davood Sandoghsaz Nov 30 '21 at 11:14
  • You must send a config with call API `{ responseType: 'blob' }` – davood Sandoghsaz Nov 30 '21 at 11:17
  • [code]async getAttachments(params) { const id = params.actionId; try { const resultsData = await axios.post( "URL", { function: "get_attachment", attachment_id: id, }, { headers: { Authorization: "", "Content-Type": "application/json", }, } ); return { d: resultsData.data }; } catch (error) { console.log(error); return false; } }[code] – Niishaw Nov 30 '21 at 11:19
  • As I said add `responseType` config to your header's request and check it again – davood Sandoghsaz Nov 30 '21 at 11:22
  • And download the file when the variable of your data is not null: `useEffect(() => { if (downloadData) fileDownload(downloadData, fineName); }, [downloadData]);` – davood Sandoghsaz Nov 30 '21 at 11:24