Javascript - Is possible to download a file using multiple connections from browser? - javascript

Is there a way to download a file through multiple connections using javascript from client side? in order to speed up a AJAX download file (more than 10mb size by example).
In the same way as do AXEL or ARIA2, or exist another method to accomplish this.
Update
I want to make a comic/manga viewer (I don't know why, I just want to make it) that support open CBZ, CBR and CBT files, and these file have a least 10 mb size.

Related

How to stream a dynamically created tar archive to a browser client as a single file download?

I am creating a server application to transfer many (could be 100+GB) files from discrete servers as a single tar archive to a browser client via a simple single file download.
Currently I settled on streaming in each file to the main server handling the web app's HTTP request, adding it to a dynamically created tar archive, and then streaming out the archive as it's created using chunked transfer encoding.
This works nicely but has 2 main downsides:
No download progress indicator for the browser client/user
Difficult to resume a failed/interrupted download
I'm looking for advice for either different techniques to implement this app or ways to address the shortcomings above. Some of the constraints are that since the archive is generated on the fly, the server doesn't know exactly how large the final result will be (it does have a rough idea since it is not compressed currently, it's just total(file_size + file_padding), maybe this could be determined?). And there is limited disk space available on the server along with limited memory on server & client so the download needs to occur in a streaming fashion; ie not storing it all in-memory or on-disk on server or client before writing it out to client's disk.
I've thought about implementing this by having the browser download chunks of known size and writing it out to a file as it goes, but it's not clear to me that this can be done with today's filesystem access limitations? And also without holding the entire archive in-memory on the client side. Aand also while presenting it as a single download to the user instead of n separate downloads. Kept running into hiccups like this so wanted to see what y'all think
Thanks for your help :)

How browsers work on upload multiple file parts asynchronously

I'm designing and implementing split one big file into small chunks for upload.
I've tried chunk size for 1mb, 10mb, 100mb for uploading 1gb, 10gb files.
I tested it on Chrome browser and not found specific performance difference among above different chunk size.
Quick questions here. If I choose chunk size as 1mb for upload 10GB file.
There will be 10K chunks to upload. Is there any limitation for IE, Chrome, or Safari for doing this intensive task?
Usually, how many workers/threads will be using for uploading at a time?
Thanks a lot!
for(let chunkIndex=0; chunkIndex< LAST_CHUNK_INDEX ;chunkIndex++) {
SEND_CHUNK[chunkIndex] // Using axios or xhr for uploading files.
}
I haven't found any official document about limitation for chunks numbers about browsers. But it sometimes might have limitation when using some tool to upload to somewhere specific, like this.
About the working principle, we send each chunk as a separate request.
I found a sample of uploading file by chunk. And I found the comment made by rizsi is very useful:
The main reason for chunked upload is that the server does not need to store the whole file in memory - which is also possible to work around on the server side when data is streamed to file directly, the second reason is to make big file upload resumable in case the TCP stream breaks.
So we should send each chunk after the previous one has finished. If we send all chunks at once, it would flood the server with all the pieces at once making the whole thing pointless.

PHP: How to serve JPG files (from a webcam) as a stream or movie?

I have a set of images with filenames in the format webcam-<timestamp>.jpg located in a folder on the webserver. I want to serve them as a kind of timelapse slideshow to the client.
Is there a way to create a movie stream on-the-fly from these images (maybe as mjpeg) and serve this stream to a browser?
If not, is there way in PHP to take these files and convert them to a mjpeg file (or other movie format) and let the browser download/stream this file?
Do you have another idea how to create a kind of slideshow for webcam pictures like this (maybe using JS/AJAX)? Is there a project out there, which I can use (I am a really bad js scripter, so that would be a great help)?
In the past I used the jsmovie project, but jsmovie loads all pictures into the memory of the browser which can get quite a huge amount of RAM used on the client).
Any help or thoughts are appreciated!

Send multiple files to the user for download one after another

I'm trying to do the following:
A grid with a lot of files is shown to the user
The user selects as many files as he wants
The user should be prompted for each file for the target location
Each file should be downloaded one after another
I can't find a good solution for this because:
I need a cross browser solution (no plugins) but i can rely on IE10+ and HTML5
The files should not be downloaded as a zip file or any other archive
Using document.write for inserting multiple iframes feels bad and is discouraged by most browsers
I managed to build a possible example of downloading multiple files using the HTML FileSystem API. I ran into a few problems while building this which I'll note down below. Beware that this is just an example and could be improved by a lot (code-wise and feature-wise).
I stopped developing because I was unable to transfer binary files but maybe someone can give me a clue on how to do this. (I struggle with binary ajax transfers and JSON at the moment. (I can't say if it's possible to transfer images/binaries over ajax at all).
Published Sourcecode on GitHub:
https://github.com/posixpascal/FileSystem-API-Example
A few things to note:
Your users have to click 'Allow this webpage to download multiple files' as soon as the popup is visible. Otherwise it won't work.
This uses heavy I/O operations on the server side (at least with my
code). one should rewrite that before using this script.
Be aware of this issue: https://code.google.com/p/chromium/issues/detail?id=94314
Users with non-latin characters in their Windows Username aren't able to download the files.
You can't resume the download if you using TEMPORARY FileSystem Storage. (Chrome throws an error on my machine when I try to access the downloaded files twice)
Also be aware of loops, because it can screw other peoples browsers.
Youtube Example: https://www.youtube.com/watch?v=F9T4i4qrYtc&list=UUi1sRIczZxhsuWPPUK7xxTA
Live Example: http://pascalraszyk.de/_broken_do_not_use/
All I can say is that this is not a solution at the moment and the API isn't ready for the mass. You can add further support by using Flash and other utils to compensate lack of FileSystem API support.
How it works:
As soon as the user clicks on the download link, my script gathers information about the files using a server side PHP script. After that it requests a few chunks until the filesize from the locally stored file matches the one sent by the php script.
As soon as the file is ready, I create an invisible a tag and set href to "filesystem:myurl.de/theFile" and trigger a click event on that link. I also add 'download' property so the browser is forced to download .txt files as well.
This is not a fully solution to your problem but you can check the sourcecode and hopefully built something to suit your needs. I guess you already moved on to a different approach to download multiple files.
I found a solution that works (for me) in all browsers. It's does not feel that good on the code side (at first) but it seems pretty stable to me on different browsers and different machines.
Chrome will ask the user to allow the site to download multiple files. IE doesn't care at all.
var onDownload = function(){
var docs = module.getSelectedElements();
for(var i = 0; i < docs.length; i ++) {
(function(){
var doc = docs[i];
window.setTimeout(function(){
$jq("#downloadIframe").attr("src", doc.url);
}, i * 500);
})();
}
};

Read JSON from local disk using browser

I am working on a content management project where from a tool we generate html/js/css
and image files. The data we store in JSON format.
Now, I want to play the contents using browser without any server, i checked some threads
and it suggests that it may be possible using file:// protocol, I want to check if there
is any limitation if I am not using any server. Or it is not possible to omit http server..
The other thing is that, I can't use concept of local storage because my data size is huge and in HTML5 the max size supported is 10 MB my requirement is approx 25 MB.
Please suggest.
Thanks.
Seems like an odd thing to do for a CMS, no? You can use the readfile API but you're limiting yourself to IE10+: http://caniuse.com/filereader
Edit, maybe should've been a comment but... If the data is only on clients computer, who can read the content of the CMS? Or are you creating 10MB+ files on every users computer?

Categories