JsPDF - Interdiction de naviguer dans le cadre supérieur vers l'URL de données

Question

Après la mise à jour de Google Chrome, le rapport jsPDF dans une nouvelle fenêtre ne fonctionne plus.

La console affiche le message:

Non autorisé à naviguer dans le cadre supérieur des données: données: application / pdf; base64, JVBERi0xLjMKMyAwIG9iago8PC9UeXBlIC9QYWdlCi9QYXJlbnQgMSAwIFIKL1 ....

Pouvez-vous m'aider?

Merci.

Answer 1

Cela fonctionne bien maintenant que chrome a supprimé la navigation dans le cadre supérieur. Seul le téléchargement du pdf en chrome pose problème. Le téléchargement fonctionne bien dans firefox tho.

 var string = doc.output('datauristring');
var iframe = "<iframe width='100%' height='100%' src='" + string + "'></iframe>"
var x = window.open();
x.document.open();
x.document.write(iframe);
x.document.close();
 

Answer 2

Apparemment, Google Chrome a supprimé la prise en charge de la navigation par le haut, vous pouvez voir plus d'informations ici: https://groups.google.com/a/chromium.org/forum/#!topic/blink-dev/GbVcuwg_QjM

Vous pouvez essayer de convertir le fichier jsPDF en iFrame.

Answer 3

J'ai récemment eu le même problème en utilisant objet FileReader pour lire le contenu et de montrer ma JSReport.

 var reader = new FileReader();                        
 reader.onload = function (e) {
      window.open(reader.result, "_blank");
 }
 reader.readAsDataURL(blob);

Malheureusement, après chrome mise à jour de tous mes rapport cessé de travailler. J'ai essayé de résoudre ce problème en utilisant objet Blob et il marche encore mais si vous avez un bloqueur de pop-up, cela ne fonctionnera pas.

 var file = new Blob([blob], { type: 'application/pdf' });
 var fileURL = URL.createObjectURL(file);
 window.open(fileURL);

J'ai enfin trouver un moyen d'éviter ce problème en créant un iFrame dynamiquement après la lecture de ce sujet et j'ai décidé de partager la solution.

 var file = new Blob([blob], { type: 'application/pdf' });
 var fileURL = URL.createObjectURL(file);
 var win = window.open();
 win.document.write('<iframe src="' + fileURL + '" frameborder="0" style="border:0; top:0px; left:0px; bottom:0px; right:0px; width:100%; height:100%;" allowfullscreen></iframe>')

Answer 4

Peut-être que vous pouvez aider, créez une fonction à exporter avec l'attribut de téléchargement html5:

 var docPdf = doc.output();
exportToFile(docPdf,defaults.type);

function exportToFile(data,type){

    var hiddenElement = document.createElement('a');
    hiddenElement.href = 'data:text/'+type+';filename='+'exportar.'+type+';'+'charset=utf-8,' + encodeURI(data);
    hiddenElement.target = '_blank';
    hiddenElement.download = 'exportar.'+type;
    hiddenElement.click();
}
 

Answer 5

<iframe id="ManualFrame"
        frameborder="0"
        style="border:0"
        allowfullscreen>
</iframe>

<script>
    $(function () {
        setManualFrame();
    });

    function setManualFrame() {
        $("#ManualFrame").attr("height", screen.height);
        $("#ManualFrame").attr("width", screen.width);
        $("#ManualFrame").attr("src", "data:application/pdf;base64," + Your_PDF_Data);
    }
</script>