Download file using Angular and Spring Boot


In this post I will show you how to download file using Angular 7/8/10 and Spring Boot. There are situations when you need to download file from server or you need to generate report from database and download it. This example may help you in such situation.

I will build the Spring Boot application using both maven and gradle. Here I will fetch records from database and download in a JSON format. As a server side technology we will use Spring Boot and in client side we will use Angular 7/8/10.

Related Posts:


Eclipse 2020-06, Java at least 1.8, Gradle 6.5.1, Maven 3.6.3, Spring Boot 2.3.2, H2 Database 1.4.200, JAXB-API if you are using JDK 9 or above

Download file from server using Angular

Project Setup

Create gradle based project in Eclipse and the name of the project is spring-file-download.


Update the default generated content in build script. You need to include the required dependencies for Spring Boot, JPA and H2 in-memory database. We are using in-memory database to do a quick PoC. You can use any database as per your project requirements.

buildscript {
	ext {
		springBootVersion = '2.3.2.RELEASE'
    repositories {
    dependencies {

plugins {
    id 'java-library'
    id 'org.springframework.boot' version "${springBootVersion}"

sourceCompatibility = 12
targetCompatibility = 12

repositories {

dependencies {
	implementation "org.springframework.boot:spring-boot-starter-web:${springBootVersion}"
	implementation "org.springframework.boot:spring-boot-starter-data-jpa:${springBootVersion}"
	//required for jdk 9 or above


If you are using maven based build tool for your application then you can use below pom.xml.

<project xmlns=""




		//required only if jdk 9 or higher version is used

					<source>at least 8</source>
					<target>at least 8</target>

Application Properties File

Create a property file called application.yml under classpath directory src/main/resources with the below content to enable h2 console and log the SQL statement used for database operations in pretty format in the console.

      show-sql: true
         enabled: true

JPA Entity Class

We need an entity class to map our Java attribute to database table’s column.

We will not create any SQL script for creating table in h2 database but Spring Boot will automatically create the table for below entity class.

If we do not specify the column name for the corresponding Java attribute or field then the same attribute name will be used to create column in the database table.

You don’t need to define any datasource when you are using in-memory embedded database h2.


import javax.persistence.Column;
import javax.persistence.Entity;
import javax.persistence.GeneratedValue;
import javax.persistence.GenerationType;
import javax.persistence.Id;

public class Employee {
	@GeneratedValue(strategy = GenerationType.IDENTITY)
	private Integer id;

	private String name;

	@Column(name = "email_address")
	private String email;

	public Employee() {

	public Employee(Integer id, String name, String email) { = id; = name; = email;

	// getters and setters


Sample Data into Table

Spring Boot will create table from entity class but we need to insert some data into the table.

So we will create a SQL script called data.sql under classpath directory src/main/resources as shown below:

insert into employee(name,email_address)
insert into employee(name,email_address)
insert into employee(name,email_address)
insert into employee(name,email_address)

Spring JPA Repository

Spring has excellent API called Spring Data JPA Repository that gives us many benefits out of the box. You just need to write methods by extending JpaRepository interface for performing basic CRUD operations. Then Spring will generate appropriate queries for your methods.




public interface EmployeeRepository extends JpaRepository<Employee, Integer> {


Create VO Class

It’s a good idea to create DTO or VO class as a response object rather than entity class.


public class EmployeeVo {

	private Integer id;
	private String name;
	private String email;

        //getters and setters


Spring Service Class

Service class is always used to process your business for the application.


import java.util.List;

import org.springframework.beans.factory.annotation.Autowired;
import org.springframework.stereotype.Service;


public class EmployeeService {

	private EmployeeRepository employeeRepository;

	public List<EmployeeVo> getEmployeeList() {
		List<Employee> list = employeeRepository.findAll();
		return -> {
			EmployeeVo vo = new EmployeeVo();
			return vo;


Spring REST Controller

The Spring REST Controller class is responsible for handling request/response for the end users or clients.

Here in the below Spring REST controller class, we fetch the data from database and convert into JSON data to send to the client as byte array.

We allow request and response for the origin http://localhost:4200 using @CrossOrigin(origins = "http://localhost:4200"). If you do not allow cross-origin request/response for the mentioned URL then you won’t be able to download file. You can also put * to allow all origins.


import java.util.List;

import org.springframework.beans.factory.annotation.Autowired;
import org.springframework.http.HttpHeaders;
import org.springframework.http.HttpStatus;
import org.springframework.http.MediaType;
import org.springframework.http.ResponseEntity;
import org.springframework.web.bind.annotation.CrossOrigin;
import org.springframework.web.bind.annotation.GetMapping;
import org.springframework.web.bind.annotation.RestController;

import com.fasterxml.jackson.databind.ObjectMapper;

@CrossOrigin(origins = "http://localhost:4200")
public class EmployeeRestController {

	private EmployeeService employeeService;

	public ResponseEntity<byte[]> downloadFile() throws Exception {
		List<EmployeeVo> employees = employeeService.getEmployeeList();
		ObjectMapper objectMapper = new ObjectMapper();
		String json = objectMapper.writeValueAsString(employees);
		byte[] isr = json.getBytes();
		String fileName = "employees.json";
		HttpHeaders respHeaders = new HttpHeaders();
		respHeaders.setContentType(new MediaType("text", "json"));
		respHeaders.setCacheControl("must-revalidate, post-check=0, pre-check=0");
		respHeaders.set(HttpHeaders.CONTENT_DISPOSITION, "attachment; filename=" + fileName);
		return new ResponseEntity<byte[]>(isr, respHeaders, HttpStatus.OK);


Create Main Class

Create below main class to deploy the application into embedded Tomcat server.

We need to let Spring container know where are our entity class and repository interface. You can also use a separate configuration class to enable such things.


import org.springframework.boot.SpringApplication;
import org.springframework.boot.autoconfigure.SpringBootApplication;
import org.springframework.boot.autoconfigure.domain.EntityScan;

public class SpringRestFileDownload {
	public static void main(String[] args) {, args);

Testing the Application

Run the main class to deploy the application into Tomcat server.

If you hit the URL http://localhost:8080/employee/download in the browser then you will get the file for save as option. Even you can test the same using Postman or any other REST client.

Also run the Angular application to open in browser.

Once your application opens at URL http://localhost:4200 in the browser and the page may look similar to the below image:

download file using angular and spring boot

When you click on link or button for downloading file you will see below page with file save option:

download file using angular and spring boot

Source Code

source code

Thanks for reading.

Leave a Comment