How to download Excel template file from folder attachment using angul

I work on project angular 7 and web API asp.net core 2.2 I face issue I can't get Template Excel file

Exist on Server found on folder Attachment and file Name Delivery.xlsx to download it .

I only Need When click on download Button download Template Excel file from folder attachment

my issue How to get file Delivery.xlsx from attachment Folder and assign it on angular 7 to download ?

component.html

"button" class="btn btn-success" value="Download" (click)="download()" style="margin: 20px 0;"/>

component.ts

download(file) {
let fileName = ???;
let checkFileType = fileName.split('.').pop();
var fileType;
if (checkFileType == ".xlsx") {
fileType = "application/vnd.openxmlformats officedocument.spreadsheetml.sheet";
}
this.DownloadFile(fileName, fileType)
.subscribe(
success => {
saveAs(success, fileName);
},
err => {
alert("Server error while downloading file.");
}
);
}
DownloadFile(filePath: string, fileType: string): Observable {
let fileExtension = fileType;
let input = filePath;
return this.http.get('https://localhost:44396/api/ApprovalQuality/download'+ "?fileName=" + input, {
responseType: 'blob',
observe: 'response'
})
.pipe(
map((res: any) => {
return new Blob([res.body], { type: fileExtension });
})
);
}

Web API .net core 2.2

[HttpGet]
[Route("Download")]
public IActionResult Download()
{
string filename = null;
if (filename == null)
return Content("filename not present");
var path = Path.Combine(
Directory.GetCurrentDirectory(),
"Attachment", filename);
var memory = new MemoryStream();
using (var stream = new FileStream(path, FileMode.Open))
{
stream.CopyTo(memory);
}
memory.Position = 0;
ExcelEx ex = new ExcelEx();
return File(memory, ex.GetContentType(path), Path.GetFileName(path));
}

follow below code

using System.Web.Http.Cors;
After that, add the below code inside web api Register method.
var cors = new EnableCorsAttribute("*", "*", "*"); //origins,headers,methods
config.EnableCors(cors);
//download file api
public HttpResponseMessage GetFile(string docFile) {
//Create HTTP Response.
HttpResponseMessage response = Request.CreateResponse(HttpStatusCode.OK);
//Set the File Path.
string filePath = System.Web.HttpContext.Current.Server.MapPath("~/Files/") + docFile + ".docx";
//Check whether File exists.
if (!File.Exists(filePath)) {
//Throw 404 (Not Found) exception if File not found.
response.StatusCode = HttpStatusCode.NotFound;
response.ReasonPhrase = string.Format("File not found: {0} .", docFile);
throw new HttpResponseException(response);
}
//Read the File into a Byte Array.
byte[] bytes = File.ReadAllBytes(filePath);
//Set the Response Content.
response.Content = new ByteArrayContent(bytes);
//Set the Response Content Length.
response.Content.Headers.ContentLength = bytes.LongLength;
//Set the Content Disposition Header Value and FileName.
response.Content.Headers.ContentDisposition = new ContentDispositionHeaderValue("attachment");
response.Content.Headers.ContentDisposition.FileName = docFile + ".docx";
//Set the File Content Type.
response.Content.Headers.ContentType = new MediaTypeHeaderValue(MimeMapping.GetMimeMapping(docFile + ".docx"));
return response;
}
//angular service
import {
Injectable
} from '@angular/core';
import {
Observable
} from 'rxjs';
import {
HttpClient,
HttpHeaders
} from '@angular/common/http';
@Injectable({
providedIn: 'root'
})
export class FileService {
url = 'https://localhost:44316/API/Demo';
constructor(private http: HttpClient) {}
public downloadFile(docFile: string): Observable < Blob > {
return this.http.get(this.url + '/GetFile?docFile=' + docFile, {
responseType: 'blob'
});
}
return this.http.post < string > (this.url + '/AddFileDetails/', data, httpOptions);
}
}

1 Reply

Know the answer? Post it — somebody with the same question will find it here.

Sachin Singh6y ago
follow below code
    using System.Web.Http.Cors;

After that, add the below code inside web api Register method.

    var cors = new EnableCorsAttribute("*", "*", "*"); //origins,headers,methods
    config.EnableCors(cors);


//download file api
        public HttpResponseMessage GetFile(string docFile) {
                //Create HTTP Response.
                HttpResponseMessage response = Request.CreateResponse(HttpStatusCode.OK);
                //Set the File Path.
                string filePath = System.Web.HttpContext.Current.Server.MapPath("~/Files/") + docFile + ".docx";
                //Check whether File exists.
                if (!File.Exists(filePath)) {
                    //Throw 404 (Not Found) exception if File not found.
                    response.StatusCode = HttpStatusCode.NotFound;
                    response.ReasonPhrase = string.Format("File not found: {0} .", docFile);
                    throw new HttpResponseException(response);
                }
                //Read the File into a Byte Array.
                byte[] bytes = File.ReadAllBytes(filePath);
                //Set the Response Content.
                response.Content = new ByteArrayContent(bytes);
                //Set the Response Content Length.
                response.Content.Headers.ContentLength = bytes.LongLength;
                //Set the Content Disposition Header Value and FileName.
                response.Content.Headers.ContentDisposition = new ContentDispositionHeaderValue("attachment");
                response.Content.Headers.ContentDisposition.FileName = docFile + ".docx";
                //Set the File Content Type.
                response.Content.Headers.ContentType = new MediaTypeHeaderValue(MimeMapping.GetMimeMapping(docFile + ".docx"));
                return response;
            }


//angular service

    import {
        Injectable
    } from '@angular/core';
    import {
        Observable
    } from 'rxjs';
    import {
        HttpClient,
        HttpHeaders
    } from '@angular/common/http';
    @Injectable({
        providedIn: 'root'
    })
    export class FileService {
        url = 'https://localhost:44316/API/Demo';
        constructor(private http: HttpClient) {}
        public downloadFile(docFile: string): Observable < Blob > {
            return this.http.get(this.url + '/GetFile?docFile=' + docFile, {
                responseType: 'blob'
            });
        }



            return this.http.post < string > (this.url + '/AddFileDetails/', data, httpOptions);
        }
    }
0