Bagaimana cara mengkonfigurasi IIS untuk SVG dan pengujian web dengan Visual Studio?

Katakanlah saya memiliki halaman web sederhana dengan gambar svg di dalamnya:

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

Jika saya membuat halaman ini sebagai halaman html statis dan melihatnya langsung svg ditampilkan. Jika saya mengetik alamat svg ini - ini ditampilkan.

Tetapi ketika saya menjadikan ini sebagai halaman .aspx dan meluncurkannya secara dinamis dari Visual Studio, saya mendapatkan altteks. Jika saya mengetik alamat svg ini (dari localhost, bukan sebagai file lokal) - browser mencoba mengunduhnya daripada menampilkan.

Saya sudah mendefinisikan tipe mime di IIS (untuk seluruh server - "image / svg + xml") dan memulai kembali IIS. Efek yang sama seperti sebelumnya.

Pertanyaan: apa yang harus saya lakukan lebih banyak?

Memperbarui

WireShark tidak akan berfungsi (ini dalam dokumentasi), saya juga mencoba RawCap, tetapi tidak dapat melacak koneksi saya (aneh), untungnya Fiddler bekerja:

Dari klien:

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

Jawaban dari server:

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. ***

Sebagai catatan, inilah Q&A yang berguna untuk Fiddler: /programming/826134/how-to-display-localhost-traffic-in-fiddler-while-debugging-an-asp-net-applicati

Dari penelusuran Fiddler Anda, tampaknya Anda menayangkan halaman menggunakan server web Visual Studio bawaan:

Server: ASP.NET Development Server/10.0.0.0

Jika ini dilayani oleh IIS7 maka kita akan melihat:

Server: Microsoft-IIS/7.5

Server web Visual Studio built-in hanya memiliki set terbatas tipe mime yang dapat dilayaninya dan tidak memiliki pengetahuan tentang tipe mime yang Anda setel untuk IIS7. Saya menulis jawaban untuk masalah serupa di Stack Overflow beberapa waktu lalu:

Menyetel tipe MIME menggunakan ASP.NET Development Server

Server bawaan melayani .svgfile Anda sebagai:

Content-Type: application/octet-stream

Ini mungkin yang menyebabkan browser meminta untuk mengunduh.

Di Visual Studio periksa bahwa Anda menggunakan IIS Express dengan membuka properti proyek situs Anda dan memilih tab "Web" dari daftar tab vertikal:

Jika Anda belum menginstal IIS 7.5 Express, Anda bisa mendapatkannya dari sini:

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

Anda akan membutuhkan Visual Studio 2010 Paket Layanan 1 untuk mengambil keuntungan penuh:

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

Dukungan IIS Express

Visual Studio 2010 SP1 memungkinkan Anda untuk menggunakan Internet Information Services (IIS) 7.5 Express sebagai server hosting lokal untuk situs web dan Proyek Aplikasi Web.

Catatan IIS 7.5 Express tidak termasuk dalam SP1, dan Anda harus mengunduhnya secara terpisah. Untuk informasi lebih lanjut, kunjungi blog berikut: http://weblogs.asp.net/scottgu/archive/2011/01/03/vs-2010-sp1-beta-and-iis-developer-express.aspx

Setelah selesai, Anda dapat menambahkan .svgtipe mime ke web.configfile aplikasi Anda :

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

Seperti disebutkan di atas, Cassini mengabaikan pengaturan ini di web.config sehingga kita harus menggunakan IIS Express sebagai gantinya (pada pengaturan proyek VS) /programming/5924647/setting-mime-types-using-the-asp- net-development-server

Untuk mendapatkan info lebih lanjut tentang cara mengkonfigurasi tipe MIME menggunakan UI admin atau menggunakan web.config untuk IIS atau IIS Express, lihat: http://4rapiddev.com/tips-and-tricks/add-mime-type-flv-mp4- in-iis-for-a-website-or-global / dan http://4rapiddev.com/tips-and-tricks/add-mime-type-flv-mp4-to-web-config-in-iis-7 /

Saya telah menggunakan jawaban Kev, dengan:

1. Menginstal IIS 8.0 Express dari Pemasang Platform Web
2. Mengubah properti proyek untuk menggunakan IIS Express dan membuat Direktori Virtual untuknya
3. Menambahkan konfigurasi web.config → system.webServer

<staticContent>
    <remove fileExtension=".svg" />
    <mimeMap fileExtension=".svg" mimeType="image/svg+xml" />
</staticContent>

Solusi saya untuk ini adalah membuat httphandler saya sendiri secara lokal yang menimpa tipe konten untuk svg.

public class SvgHandler : IHttpHandler
{

    public bool IsReusable
    {
        get { return false; }
    }

    public void ProcessRequest(HttpContext context)
    {
        context.Response.ContentType = "image/svg+xml";
        context.Response.BinaryWrite(File.ReadAllBytes(context.Request.PhysicalPath));
        context.Response.End();
    }
}

dan di web.config saya menambahkan:

<httpHandlers>
  <add verb="*" path="*.svg" type="SvgHandler" />
</httpHandlers>

dengan solusi ini Anda tidak harus menggunakan IIS express, Anda bisa menggunakan server pengembangan biasa di visual studio 2010

Saya menjalankan IIS7, dan dapat memperbaikinya dengan mengklik kanan pada server di IIS dan memilih properti. Kemudian saya mengklik tombol MIME Types .... Saya kemudian mengklik Baru. Untuk ekstensi saya mengetikkan .svg. Untuk Tipe MIME saya mengetikkan image / svg + xml. Saya kemudian disimpan adalah semua dan melakukan iisreset dari command prompt. Bekerja dengan baik.

Jika Anda memiliki akses ke IIS maka ini juga memperbaiki masalah: http://httpjunkie.com/2014/884/svg-no-iis/