使用 Safari 显示 SVG 的 Doctype 问题答案

【问题标题】：Doctype problem displaying SVG with Safari使用 Safari 显示 SVG 的 Doctype 问题
【发布时间】：2011-05-24 21:52:17
【问题描述】：

我有几张 SVG 图像要在页面上布局。 Firefox 和 Chrome 没有给我任何问题，但 Safari 似乎仅当且仅当文档具有“.xhtml”扩展名时才显示 SVG 图像。如果我尝试使用 PHP 代码（因此使用“.php”扩展名），我在“.xhtml”文档中使用的完全相同的标记将不再显示 SVG 图像。问题当然是，我手头的项目必须使用 PHP。有什么建议么？这是源代码：

<?xml version="1.0" encoding="utf-8"?>
<!DOCTYPE svg PUBLIC "-//W3C//DTD SVG 1.1//EN" "http://www.w3.org/Graphics/SVG/1.1/DTD/svg11.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" xmlns:svg="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" xml:lang="de" xmlns:xml="http://www.w3.org/XML/1998/namespace">
<head>
<title>SVG Safari Test</title>
</head>
<body>
<!-- Generator: Adobe Illustrator 15.0.2, SVG Export Plug-In . SVG Version: 6.00 Build 0)  -->
<svg version="1.1" id="Layer_1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" x="0px" y="0px" width="500px" height="500px" viewBox="0 0 500 500" enable-background="new 0 0 500 500" xml:space="preserve"><circle cx="250" cy="250" r="238.048"/></svg>
</body>
</html>

【问题讨论】：

标签： php xhtml safari svg

【解决方案1】：

.xhtml 在 Safari 中有效而 .html 无效的原因是 Safari 需要将文档视为 XML 以允许嵌入 SVG。最新版本的 Firefox 和 Chrome 使用HTML5 parser，它允许将 SVG 嵌入到纯 HTML 文档中，因此它们应该可以同时使用。

要让它在 Safari 中正确呈现，您需要将内容类型设置为 application/xhtml+xml。在输出任何内容之前在 PHP 文件中使用它：

<?php
header('Content-type: application/xhtml+xml');
?>

【讨论】：

非常感谢！那工作得很好。并感谢您解释其背后的理由。作为一个新手，我很感激。

【解决方案2】：

你可以设置你的 php 配置来处理 xhtml 文件。

在这个例子中，我假设你在 debian/ubuntu 上使用 apache

您可以查看文件 /etc/apache2/mods-enabled/php5.conf

<IfModule mod_php5.c>

<FilesMatch "\.xhtml$">
SetHandler application/x-httpd-php
</FilesMatch>

</IfModule>

如果您使用不同的网络服务器或发行版或操作系统，您可能在其他文件中包含此 SetHandler 指令...

假设您使用的是 unix 机器，只需 grep /etc/apache 或 /etc/httpd 目录

grep -Ri sethandler /etc/apache

【讨论】：