Ouvrir les documents de calcul à l'aide de window.open() et data: schéma
J'ai une page Web exécutée dans un navigateur qui génère un document HTML calculé que je souhaite ouvrir dans un nouvel onglet du navigateur.
La manière la plus simple et la plus sale est de procéder comme suit :
const w = window.open('', '_blank');
w.document.open();
w.document.write(htmlContents);
w.document.close();
C'est simple. Mais cela a des conséquences gênantes que je n'aime pas. Autrement dit, l'URL du nouvel onglet doit pointer quelque part , mais comme le nouveau document est calculé dynamiquement, il n'y a rien qui puisse pointer vers lui. Si je ne précise pas d'URL, il utilisera l'URL de ma page Web. Ainsi, si quelqu'un actualise l'onglet contenant le document généré, le document disparaît et une nouvelle instance de ma page Web est chargée à sa place. Cela peut dérouter les utilisateurs.
Je pense que ce qui répond le mieux à mes besoins, c'est d'utiliser l'URI des données. J'encode simplement l'intégralité du contenu de la page Web dans l'URI lui-même, puis j'utilise window.open() pour ouvrir cet URI. C'est moche, mais sémantiquement cohérent avec mon objectif : un document informatique autonome dans lequel on ne peut pas naviguer accidentellement lors de l'actualisation des pages.
J'ai construit pour cela un concept que je trouve très simple, comme suit :
const doc = encodeURIComponent('<html><body><p>Hello, world!</p></body></html>');
window.open(`data:text/html;charset=utf-8,${doc}`, '_blank');
Si j'exécute ce code, une nouvelle fenêtre clignote sur l'écran pendant une image puis se ferme immédiatement. Aucune erreur ne s'est produite.
Qu'est-ce que j'ai fait de mal ?
