Prerequisites
Please answer the following questions before submitting an issue. YOU MAY DELETE THE PREREQUISITES SECTION.
- What is your product version? v8.70
- What is your product type (Angular or MVC)? Angular
- What is product framework type (.net framework or .net core)? .net core 3.1
If issue related with ABP Framework
- What is ABP Framework version?
If issue is about UI
- Which theme are you using?
- What are the theme settings?
I'm trying to download large files with the following code which returns a blob from .netcore 3.1
downloadFile(id): void {
let filedownloadInput = new FileDownloadInput();
filedownloadInput.id = id;
this._FileManagerService.downloadFile(filedownloadInput).subscribe(item => {
this.InitializeDownload(item.fileName, item.fileToken).subscribe((data: any) => {
var downloadURL = window.URL.createObjectURL(data);
var link = document.createElement('a');
link.href = downloadURL;
link.download = item.fileName;
link.click();
});
});
}
This works for small files (<10mb) but when large files are inbound, the response being saved to browser memory takes too long. I know that this method doesn't save directly to the filesystem, as it passes through the browser first, but is there a way to bypass saving the entire blob to browser memory first? So it seems like the browser caches the file first at which point the user does'nt see anything. You can only see the transfer with dev tools. Once it downloads to the browser memory then I can see the file downloading on the browser.
3 Answer(s)
-
0
Hi @mmorales
I don't have much knowledge about browser cache for downloaded file but what you want seems not possible to me. Normally browsers must show a progress while the download is in progress. Can you see such a progress ?
If not, could you also share;
- this._FileManagerService.downloadFile
- this.InitializeDownload
functions ?
-
0
I found angular code within the project (file-download.service.ts). The second method is the one I created, when calling this method I get an auth error on the core side.( INFO 2020-08-27 16:54:58,612 [5 ] Microsoft.AspNetCore.Hosting.Diagnostics - Request starting HTTP/2 GET https://localhost:44301/FileManager/GetFile?fileName=lvweb01.zip&fileToken=6c3041bd-a1f6-1634-121d-f0252cb4cb3d
INFO 2020-08-27 16:54:58,632 [5 ] uthorization.DefaultAuthorizationService - Authorization failed). Please advise**Angular ** export class FileDownloadService {
downloadTempFile(file: FileDto) { const url = AppConsts.remoteServiceBaseUrl + '/File/DownloadTempFile?fileType=' + file.fileType + '&fileToken=' + file.fileToken + '&fileName=' + file.fileName; location.href = url; //TODO: This causes reloading of same page in Firefox } downloadFiles(fileName: string, fileToken: string) { const url = AppConsts.remoteServiceBaseUrl + '/FileManager/GetFile?fileName=' + fileName + '&fileToken=' + fileToken; location.href = url; //TODO: This causes reloading of same page in Firefox }} Core public async Task<FileStreamResult> GetFile(string fileName, string fileToken) { Stream stream = null;
string filePath = Path.Combine(_env.WebRootPath, $"Common{Path.DirectorySeparatorChar}", $"Files{Path.DirectorySeparatorChar}", fileToken); stream = new FileStream(filePath, FileMode.Open, FileAccess.Read, FileShare.Read); var fileStreaResult = new FileStreamResult(stream, "application/pdf"); fileStreaResult.FileDownloadName = fileName; return fileStreaResult; } -
0
Hi @mmorales
Thank you. Our implementation is very basic and redirects user to file download URL. You can try something like this one which is more complex https://nils-mehlhorn.de/posts/angular-file-download-progress
