Le pdf est stocké en local dans le CacheAPI et il transite mais n'est plus conservé

sur le serveur

app.php

@@ -8,11 +8,8 @@ if(getenv("DEBUG")) {
 
 $f3->set('ROOT', __DIR__);
 $f3->set('UI', $f3->get('ROOT')."/templates/");
-$f3->set('UPLOADS', $f3->get('ROOT').'/data/');
+$f3->set('UPLOADS', sys_get_temp_dir()."/");
 
-if(!is_dir($f3->get('UPLOADS'))) {
-    mkdir($f3->get('UPLOADS'));
-}
 $f3->route('GET /',
     function($f3) {
         $f3->set('key', hash('md5', uniqid().rand()));
@@ -51,6 +48,12 @@ $f3->route('POST /upload',
             $f3->error(403);
         }
 
+        if($f3->get('DEBUG')) {
+            return;
+        }
+
+        unlink($filePdf);
+
         return $f3->reroute('/'.$key);
     }
 );
@@ -103,12 +106,37 @@ $f3->route('POST /image2svg',
         if($f3->get('DEBUG')) {
             return;
         }
+
         array_map('unlink', glob($imageFile."*"));
     }
 );
 $f3->route('POST /@key/save',
     function($f3) {
         $key = $f3->get('PARAMS.key');
+        $files = Web::instance()->receive(function($file,$formFieldName){
+            if(strpos(Web::instance()->mime($file['tmp_name'], true), 'application/pdf') !== 0) {
+
+                return false;
+            }
+
+            return true;
+        }, true, function($fileBaseName, $formFieldName) use ($key) {
+
+            return $key.".pdf";
+	    });
+
+        $pdfFile = null;
+        foreach($files as $file => $valid) {
+            if(!$valid) {
+                continue;
+            }
+            $pdfFile = $file;
+        }
+
+        if(!$pdfFile) {
+            $f3->error(403);
+        }
+
         $svgData = $_POST['svg'];
         $filename = null;
         if(isset($_POST['filename']) && $_POST['filename']) {
@@ -130,9 +158,7 @@ $f3->route('POST /@key/save',
         if($f3->get('DEBUG')) {
             return;
         }
-        array_map('unlink', glob($f3->get('UPLOADS').$key."_*.svg"));
+        array_map('unlink', glob($f3->get('UPLOADS').$key."*"));
-        unlink($f3->get('UPLOADS').$key.'.svg.pdf');
-        unlink($f3->get('UPLOADS').$key.'_signe.pdf');
     }
 );
 

public/js/app.js

@@ -1,3 +1,16 @@
+var canvasEditions = [];
+(async function () {
+
+const cache = await caches.open('pdf');
+var responsePdf = await cache.match(url);
+var pdfBlob = await responsePdf.blob();
+url = await URL.createObjectURL(pdfBlob);
+
+var dataTransfer = new DataTransfer();
+dataTransfer.items.add(new File([pdfBlob], filename, {
+    type: 'application/pdf'
+}));
+document.getElementById('input_pdf').files = dataTransfer.files;
 
 // Loaded via <script> tag, create shortcut to access PDF.js exports.
 var pdfjsLib = window['pdfjs-dist/build/pdf'];
@@ -5,8 +18,6 @@ var pdfjsLib = window['pdfjs-dist/build/pdf'];
 // The workerSrc property shall be specified.
 pdfjsLib.GlobalWorkerOptions.workerSrc = '/vendor/pdf.worker.js?legacy';
 
-var canvasEditions = [];
-
 // Asynchronous download of PDF
 var loadingTask = pdfjsLib.getDocument(url);
 loadingTask.promise.then(function(pdf) {
@@ -130,6 +141,7 @@ loadingTask.promise.then(function(pdf) {
             input_selected = null;
         }
 
+
         if(input_selected) {
             document.body.style.setProperty('cursor', 'copy');
         } else {

templates/index.html.php

@@ -33,41 +33,57 @@
     </footer>
 
     <script>
-        var key = "<?php echo $key ?>";
+        (async function () {
-        var pdfHistory = {};
+            const cache = await caches.open('pdf');
-        if(localStorage.getItem('pdfHistory')) {
+            var key = "<?php echo $key ?>";
-            pdfHistory = JSON.parse(localStorage.getItem('pdfHistory'));
+            var pdfHistory = {};
-        }
+            function dataURLtoBlob(dataurl) {
-        document.getElementById('input_pdf_upload').addEventListener('change', function(event) {
+                var arr = dataurl.split(','), mime = arr[0].match(/:(.*?);/)[1],
-            pdfHistory[key] = { filename: document.getElementById('input_pdf_upload').files[0].name }
+                    bstr = atob(arr[1]), n = bstr.length, u8arr = new Uint8Array(n);
-            localStorage.setItem('pdfHistory', JSON.stringify(pdfHistory));
+                while(n--){
-            document.getElementById('form_pdf_upload').submit();
+                    u8arr[n] = bstr.charCodeAt(n);
-        });
+                }
-        async function uploadFromUrl(url) {
+                return new Blob([u8arr], {type:mime});
-            var response = await fetch(url);
-            if(response.status != 200) {
-                return;
             }
-            var pdfBlob = await response.blob();
+            if(localStorage.getItem('pdfHistory')) {
-            if(pdfBlob.type != 'application/pdf' && pdfBlob.type != 'application/octet-stream') {
+                pdfHistory = JSON.parse(localStorage.getItem('pdfHistory'));
-                return;
             }
-            var dataTransfer = new DataTransfer();
+            document.getElementById('input_pdf_upload').addEventListener('change', async function(event) {
-            var filename = url.replace(/^.*\//, '');
+                var response = new Response(document.getElementById('input_pdf_upload').files[0], { "status" : 200, "statusText" : "OK" });
-            dataTransfer.items.add(new File([pdfBlob], filename, {
+                await cache.put('/'+key+'/pdf', response);
-                type: 'application/pdf'
+                console.log(await (await cache.match('/'+key+'/pdf')).blob());
-            }));
-            document.getElementById('input_pdf_upload').files = dataTransfer.files;
-            document.getElementById('input_pdf_upload').dispatchEvent(new Event("change"));
 
-            history.replaceState({}, "Signature de PDF", "/");
+                pdfHistory[key] = { filename: document.getElementById('input_pdf_upload').files[0].name }
-        }
+                localStorage.setItem('pdfHistory', JSON.stringify(pdfHistory));
-        if(window.location.hash) {
+                document.getElementById('form_pdf_upload').submit();
-            uploadFromUrl(window.location.hash.replace(/^\#/, ''));
+            });
-        }
+            async function uploadFromUrl(url) {
-        window.addEventListener('hashchange', function() {
+                var response = await fetch(url);
-            uploadFromUrl(window.location.hash.replace(/^\#/, ''));
+                if(response.status != 200) {
-        })
+                    return;
+                }
+                var pdfBlob = await response.blob();
+
+                if(pdfBlob.type != 'application/pdf' && pdfBlob.type != 'application/octet-stream') {
+                    return;
+                }
+                var dataTransfer = new DataTransfer();
+                var filename = url.replace(/^.*\//, '');
+                dataTransfer.items.add(new File([pdfBlob], filename, {
+                    type: 'application/pdf'
+                }));
+                document.getElementById('input_pdf_upload').files = dataTransfer.files;
+                document.getElementById('input_pdf_upload').dispatchEvent(new Event("change"));
+
+                history.replaceState({}, "Signature de PDF", "/");
+            }
+            if(window.location.hash) {
+                uploadFromUrl(window.location.hash.replace(/^\#/, ''));
+            }
+            window.addEventListener('hashchange', function() {
+                uploadFromUrl(window.location.hash.replace(/^\#/, ''));
+            })
+        })();
     </script>
 </body>
 </html>

templates/pdf.html.php

@@ -68,8 +68,9 @@
                   <button type="button" id="btn-add-svg" class="btn btn-sm btn-light" data-bs-toggle="modal" data-bs-target="#modalAddSvg"><i class="bi bi-plus-circle"></i> Ajouter un élément</button>
               </div>
 
-              <form class="position-absolute bottom-0 pb-2 ps-0 pe-4 w-100 d-none d-sm-none d-md-block" id="form_pdf" action="/<?php echo $key ?>/save" method="post">
+              <form class="position-absolute bottom-0 pb-2 ps-0 pe-4 w-100 d-none d-sm-none d-md-block" id="form_pdf" action="/<?php echo $key ?>/save" method="post" enctype="multipart/form-data">
                     <input id="input_filename" type="hidden" name="filename" value="" />
+                    <input id="input_pdf" name="pdf" type="file" class="d-none" />
                     <div class="d-grid gap-2 mt-2">
                         <button class="btn btn-primary" disabled="disabled" type="submit" id="save"><i    class="bi bi-download"></i> Télécharger le PDF Signé</button>
                     </div>