【问题标题】:Default filename of image dragged from the browser window从浏览器窗口拖动的图像的默认文件名
【发布时间】:2014-01-19 17:53:02
【问题描述】:
在 Safari 中,当我将图像从浏览器窗口拖到桌面时,图像的文件名来自 URL 的最后一部分。例如:
http://www.mysite.com/images/05
图片名称是
05.jpeg
这是所有(最近的 IE8+)浏览器的一致行为吗?
我可以决定将图像拖出浏览器时的任意文件名吗?
我尝试(在 Safari 中)设置图像的 name 和 alt 标记,但这没有任何效果。
也许我可以决定在提供图像时在服务器响应的标头中设置的文件名吗?
【问题讨论】:
标签:
html
image
cross-browser
drag-and-drop
【解决方案1】:
一种方法是在提供文件时在响应的标头中指定所需的文件名。
我在使用 php 所以...
header('Content-disposition: inline; filename=the-image.jpg');
当图像从浏览器窗口拖到桌面时,文件名为the-image.jpg
很遗憾,这在所有浏览器中并不一致,特别是 Firefox 不遵守规则,而是坚持使用 URL 的最后部分来提供名称。
适用于所有浏览器的解决方案是避免在响应的标头中指定名称,并将名称设置为 URL 的最后一部分。
因为我可以管理我的网站的路由,所以我采用的解决方案是让到图像的路由以服务器忽略的字符串结尾,其唯一目的是为图像定义文件名,以防图像被拖出浏览器。
例如:
http://www.my-site.com/images/05/my%20custom%20filename.jpg
告诉服务器客户端想要什么图片的是images后面的参数,例子中是05。
请务必注意,文件名必须是 URI 组件编码、转义空格、斜杠、百分比等...
为了便于操作系统,文件名应从斜杠、反斜杠和其他可能最终造成混乱的字符中删除。