如何使用 Visual Studio 配置 IIS 以进行 SVG 和 Web 测试?

如何使用 Visual Studio 配置 IIS 以进行 SVG 和 Web 测试?

假设我有一个简单的网页,其中包含 svg 图像:

<img src="foobar.svg" alt="not working" />

如果我将此页面设为静态 html 页面并直接查看,则会显示 svg。如果我输入此 svg 的地址 -- 它会显示出来。

但是当我将其制作成 .aspx 页面并从 Visual Studio 动态启动它时,我得到的是alt文本。如果我输入此 svg 的地址(来自本地主机,而不是本地文件)——浏览器会尝试下载它而不是显示它。

我已经在 IIS 中定义了 mime 类型(针对整个服务器 - “image/svg+xml”)并重新启动了 IIS。效果与之前相同。

问题:我还应该做些什么?

更新

WireShark 无法工作(它在文档中),我也尝试了 RawCap,但它无法追踪我的连接(奇怪),幸运的是 Fiddler 可以工作:

来自客户:

GET http://127.0.0.1:1731/svg/document_edit.svg HTTP/1.1
Host: 127.0.0.1:1731
User-Agent: Mozilla/5.0 (Windows NT 6.1; rv:10.0.1) Gecko/20100101 Firefox/10.0.1
Accept: text/html,application/xhtml+xml,application/xml;q=0.9,*/*;q=0.8
Accept-Language: en-us,en;q=0.5
Accept-Encoding: gzip, deflate
Connection: keep-alive

服务器答复:

HTTP/1.1 200 OK
Server: ASP.NET Development Server/10.0.0.0
Date: Thu, 16 Feb 2012 11:14:38 GMT
X-AspNet-Version: 4.0.30319
Cache-Control: private
Content-Type: application/octet-stream
Content-Length: 87924
Connection: Close

<?xml version="1.0" encoding="UTF-8" standalone="no"?>
<!-- Created with Inkscape (http://www.inkscape.org/) -->

<svg
   xmlns:

*** FIDDLER: RawDisplay truncated at 128 characters. Right-click to disable truncation. ***

作为记录,以下是 Fiddler 的有用问答: https://stackoverflow.com/questions/826134/how-to-display-localhost-traffic-in-fiddler-while-debugging-an-asp-net-applicati

答案1

从您的 Fiddler 跟踪来看,您正在使用内置的 Visual Studio Web 服务器为您的页面提供服务:

Server: ASP.NET Development Server/10.0.0.0

如果这是由 IIS7 提供的,那么我们会看到:

Server: Microsoft-IIS/7.5

内置的 Visual Studio Web 服务器只能提供有限的 MIME 类型,并且无法识别您为 IIS7 设置的 MIME 类型。不久前,我在 Stack Overflow 上写了一个类似问题的答案:

使用 ASP.NET 开发服务器设置 MIME 类型

内置服务器正在.svg以以下方式提供您的文件:

Content-Type: application/octet-stream

这可能是导致浏览器提示下载的原因。

在 Visual Studio 中,通过打开站点的项目属性并从垂直选项卡列表中选择“Web”选项卡来检查您是否正在使用 IIS Express:

在此处输入图片描述

如果您尚未安装 IIS 7.5 Express,您可以从这里获取它:

http://www.microsoft.com/download/en/details.aspx?id=1038

您将需要 Visual Studio 2010 Service Pack 1 才能充分利用:

http://support.microsoft.com/kb/983509

IIS Express 支持

Visual Studio 2010 SP1 使您能够使用 Internet 信息服务 (IIS) 7.5 Express 作为网站和 Web 应用程序项目的本地托管服务器。

笔记IIS 7.5 Express 不包含在 SP1 中,您必须单独下载。有关详细信息,请访问以下博客: http://weblogs.asp.net/scottgu/archive/2011/01/03/vs-2010-sp1-beta-and-iis-developer-express.aspx

完成后,您可以将.svgMIME 类型添加到应用程序的web.config文件中:

<configuration>
   <system.webServer>
      <staticContent>
         <mimeMap fileExtension=".svg" mimeType="image/svg+xml" />
      </staticContent>
   </system.webServer>
</configuration>

答案2

如上所述,Cassini 忽略了 web.config 中的这些设置,因此必须使用 IIS Express(在 VS 项目设置中) https://stackoverflow.com/questions/5924647/setting-mime-types-using-the-asp-net-development-server

要获取有关如何使用管理 UI 或使用 IIS 或 IIS Express 的 web.config 配置 MIME 类型的更多信息,请参阅: http://4rapiddev.com/tips-and-tricks/add-mime-type-flv-mp4-in-iis-for-a-website-or-global/http://4rapiddev.com/tips-and-tricks/add-mime-type-flv-mp4-to-web-config-in-iis-7/

答案3

我使用了 Kev 的答案,方法是:

  1. 从安装 IIS 8.0 ExpressWeb 平台安装程序
  2. 更改项目的属性以使用 IIS Express 并为其创建虚拟目录
  3. 在 web.config 中添加配置 → system.webServer
<staticContent>
    <remove fileExtension=".svg" />
    <mimeMap fileExtension=".svg" mimeType="image/svg+xml" />
</staticContent>

答案4

我正在运行 IIS7,可以通过右键单击 IIS 中的服务器并选择属性来修复此问题。然后我单击了 MIME 类型... 按钮。然后单击新建。对于扩展名,我输入了 .svg。对于 MIME 类型,我输入了 image/svg+xml。然后我保存了所有内容并从命令提示符中执行了 iisreset。效果很好。

相关内容