Ich habe eine Webseite, die in einem Browser läuft, die ein berechnetes HTML-Dokument generiert, das ich in einem neuen Browser-Tab öffnen möchte.
Der einfache und schmutzige Weg ist, Folgendes zu tun:
const w = window.open('', '_blank');
w.document.open();
w.document.write(htmlContents);
w.document.close();
Es ist ganz einfach. Aber das hat einige unangenehme Konsequenzen, die mir nicht gefallen. Das heißt, die URL des neuen Tabs muss irgendwohin zeigen, aber da das neue Dokument dynamisch berechnet wird, gibt es nichts, was darauf verweisen könnte. Wenn ich keine URL angebe, wird die URL meiner Webseite verwendet. Wenn also jemand die Registerkarte mit dem generierten Dokument aktualisiert, verschwindet das Dokument und an seiner Stelle wird eine neue Instanz meiner Webseite geladen. Dies kann Benutzer verwirren. Ich denke, was meinen Anforderungen besser entspricht, ist die Verwendung von Daten-URI. Ich codiere einfach den gesamten Inhalt der Webseite in den URI selbst und verwende dann , um diesen URI zu öffnen. Es ist hässlich, aber semantisch im Einklang mit meinem Ziel: ein in sich geschlossenes Rechendokument, das bei Seitenaktualisierungen nicht versehentlich herausnavigiert werden kann.
Ich habe mir dazu ein meiner Meinung nach sehr einfaches Konzept wie folgt aufgebaut:
const doc = encodeURIComponent('<html><body><p>Hello, world!</p></body></html>');
window.open(`data:text/html;charset=utf-8,${doc}`, '_blank');
window.open()Wenn ich diesen Code ausführe, blinkt ein neues Fenster für einen Frame auf dem Bildschirm und wird dann sofort geschlossen. Es sind keine Fehler aufgetreten.
Was habe ich falsch gemacht?
![[Web-Frontend] Node.js-Schnellstart](https://img.php.cn/upload/course/000/000/067/662b5d34ba7c0227.png)
显然所有现代浏览器都已有意明确阻止这种数据 URI 的使用。太棒了。
黑板上的另一个勾号是“我需要的非常完美的东西最近被从我们身边拿走了”。呃。
从好的方面来说，这似乎可以更好地完成我想要的一切：