Buffering a client-side file download - javascript

I have a file which is split up into multiple parts on the server side. The complete file is huge, it can be 10 or more gigabytes in size (that is the reason for splitting it in the first place).
The file is in a specific format, and it has to be processed on the client side before being downloaded.
Now, I know that I can download into a Blob to the client side, do the processing, then download Blobs from there with this approach: JavaScript blob filename without link
The problem here is that I would need to construct a single huge blob from all the file parts on the client side, which I do not want, because it will probably exceed RAM limitations rather quickly.
I would like to download each part of the file individually and then process it and download the "partial" blob. That means that I would need to start a download and then piece by piece add blobs to it until the download is complete.
Is there any possibility of doing this? How? I know that mega.co.nz does something similar with file downloads where they process the file on the client side first (for decryption). Are they using such techniques?

You can save the downloaded parts to localStorage. You will have to serialize each part into a string first; then you can call localStorage.setItem. Your code might look like this:
localStorage.setItem('download-part-' + chunkIndex, chunkDataAsString);
chunkDataAsString = ''; // let the garbage collector collect the large string

Related

Client side validation of png file in javascript

I have a simple web application to manipulate image files in the browser.
It is entirely client side. I had some questions about the safety of the operation here : Is this client side application secure?
I want to validate the files to make sure only allowed formats can be 'uploaded'. I put uploaded in quotations because, I'd like to repeat, everything happens on the client side in javascript.
PNG files specifically
I am learning about the structure of png files and I am thinking of using the fileReader object and the method readAsArrayBuffer() to read the bytes of the png file so that I can evaluate the first 8 bytes of the header (137 80 78 71 13 10 26 10) along with the chunk types (like IHDR, IDAT, IEND etc.) and the CRCs. In fact I have already done so but it isn't a part of my web app. Basically, when a user tries to 'upload' a file, my app would spot check some key bytes of the file and determine roughly 'OK, this is a png file. It's ok to work with this file'.
Would this be a good enough validation?
My reasoning for this precaution, even to this whole thing is client-side, is to protect an unsuspecting end user who might 'upload' a file that looks like a png, but which actually contains some harmful script with it.
If this isn't sufficient, I'm hoping someone can point me in such a direction so that I will know what does constitute a proper validation.

Generating HTML file (or Zip with html inside) for user to download

I want to create a website, where user fills out the form and after submitting I want to generate a html file for him with the data he filled and then allow him to download this file.
Is it possible with JS without server side JS?
You can create a link where href property is an encoded URI.
let exampleText ="My Name\nMy Surname\nMy Town\n"
let localfile = "data:text/plain;charset=utf-8," + encodeURIComponent(exampleText);
document.getElementById("linkfile").setAttribute("href", localfile);
<a id="linkfile" download="myInfo.txt">Click here to download</a>
If you want to do it JUST frontend side. You could use zip.js to convert those files into a zip, then convert it into a binary array, then convert it into a blob file, and prompt for download using this question.
You may have to casts your html files into DOM "File"s, this might be very slow on mobile since all processing will be done on client side.

Javascript: Save uploaded file

I would like to save uploaded file using javascript, in my linux server. The code I wrote is:
if (uploadInput.files.length == 0) {
console.log("No file is uploaded. ");
} else {
console.log("File uploaded.");
var file = uploadInput.files[0];
}
Now I would like to save that file as "files/upload.csv". Can anyone please advise, how can I do it?
Thanks in advance
What I'm going to do is walk you through the logic, instead of providing code. There is just not enough information here on what you want to do to provide actual code and the sample you provided is a very small part of what the actual solution would need to include.
I'm assuming the code you wrote above is meant to run on a website visitor's browser (client-side). Client-side code can't save to a server. What it can do, is send the file contents to the server. But then you'd need something on the server side to process that file contents and actually save it to the server-side files directory.
One method to send the file contents from the client to the server is to use AJAX - you can do this with native javascript, but I would recommend looking into a library such as Jquery, which makes it a lot easier. See http://api.jquery.com/jquery.ajax/ This AJAX code will need a communication point on the server to send the file contents to. From your profile it seems you're familiar with PHP. You could make a php file on the server (say receivefilecontents.php) that takes in input from that client-side AJAX call, and then saves it to a server directory - you could also do this in Python, Java or a number of other languages.

how to get data from a base64 encoding of a .pptx file in javascript

I get data from a server of the .pptx file in base64 encoding now i would like to get the text that is present inside the base64 data.
Is there any third party java script library to do this especially scanning in base64 code rather than taking the file path and i would like insert these strings into a power point using office js.
Client side would be preferred.
thanks
Seems that what you need is a JavaScript decoder for base64 files, there are many projects in Github Doing this, for instance here is one https://github.com/mathiasbynens/base64.
That said, I am not sure about your scenario, and what types of files are been base64-encoded. Base64 at the end of the day is a text "representation" of usually a binary file, like an image or a compressed zip file. I wonder if once you decode it you will get what you expect. And if you are expecting text, i wonder why your service is even encoding it like this.
Anyways... once you have whatever text you want to insert, you can use the setSelectedDataAsync method of our Office.js in PPT to write it in your presentation's active selection. https://dev.office.com/reference/add-ins/shared/document.setselecteddataasync

Get file size (in bytes) on client side

I make multiple file uploading project, (Server language is PHP)
Especially, I need that before uploading, on client side, get files size in bytes.
what is today best cross browser solution/plugin for this?
I find SWFUpload, may be exists better solution? or use this SWFUpload?
In HTML5 a file drag & drop event creates a File object which has a .size property.
Look in ev.dataTransfer for the list of File objects.

Categories

Resources