From 75623da07e282fe2f80d6bcdd57cd5aed5af5bd0 Mon Sep 17 00:00:00 2001 From: Equilibrium ITO Date: Mon, 18 Mar 2024 12:59:41 +0100 Subject: [PATCH] download file on web fixed --- package-lock.json | 11 +++++++++ package.json | 1 + src/app/pages/chat/messages/messages.page.ts | 1 + .../group-messages/group-messages.page.ts | 13 ++++++----- src/app/shared/chat/messages/messages.page.ts | 23 ++++++++++--------- 5 files changed, 32 insertions(+), 17 deletions(-) diff --git a/package-lock.json b/package-lock.json index df3443228..7acae877e 100644 --- a/package-lock.json +++ b/package-lock.json @@ -136,6 +136,7 @@ "duration": "^0.2.2", "faker": "^5.5.3", "fifo-process-queue": "^1.2.0", + "file-saver": "^2.0.5", "firebase": "^8.10.1", "g": "^2.0.1", "global": "^4.4.0", @@ -16463,6 +16464,11 @@ "node": ">=4" } }, + "node_modules/file-saver": { + "version": "2.0.5", + "resolved": "https://registry.npmjs.org/file-saver/-/file-saver-2.0.5.tgz", + "integrity": "sha512-P9bmyZ3h/PRG+Nzga+rbdI4OEpNDzAVyy74uVO9ATgzLK6VtAsYybF/+TOCvrc0MO793d6+42lLyZTw7/ArVzA==" + }, "node_modules/file-uri-to-path": { "version": "1.0.0", "resolved": "https://registry.npmjs.org/file-uri-to-path/-/file-uri-to-path-1.0.0.tgz", @@ -56230,6 +56236,11 @@ "escape-string-regexp": "^1.0.5" } }, + "file-saver": { + "version": "2.0.5", + "resolved": "https://registry.npmjs.org/file-saver/-/file-saver-2.0.5.tgz", + "integrity": "sha512-P9bmyZ3h/PRG+Nzga+rbdI4OEpNDzAVyy74uVO9ATgzLK6VtAsYybF/+TOCvrc0MO793d6+42lLyZTw7/ArVzA==" + }, "file-uri-to-path": { "version": "1.0.0", "resolved": "https://registry.npmjs.org/file-uri-to-path/-/file-uri-to-path-1.0.0.tgz", diff --git a/package.json b/package.json index b942356d9..07fa5a961 100644 --- a/package.json +++ b/package.json @@ -152,6 +152,7 @@ "duration": "^0.2.2", "faker": "^5.5.3", "fifo-process-queue": "^1.2.0", + "file-saver": "^2.0.5", "firebase": "^8.10.1", "g": "^2.0.1", "global": "^4.4.0", diff --git a/src/app/pages/chat/messages/messages.page.ts b/src/app/pages/chat/messages/messages.page.ts index 8d856487f..e8b1dda24 100644 --- a/src/app/pages/chat/messages/messages.page.ts +++ b/src/app/pages/chat/messages/messages.page.ts @@ -866,6 +866,7 @@ export class MessagesPage implements OnInit, AfterViewInit, OnDestroy { console.log('RESULT', resultt.files[0].data) const blobb = this.fileService.base64toBlob(resultt.files[0].data, resultt.files[0].mimeType) + const blob = new Blob([resultt.files[0].data], {type: resultt.files[0].mimeType}); const formDataa = new FormData(); formDataa.append('blobFile', blobb); diff --git a/src/app/shared/chat/group-messages/group-messages.page.ts b/src/app/shared/chat/group-messages/group-messages.page.ts index ee9024b20..f9defb299 100644 --- a/src/app/shared/chat/group-messages/group-messages.page.ts +++ b/src/app/shared/chat/group-messages/group-messages.page.ts @@ -1034,11 +1034,12 @@ export class GroupMessagesPage implements OnInit, OnChanges, AfterViewInit, OnDe } downloadFileFromBrowser(fileName: string, data: any): void { - const linkSource = data; - const downloadLink = document.createElement("a"); - downloadLink.href = linkSource; - downloadLink.download = fileName; - downloadLink.click(); + const link = document.createElement("a") + link.href = `data:${data.type}';base64,${data.image_url}`; + link.download = fileName + link.click() + + link.remove() } b64toBlob(b64Data, contentType) { @@ -1120,7 +1121,7 @@ export class GroupMessagesPage implements OnInit, OnChanges, AfterViewInit, OnDe }); modal.present(); } else { - this.downloadFileFromBrowser(msg.attachments[0].title, msg.attachments[0].attachmentsUrl) + this.downloadFileFromBrowser(msg.attachments[0].title, msg.attachments[0]) } } else { this.openFile(msg.attachments.image_url, msg.attachments[0].title, msg.file.type); diff --git a/src/app/shared/chat/messages/messages.page.ts b/src/app/shared/chat/messages/messages.page.ts index e9c5bda86..5930eaded 100644 --- a/src/app/shared/chat/messages/messages.page.ts +++ b/src/app/shared/chat/messages/messages.page.ts @@ -35,6 +35,7 @@ import { ChatMessageDebuggingPage } from 'src/app/shared/popover/chat-message-de import { PermissionService } from 'src/app/services/permission.service'; import { FileValidatorService } from "src/app/services/file/file-validator.service" import { ChangeDetectorRef } from '@angular/core'; +import { saveAs } from 'file-saver'; const IMAGE_DIR = 'stored-images'; @@ -141,7 +142,7 @@ export class MessagesPage implements OnInit, OnChanges, AfterViewInit, OnDestroy this.ChatSystemService.openRoom(this.roomId) this.ChatSystemService.getDmRoom(this.roomId) - this.ChatSystemService.getDmRoom(this.roomId).setChangeDetector(()=> { + this.ChatSystemService.getDmRoom(this.roomId).setChangeDetector(() => { this.changeDetector() }) @@ -712,7 +713,7 @@ export class MessagesPage implements OnInit, OnChanges, AfterViewInit, OnDestroy source: CameraSource.Camera }); - console.log('FILE CHAT',file) + console.log('FILE CHAT', file) const imageBase64 = 'data:image/jpeg;base64,' + file.base64String const blob = this.dataURItoBlob(imageBase64) @@ -886,7 +887,7 @@ export class MessagesPage implements OnInit, OnChanges, AfterViewInit, OnDestroy /* console.log('add file', fileBase64) */ } else { - console.log('encode data' ,encodedData) + console.log('encode data', encodedData) blob = this.fileService.base64toBlob(encodedData, file.type) fileBase64 = await this._getBase64(file) @@ -1093,13 +1094,13 @@ export class MessagesPage implements OnInit, OnChanges, AfterViewInit, OnDestroy } downloadFileFromBrowser(fileName: string, data: any): void { - const linkSource = data; - console.log('data in', data) - const downloadLink = document.createElement("a"); - downloadLink.href = linkSource; - console.log('downloadLink.href',downloadLink.href) - downloadLink.download = fileName; - downloadLink.click(); + + const link = document.createElement("a") + link.href = `data:${data.type}';base64,${data.image_url}`; + link.download = fileName + link.click() + + link.remove() } viewDocument(file: any, url?: string) { @@ -1167,7 +1168,7 @@ export class MessagesPage implements OnInit, OnChanges, AfterViewInit, OnDestroy }); modal.present(); } else { - this.downloadFileFromBrowser(msg.attachments[0].title, msg.attachments[0].attachmentsUrl,) + this.downloadFileFromBrowser(msg.attachments[0].title, msg.attachments[0],) }