I've been using the Microsoft Technet site and you can download the ISO files by clicking a link on the page. The element is like this:
<a href="javascript:void(0)" onmouseout="HideToolTip()"
onmouseover="ShowToolTip(event,'Click here to download.')"
onclick="javascript:RunDownload('39010^313^164',event)"
class="detailsLink">Download</a>
I wasn't able to find the RunDownload() method in the scripts. And I wondered what it is likely to do. I mean usually when I provide a link for someone to download I provide an anchor to it:
download
But this is working differently what is the script doing? Because even when I ran 'Fiddler' I wasn't able to see the actual download location.
there's no such thing as a "javascript download" link. Javascript can open a new window, or simulate a click on a link.
What you have to find is which url the function triggered by this click will lead to.
here's an example of how to do it:
Suppose we have a:
<a id="download">download Here ยงยงยง</a>
then this jQuery code:
$('#download').click( function() {
window.location.href = 'http://example.org/download/ISO.ISO';
} );
will redirect to the URL http://example.org/download/ISO.ISO. Whether this url starts a download or not depends on HTTP headers and your browser, not on what javascript do.
Download location can be a url-rewritten path. This mean that maybe some parameters are given with HTTP Post and some HTTP handler in the Web server or web application may be getting some arguments from the HTTP request and write file bytes to an HTTP response, which absolutely hides where the file is located in the actual server's file system.
Maybe this is what's behind the scenes and prevents you to know the file location.
For example, we can have this:
http://mypage.com/downloads/1223893893
And you requested an executable like "whatever.exe" for downloading it to your hard disk. Where's the "http:/mypage.com/downloads/whatever.exe"? Actually, it doesn't exist. It's a byte array saved in a long database in some record, and "mypage" web application handles a request for a file that's identified as "1223893893" which can be a combination of an identifier, date time or whichever argument.
What I think the function RunDownload might do is that it might inform the server using get request to the server that another download is about to happen , or it might need to run the download background by setting the target attribute to an iframe so the user won't need to open another tab and download the file on the same page.
Download
JS
var runDownload=function(){
e.preventDefault();
increaseDownloadCountOnTheServer(location);
window.location.href="filelocation.exe";
}
Related
The anchor tag click automates the download. Are there events attached to anchor tags that I can listen on ?
downloadMyFile(){
const link = document.createElement('a');
link.setAttribute('href', 'abc.net/files/test.ino');
link.setAttribute('download', `products.csv`);
document.body.appendChild(link);
link.click();
link.remove();
}
You will not be able to be notified by the client when the download completes this way.
You have 2 possible solutions, which mostly depends on the size of the file.
Option 1: Use an ajax call instead, you can stream the whole file in memory and then make the browser download it to a file (which will be instant). This means you have full view on the different download events.
// Get the content somehow
// and then make the browser download
window.location.href = window.URL.createObjectURL(content);
Option 2: Monitor it with the server. I'd suggest you add a UID to the request like:
link.setAttribute('href', 'abc.net/files/test.ino?uid='+myUID);
Have the server keep track of that request and store details with the UID, you can then have another route report the status of the request when provided the UID. The problem with this is that you'd have to poll every now and then to know if the download is finished.
Since we do not know exactly the use for your request it is hard to tell if there are other possibilities. But IMHO there is no real use for you to know if the file has completed downloading. I cannot figure out why you'd want that in the beggining. I see it is a CSV file, they usually are not that big and the download should be real quick... Unless it is because it takes a lot of time to start since it has to be generated before? In this case I suggest you see a popular question/answer I made a while back. How to display a loading animation while file is generated for download?
Edit: Since the file may be big and not fit in memory, you could write the file on disk using the FileSystem API. This way you will be able to pipe the stream coming from your request directly to the filesystem. Since a stream has a close event, you'll be able to know when it is all done.
I am using angular and ASP.NET Web API to allow users to download files that are generated on the server.
HTML Markup for download link:
<img src="/content/images/table_excel.png">
<a ng-click="exportToExcel(report.Id)">Excel Model</a>
<a id="report_{{report.Id}}" target="_self"></a>
The last anchor tag is there to serve as a place holder for an automatic click event. The visible anchor calls the exportToExcel method to initiate the call to the server and begin creating the file.
$scope.exportToExcel = function(reportId) {
reportService.excelExport(reportId, function (result) {
var url = "/files/report_" + reportId + "/" + result.data.Model.fileName;
var dLink = document.getElementById("report_" + reportId);
dLink.href = url;
dLink.setAttribute('download', result.data.Model.fileName);
dLink.click();
});
}
The Web API code creates an Excel file. The file, on the server is about 279k, but when it is downloaded on the client it is only 7k. My first thought was that the automatic click might be happening before the file is completely written. So, I added a 10 second $timeout around the click event as a test. It failed with the same result.
This seems to only be happening on our remote QA server. On my local development server I always get the entire file back. I am at a loss as to why this might be happening. We have similar functionality where files are constructed from a database blob and saved to the local disk for download. The same method is employed for the client side download and that seems to work fine. I am wondering if anyone else has run into a similar issue.
Update
After the comment by SilentTremmor we think it actually may be IIS or some sort of Sever issue. Originally, we didn't think it could be, but after some digging it may be. It seems the instance of the client code is only allowing 7k of data to be downloaded. It doesn't matter what we try to download the result is always the same.
It turns out the API application was writing the file to a different instance of our application. The client code had no idea and was trying to download a file that did not exist. So, when the download link was creating the file it was empty, thus the small file size.
I have a page with a link to a file. When the link is clicked I use the code below to show a loading message:
$('#TerritoriesToExcelLink').click(function() {
$('#TerritoriesToExcelLoading').show();
window.location.href = $(this).attr('href');
});
I'd like to hide the message once the file is downloaded and the save dialog pops up in the browser.
I've tried adding some code that fires on ready() but that seems to just run straight away (presumably since the page is already loaded even if the file isn't) so the loading message never gets displayed.
How can I hide the loading message once the file has been completely downloaded?
Have your server send a random cookie that you specify from your client-side code with your download in the HTTP headers. Poll in your Javascript to check for the presence of the cookie. This should tell you when the browser has your file.
If you aren't opposed to using flash...
You could create an invisible flash object on the page, then when you click the download link, you could trigger flash to download the file, then handle the flash download complete event and use the ExternalInterface API to raise the event in javascript.
This is not possible to do with front end javascript, there is no way for it to retrieve the progress of a download and it doesn't have any events relating to downloads.
I don't think tracking the progress can be done with server side languages either.
This is what I want to do:
I want to send an HTTP request to a server, potentially returning a PDF file. But the server may also just return an error code (PDF file unavailable, PDF file invalid, PDF system down, etc). When I get the PDF, I would like to open the PDF and refresh the page that loaded the PDF, because the PDF is then marked as "read". When I get an error code (or timeout), I would like to redirect the page to an error screen. Downloading Google Chrome works in a similar manner:
http://www.google.com/chrome/eula.html?hl=en&platform=win
This is what I don't want do:
For performance reasons, I don't want to issue two requests as suggested in this question here:
Download and open pdf file using Ajax
Two requests can mean:
Make a request for the PDF and return a code to indicate whether the PDF is available or not. If unavailable, immediately display an error page
If it is available, open a window and request the PDF again in that window, and display it.
That's expensive because the PDF's have to be accessed via remote systems. I don't want to access the PDF resource twice. Another solution involving two requests:
Make a request for the PDF and retrieve an error code or a temporary URL where the PDF is cached. On error, immediately display an error page
If the PDF is available, open a window in which the cached PDF is displayed.
This will require for quite a large cache for the PDF's
This might be an interesting lead:
I found this question here giving me some information about how I could download the binary data and make it available in JavaScript as binary data:
Is there a way to read binary data in JavaScript?
Maybe that's a nice lead, but of course it won't solve my problem yet, as I want to use the browser's default editor to open the file, just as if I had requested the file from a normal URL.
So the question is:
Can I download binary data and open them like a regular document from JavaScript? If not, I'll cache the document in some managed memory container in Weblogic and just hope that this won't kill our system. Please only respond:
If you know for sure it cannot be done (some links explaining why would be nice)
If you know how to do it
If you have a different solution doing roughly what I want to do (not issuing two requests)
The implemented "old-school" solution works like this:
The JavaScript client sends an AJAX request to the server to "prepare" a PDF document
The server responds with any of these three messages:
a) Document available at URL http://www.example.com/doc.pdf
b) Document unavailable
c) Document being "prepared" (i.e. client has to wait)
The JavaScript client then reacts as such:
a) Open the returned URL in a new window, refresh the current window after 5 seconds
b) The current window is redirected to an error screen
c) The current window stays unchanged and AJAX polling is implemented to repeat step 2
I'm new to web development, so I apologize if this question is noobish. I want to serve a file that is on the server's hard drive to the user when requested (ie, send an HTTP attachment to trigger the browser's "Save as..." dialog) in Javascript. The user clicks on a button on the page, the server generates a customized data file based on some of his/her account settings (and other parameters), and then the "Save as..." dialog should pop up. How should I go about implementing this in Javascript?
edit: for your reference, the server has Glassfish and Apache
Jane,
The save-as dialog only appears on page load. You need to redirect your user either directly to the file you want them to save, or to a server-side page that serves up the file.
Once you know the address of the file, do something like
window.location = http://yourserver.com/generatedfiles/file_2342342.txt
Alternatively, do something like this:
window.location = http://yourserver.com/getgeneratedfile.aspx?fileID=2342342
...which would redirect the user to a page that feeds the generated file. You then need to specify the content-disposition and filename in the header that comes from that page, as mentioned in Gandalf's reply.
Edit: Ah, you're using Apache. Probably won't have ASPX files on there then.
Set the Http Response header:
Content-Disposition: attachment; filename=myfile.txt
Or something like this
Save this page
#aric's answer is correct; however, window.location will cause load/unload events to get fired which may not be desirable for your application. In this case, you can likely direct a hidden iframe to the url to cause the save dialog to appear without losing your page's state.
Also, 'SaveAs' is probably an IE specific value for document.execCommand as it doesn't exist in Firefox.