likes
comments
collection
share

震惊,白学window.open了

作者站长头像
站长
· 阅读数 12

前言

实际上一直发现,window.open对于不同文件类型会有不同的动作,比如对于图片,是直接打开,而对于有些压缩文件xlsx是直接下载,实际上我一直认为这是种浏览器的默认的行为,以致于我一直使用CreateObjUrl这种方式产生一个同源的url,然后再构造a标签来下载,以保证下载动作的一致性。

Content-Disposition

但实际上Content-Disposition能够控制window.open的行为,先来看看它的描述Content-Disposition - HTTP | MDN (mozilla.org) 震惊,白学window.open了

可以看到,Content-Disposition可以决定内容是自动显示在网页中,还是自动下载保存到本地, 为了验证这个,我们创建一个简单的dotnet webapi

震惊,白学window.open了

然后再创建一个静态服务器,很简单,只需要在Program.cs中加入app.UseStaticFiles()

震惊,白学window.open了

之后在根文件放入wwwroot文件夹就可以了,然后我们同时放入一张图片

震惊,白学window.open了

运行dotnet run,并在随意网页控制台输window.open('http://localhost:5058/images/nature-images.jpg')运行,会发现默认是打开图片

震惊,白学window.open了

此时我们为服务加入Content-Disposition配置,并重新运行,

震惊,白学window.open了

然后我们随便在其它网页的控制台输入window.open('http://localhost:5058/images/nature-images.jpg'),会发现,window.open的行为变成了下载:

震惊,白学window.open了

总结

Content-Disposition可以控制网页打开文件的行为,当然,你也可以为它指定下载名称

震惊,白学window.open了

本文章代码地址:Content-Disposition示例