简体   繁体   中英

File download via JavaScript?

So I had a thought today. I generate CSV from data already in memory in my JavaScript application, then pump that data to the user's browser via a File download prompt -- all in JavaScript --.

Is this possible?

If you want to do it entirely on the client-side, without any server interaction, you will need at least the help of Flash.

Give a look to Downloadify , is the best I've seen for client-side file generation.

Check the demo .

The solution to download local/client-side contents via javascript is not straight forward. I have implemented one solution using smartclient-html-jsp.

Here is the solution:

  1. I am in the project build on SmartClient. We need to download/export data of a grid (table like structure).
  2. We were using RESTish web services to serve the data from Server side. So I could not hit the url two times; one for grid and second time for export/transform the data to download.
  3. What I did is made two JSPs namely: blank.jsp and export.jsp.
  4. blank.jsp is literally blank, now I need to export the grid data that I already had on client side.
  5. Now when ever user asks to export the grid data (by clicking a link), I do below: a. Open a new window with url blank.jsp b. using document.write I create a form in it with one field name text in it and set data to export inside it. c. Now POST that form to export.jsp of same heirarchy. d. Contents of export.jsp I am pasting below are self explanatory.

// code start

<%@ page import="java.util.*,java.io.*,java.util.Enumeration"%>
<%
    response.setContentType ("text/csv");
    //set the header and also the Name by which user will be prompted to save
    response.setHeader ("Content-Disposition", "attachment;filename=\"data.csv\"");
    String contents = request.getParameter ("text");
    if (!(contents!= null && contents!=""))
        contents = "No data";
    else
        contents = contents.replaceAll ("NEW_LINE", "\n");

    //Open an input stream to the file and post the file contents thru the
    //servlet output stream to the client m/c

    InputStream in = new ByteArrayInputStream(contents.getBytes ());
    ServletOutputStream outs = response.getOutputStream();

    int bit = 256;
    int i = 0;
    try {
        while ((bit) >= 0) {
            bit = in.read();
            outs.write(bit);
        }
        //System.out.println("" +bit);
    } catch (IOException ioe) {
        ioe.printStackTrace(System.out);
    }
    outs.flush();
    outs.close();
    in.close();
%>
<HTML>
<HEAD>

</HEAD>

<BODY>


</BODY>
</HTML>

// code end

This code is tested and deployed/working in production environment, also this is cross-browser functionality.

Thanks Shailendra

If your server is setup to trigger a download for your given MIME type then you can simply do a straight location.href = 'myFile.csv' .

This will prompt the user to open or save the file as you'd like.

This does require that your server be configured to behave this way.

The technical post webpages of this site follow the CC BY-SA 4.0 protocol. If you need to reprint, please indicate the site URL or the original address.Any question please contact:yoyou2525@163.com.

 
粤ICP备18138465号  © 2020-2024 STACKOOM.COM