javascript 使用window.open()和数据打开计算文档:方案

wn9m85ua  于 2023-05-12  发布在  Java
关注(0)|答案(1)|浏览(137)

我在浏览器中运行了一个网页,它生成了一个计算的HTML文档,我想在新的浏览器选项卡中打开该文档。
简单而肮脏的方法是这样做的:

const w = window.open('', '_blank');
w.document.open();
w.document.write(htmlContents);
w.document.close();

很简单但这有一些我不喜欢的尴尬后果。也就是说,新选项卡的URL必须指向 * 某处 *,但由于新文档是动态计算的,因此没有任何地方可以指向它。如果我没有指定URL,它将使用我的网页的URL。因此,如果有人刷新了包含生成的文档的选项卡,该文档就会消失,而我的网页的一个新示例会加载到它的位置。这将使用户混淆。
我认为更适合我的需要的是使用data URI。我将简单地将网页的全部内容编码到URI本身中,并使用window.open()打开该URI。它很丑,但语义上符合我的目标:一个独立的计算文档,不会因为页面刷新而意外地被导航出去。
我构建了一个我认为非常简单的概念,就像这样:

const doc = encodeURIComponent('<html><body><p>Hello, world!</p></body></html>');
window.open(`data:text/html;charset=utf-8,${doc}`, '_blank');

如果我运行这段代码,一个新窗口在我的屏幕上 Flink 一帧,然后立即关闭。未出现错误。
我做错了什么?

ep6jt1vc

ep6jt1vc1#

all modern browsers have explicitly blocked this use of Data URIs on purpose好极了
黑板上的另一个标记是“我需要的非常完美的东西最近被从我们身边拿走了”。呃。
从好的方面来说,这似乎更好地完成了我想要的一切:

const html = '<html><body><p>Hello, world!</p></body></html>';
const blob = new Blob([html], { type: 'text/html'});
const url = URL.createObjectURL(blob);
window.open(url, '_blank');

相关问题