I have a nodejs backend and I want to send a file download link to the client such that, the file is directly accessible by the client. The file types are JPEG and PNG. Currently, I am serving these files as data-uri but, due to a change in requirements, I must send a download link in response to the file request and, client can download the file later using that link.
Now the current workflow exposes a path /getAvatar. This path should send a response back to the client with the file link. The file, is stored in /assets/avatars relative to the server root. I know I can express.static middleware to send back static resources. However, the methods I have seen so far, res.send() and res.download() both tries to send the file as attachment rather a link that can be used later to download.
Basically, the behavior is like a regular file sharing site where, once a file is clicked, a link to it is generated which, is used for downloading the file. How can I do this?
Related
I used the antDesign file upload component in one form. After the file is fully uploaded, I save the file information in the model I want to send to the server (the output of the file upload component is attached). Now my question is how should I save the file on the server with this information? Files are sent in different formats (png, jpg, pdf, ...) and I am looking for a solution to store these files on the server.
You should use originFileObj, get it and then append it to FormData, and afterward send it by using axios or fetch. There is an example in the antd documentation about it
I'm quite new to expressjs and I'm developing a web application which acts as an API application. There is a react frontend application also. When a button is clicked in the client app it will send an API call to the backend app and will download a file. That scenario is working fine.with the following code.
const file = `${__dirname}/upload-folder/dramaticpenguin.MOV`;
res.download(file); // Set disposition and send it.
});
But now I have a requirement to download multiple files from a button click. How can I do that .
Can someone help me here.
An HTTP response can only have one file. Really, "downloading a file" in HTTP means serving a response with a Content-Disposition: attachment header, to hint to the client that this response should be saved to the filesystem instead of rendered in the browser.
To download multiple files, you want the client code to initiate multiple HTTP requests (probably to different URLs), and the server can respond to each request with a different file. Note that many browsers will refuse to download multiple files in response to a single user action (for fear of flooding the user with unwanted files) or will at least prompt for confirmation before doing so.
If you cannot change your client-side code to make multiple requests, you will need to package your files inside a single file archive.
I have an angular application that has a feature to render the pdf in the client side with the help of ng2-pdfviewer, that reads the file from the local directory from the client side.
Now I have an upload option which uploads the pdf files to the server and storing it in local uploads directory in the server side. Now I want to read the physical pdf file available in the server instead of downloading as blob and saving.
Does anybody have any suggestions on how to do this?
ng2-pdf-viewer accepts both an UInt8Array (that fits your former approach on reading from a file utilising FileReader, for instance) or a string (that can contain a remote URL) on its src parameter.
So, as far as you have the complete URL for your target PDF, you can provide it as the source for rendering.
I am currently using dropbox file picker to download the file. I got the download link after selection of file using dropbox picker.
Is there any possibility that we can save it inside bytestream in browser and upload it to server(Node.JS) using http post call ?
Or Is there any alternative to this scenario ?
Any help would be appreciated.
Instead of downloading and reuploading the file on the browser, I would have this step to be processed on the server side.
You can use Dropbox and S3 sdk's and follow the steps below:
Make a call to the server that will send IDs of the list of files available in Dropbox.
Let the user select a file in the angular app and send the selected file's resource identifier back to the server.
Download the file and then re-upload it to the S3 on the server side.
Display the result/status back to the user.
Is there any reason you want this to be done in the frontend?
Good day!
Here's a question... we are storing a large file in the third party storage. The link to it is located on our website built with Express in Node. The goal is to make sure that the client doesn't see the path to the external website.
Examples:
File actual location: http://www.some.storage/bucket/SuperBigFile.exe
Path to file from our website: http://www.ourWeb.site/files/SuperBigFile.exe
I tired it with
res.redirect("http://www.some.storage/bucket/SuperBigFile.exe");
and
request('http://www.some.storage/bucket/SuperBigFile.exe').pipe(res);
request(...).pipe(res) would stream the file through our server and the file itself is a pdf report with a size of 300mb. Everything that goes through our primary server usually gets hung after 30-40mb, that was the primary reason of moving the file to the storage, but the client doesn't want the users to see the path to the storage...
Both versions redirect to download the file and it can be in fact accessed through http://www.ourWeb.site/files/SuperBigFile.exe url, but let's say if I'm using fidler debugger, I can see requests to the original file at the storage. Is there a way to hide it completely so, it won't be visible from the client side? So, the client would think that it is coming from our website?
Thanks.