在HTML中显示没有扩展名的svg图像

时间:2017-10-19 11:25:13

标签: html image apache svg

所以我一直在搜索是否可以保存并显示没有扩展名的图片。从我发现的浏览器是智能的,这样做应该没有问题。但是,在尝试使用img标记显示无扩展名的时,我遇到了问题。

  

TL; DR;

     

需要使用此语法<img src="images/image" alt="Avatar" />显示无扩展名的PNG / JPG /.../ SVG图像而对于 SVG图像,这是不工作。我有两台服务器,其中一台使用 Apache 2.4 ,另一台使用 nginx 。我在Windows 10上使用最新版本的Chrome。

我尝试过哪些内容:

如果图片 PNG / JPG /...没有扩展程序,可以正常工作,就像扩展程序一样,扩展程序甚至不需要匹配实际类型。

显示没有扩展名的PNG图像 <img src="images/image" alt="Avatar" />。 显示具有PNG扩展名的PNG图像 <img src="images/image.png" alt="Avatar" />。 显示具有JPG扩展名的PNG图像 <img src="images/image.jpg" alt="Avatar" />

然而,尝试使用 SVG 执行相同操作时。上述作品均无。 唯一方式使用 SVG扩展程序

<img src="images/image.svg" alt="Avatar" />

我发现问题是来自Apache服务器的响应不包含&#34; Content-Type&#34;标题,以防没有扩展名。我发现 Content-Type由mod_mime 提供,它使用扩展程序。并且通过读取文件的前几个字节,似乎没有办法通过实际MIME来实现。

如果没有Content-Type浏览器,似乎可能会因为img标记而自动设置某些图像类型。但是在svg的情况下,它没有被正确解码,也没有显示任何内容。

有趣的是,如果我在浏览器标签中打开文件,即使没有扩展程序, svg图像也会正确显示。所以我认为只有当文件单独打开时,浏览器才会读取MIME信息,如果它通过img标签链接,则存在一些惰性差异。

我还尝试使用.htaccess设置其他默认内容类型,因为sbd建议尝试:

<FilesMatch "^[^\.]+$">
    ForceType image/svg+xml
</FilesMatch>

这个svg没有显示扩展名,但普通图像没有显示。

<FilesMatch "^[^\.]+$">
    ForceType application/unknown
</FilesMatch>

图片有效,但svg没有。

为什么我需要这样:

我正在运行 PHP / MySQL ,我保存了多个图像,例如用户头像,论坛图片等。我将它们保存为唯一编号< / strong>(用户ID,帖子ID)没有扩展程序。所以我很容易找到它们。

实际问题:

有可能以某种方式这样做吗?如果不是处理SVG兼容性的正确方法是什么?我应该使用扩展名保存图像并将扩展名信息存储到数据库中吗?或者还有其他方式吗?

0 个答案:

没有答案