Skip to content Skip to sidebar Skip to footer

How To Add A Download Music Link On Webpage?

I want to show user a popup like shown below when he clicks on a 'Download music' link? If I use following code then after clicking on a link opens up browser embedded Music playe

Solution 1:

First, remove the onclick attribute from the anchor. You don't need to involve JavaScript for this.

Second, have your server return a content-disposition: attachment HTTP response header when the mp3 is requested. How you do this depends on your server. For example, in Apache, without involving a server side programming language you can use a Header directive. Or, see an example in Java (although you should set the correct content-type for an mp3).


Solution 2:

on nginx, you can add this on your nginx.conf

location ~* (.*\.mp3) {
    types { application/octet-stream .mp3; }
    default_type application/octet-stream;
}

and on apache add this on your httpd.conf or .htaccess

<FilesMatch "\.(?i:mp3)$">
  ForceType application/octet-stream
  Header set Content-Disposition attachment
</FilesMatch>

I used this on http://mp3boo.cc config and working very well to force download the mp3 files. hth


Solution 3:

You can add the following lines of code in your .htaccess file of your server to force a download of a particular file type from your server. Then a normal link should work.

<FilesMatch "\.(?i:mp3)$">
  ForceType application/octet-stream
  Header set Content-Disposition attachment
</FilesMatch>

Solution 4:

Explaining here how I did it:

1. Add following snippet in web.xml:



<pre><code>
<servlet>
      <servlet-name>MyDownloadServlet</servlet-name>
      <servlet-class>com.lokur.MyDownloadServlet</servlet-class>      
  </servlet>
  <servlet-mapping>
      <servlet-name>MyDownloadServlet</servlet-name>
      <url-pattern>*.download</url-pattern>
  </servlet-mapping>

</pre></code>

2. Add following in your servlet:



public class MyDownloadServlet extends HttpServlet {

    private static final long serialVersionUID = 1L;

    @Override
    protected void doPost(HttpServletRequest req, HttpServletResponse response)
            throws ServletException, IOException {


        //Set the headers.
        response.setContentType("application/x-download"); 
        response.setHeader("Content-Disposition", "attachment; filename=downloaded_horse.mp3");

    //TODO: pull the file path from the request parameters  
        InputStream fileIn = getServletContext().getResourceAsStream("mp3/horse.mp3");
        ServletOutputStream outstream = response.getOutputStream();

        byte[] outputByte = new byte[40096];

        while(fileIn.read(outputByte, 0, 40096) != -1)
        {
            outstream.write(outputByte, 0, 40096);
        }
        fileIn.close();
        outstream.flush();
        outstream.close();


    }


}


3. Finally this is the requested jsp:


<pre> <code>
       <%@ page language="java" contentType="text/html; charset=ISO-8859-1"
        pageEncoding="ISO-8859-1"

     %>  
    <body>  
    <form action="getMusicFile.download" method="post">
        Wanna download? <input type="submit" value="Download music"> 
      </form>  
    </body>



That's all to it!

Cheers,
Akshay :)

Post a Comment for "How To Add A Download Music Link On Webpage?"