Simplify header checks

symfony · Jan 9, 2025 · 32cd824 · 32cd824
1 parent 36143e6
commit 32cd824
Show file tree

Hide file tree

Showing 2 changed files with 22 additions and 51 deletions.
diff --git a/src/LiveComponent/assets/dist/live_controller.js b/src/LiveComponent/assets/dist/live_controller.js
@@ -112,7 +112,7 @@ class BackendResponse {
         return this.body;
     }
     async getBlob() {
-        return await this.response.blob();
+        return this.response.blob();
     }
 }
 
@@ -2122,34 +2122,23 @@ class Component {
         this.isRequestPending = false;
         this.backendRequest.promise.then(async (response) => {
             const backendResponse = new BackendResponse(response);
+            const headers = backendResponse.response.headers;
             for (const input of Object.values(this.pendingFiles)) {
                 input.value = '';
             }
-            const headers = backendResponse.response.headers;
-            if (headers.get('X-Live-Download')) {
-                if (!(headers.get('Content-Disposition')?.includes('attachment') ||
-                    headers.get('Content-Disposition')?.includes('inline')) ||
-                    !headers.get('Content-Disposition')?.includes('filename=')) {
-                    throw new Error('Invalid LiveDownload response');
-                }
-                const fileSize = Number.parseInt(headers.get('Content-Length') || '0');
-                if (fileSize > 10000000) {
-                    throw new Error('File is too large to download (10MB limit)');
-                }
-                const fileName = headers.get('Content-Disposition')?.split('filename=')[1];
-                if (!fileName) {
-                    throw new Error('No filename found in Content-Disposition header');
-                }
+            const contentDisposition = headers.get('Content-Disposition');
+            const fileResponse = contentDisposition?.match(/^(attachment|inline).*filename="?([^;]+)"?/);
+            if (fileResponse) {
                 const blob = await backendResponse.getBlob();
-                const link = Object.assign(window.document.createElement('a'), {
-                    target: '_blank',
+                const link = Object.assign(document.createElement('a'), {
+                    href: URL.createObjectURL(blob),
+                    download: fileResponse[2],
                     style: 'display: none',
-                    href: window.URL.createObjectURL(blob),
-                    download: fileName,
+                    target: '_blank',
                 });
-                this.element.appendChild(link);
+                document.body.appendChild(link);
                 link.click();
-                this.element.removeChild(link);
+                setTimeout(() => document.body.removeChild(link), 75);
                 this.backendRequest = null;
                 thisPromiseResolve(backendResponse);
                 if (this.isRequestPending) {

diff --git a/src/LiveComponent/assets/src/Component/index.ts b/src/LiveComponent/assets/src/Component/index.ts
@@ -300,48 +300,30 @@ export default class Component {
 
         this.backendRequest.promise.then(async (response) => {
             const backendResponse = new BackendResponse(response);
+            const headers = backendResponse.response.headers;
 
             // clear sent files inputs
             for (const input of Object.values(this.pendingFiles)) {
                 input.value = '';
             }
 
-            const headers = backendResponse.response.headers;
-            if (headers.get('X-Live-Download')) {
-                const headerContentDisposition = headers.get('Content-Disposition');
-                if (
-                    !headerContentDisposition
-                    || !(headerContentDisposition?.includes('attachment') || headerContentDisposition?.includes('inline')) 
-                    || !headerContentDisposition?.includes('filename=')
-                ) {
-                    throw new Error('Invalid LiveDownload response');
-                }
-
-                const fileSize = Number.parseInt(headers.get('Content-Length') || '0');
-                if (fileSize > 10000000) {
-                    throw new Error('File is too large to download (10MB limit)');
-                }
-
-                const fileName = headerContentDisposition.split('filename=')[1];
-                if (!fileName) {
-                    throw new Error('No filename found in Content-Disposition header');
-                }
-
+            // File Download
+            const contentDisposition = headers.get('Content-Disposition');
+            const fileResponse = contentDisposition?.match(/^(attachment|inline).*filename="?([^;]+)"?/);
+            if (fileResponse) {
                 const blob = await backendResponse.getBlob();
-                const link = Object.assign(window.document.createElement('a'), {
-                    target: '_blank',
+                const link = Object.assign(document.createElement('a'), {
+                    href: URL.createObjectURL(blob),
+                    download: fileResponse[2],
                     style: 'display: none',
-                    href: window.URL.createObjectURL(blob),
-                    download: fileName,
+                    target: '_blank',
                 });
-                this.element.appendChild(link);
+                document.body.appendChild(link);
                 link.click();
-                this.element.removeChild(link);
+                setTimeout(() => document.body.removeChild(link), 75);
 
                 this.backendRequest = null;
                 thisPromiseResolve(backendResponse);
-
-                // do we already have another request pending?
                 if (this.isRequestPending) {
                     this.isRequestPending = false;
                     this.performRequest();