Como configurar o IIS para SVG e teste da Web com o Visual Studio?

14

Digamos que eu tenha uma página da web simples com uma imagem svg:

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

Se eu criar essa página como página estática em html e visualizá-la diretamente, svg será exibido. Se eu digitar o endereço deste svg - ele será exibido.

Mas quando eu faço isso como uma página .aspx e a inicio dinamicamente do Visual Studio, recebo alttexto. Se eu digitar o endereço deste svg (do localhost, não como um arquivo local) - o navegador tentará fazer o download em vez de exibir.

Eu já defini o tipo mime no IIS (para todo o servidor - "image / svg + xml") e reiniciei o IIS. O mesmo efeito de antes.

Pergunta: o que devo fazer mais?

Atualizar

O WireShark não funcionará (está na documentação), tentei também o RawCap, mas ele não pode rastrear minha conexão (ímpar), felizmente, o Fiddler trabalhou:

Do cliente:

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

Resposta do servidor:

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

Para o registro, aqui estão as perguntas e respostas úteis para o Fiddler: /programming/826134/how-to-display-localhost-traffic-in-fiddler- while-debugging-an-asp-net- applicati

greenoldman
fonte
Pense que você pode obter melhores respostas para isso no SO. Em suma, supondo que o ASPX já esteja funcionando, você precisará emitir SVG como o tipo MIME da página ASPX para que o navegador acredite que é um arquivo SVG. Você está, presumivelmente, tentando emitir SVG dinamicamente da página? Nesse caso, o AFAIK, se funcionar como uma única página, funcionará em uma entrada IMG.
TristanK 14/02/12
@TristanK, o aspx não está emitindo "SVG como o tipo MIME", ele simplesmente contém <img src...como mostrado acima, o aspx é "traduzido" para a página html completa, mas o envio de todo o conteúdo (html e svg) é feito pelo IIS.
13135 greenoldman
Ainda não entendo o que você está descrevendo, mas acho que essa é uma questão de desenvolvimento; portanto, seria melhor perguntar no StackOverflow.
21812 TristanK
2
Pegue uma cópia do Fiddler e rastreie os dois pedidos diferentes. Isso pode lhe dar algumas dicas de por que uma solicitação direta para a imagem está se comportando de maneira diferente em cada um desses casos. As pistas provavelmente estarão nos cabeçalhos retornados. Sem esses dados, tudo o que podemos fazer é adivinhar quais respostas o servidor está retornando.
Kev
@macias Como Kev disse, você precisará rastrear o tráfego. O violinista ou o velho Wireshark simples deve poder pegá-lo.
Chris S

Respostas:

14

No rastreamento do Fiddler, parece que você está veiculando suas páginas usando o servidor Web Visual Studio interno:

Server: ASP.NET Development Server/10.0.0.0

Se isso estivesse sendo veiculado pelo IIS7, veríamos:

Server: Microsoft-IIS/7.5

O servidor da Web interno do Visual Studio possui apenas um conjunto limitado de tipos MIME que ele pode servir e não tem conhecimento dos tipos MIME definidos para o IIS7. Eu escrevi uma resposta para um problema semelhante no Stack Overflow há um tempo:

Definindo tipos MIME usando o ASP.NET Development Server

O servidor interno está servindo seu .svgarquivo como:

Content-Type: application/octet-stream

Provavelmente, isso está causando o download do navegador.

No Visual Studio, verifique se você está usando o IIS Express, abrindo as propriedades do projeto do site e selecionando a guia "Web" na lista de guias verticais:

insira a descrição da imagem aqui

Se você não possui o IIS 7.5 Express instalado, pode obtê-lo aqui:

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

Você precisará do Visual Studio 2010 Service Pack 1 para aproveitar ao máximo:

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

Suporte do IIS Express

O Visual Studio 2010 SP1 permite que você use os Serviços de Informações da Internet (IIS) 7.5 Express como servidor de hospedagem local para o site e os Projetos de aplicativos da Web.

Nota O IIS 7.5 Express não está incluído no SP1 e você deve baixá-lo separadamente. Para obter mais informações, visite o seguinte blog: http://weblogs.asp.net/scottgu/archive/2011/01/03/vs-2010-sp1-beta-and-iis-developer-express.aspx

Quando você fizer isso, poderá adicionar o .svgtipo MIME ao web.configarquivo do seu aplicativo :

<configuration>
   <system.webServer>
      <staticContent>
         <mimeMap fileExtension=".svg" mimeType="image/svg+xml" />
      </staticContent>
   </system.webServer>
</configuration>
Kev
fonte
Muito Obrigado. No meu caso, foi um pouco diferente - para mudar para o IIS (tenho ISS, não ISSExpress), tive que executar o VS no modo de administrador, depois disso tudo - não defini svg no web.config porque defini já no IIS.
greenoldman
2

Como mencionado acima, a Cassini ignora essas configurações no web.config, portanto, é necessário usar o IIS Express (nas configurações do projeto do VS) /programming/5924647/setting-mime-types-using-the-asp- servidor de desenvolvimento de rede

Para obter mais informações sobre como configurar os tipos MIME usando a UI administrativa ou o web.config para IIS ou IIS Express, consulte: http://4rapiddev.com/tips-and-tricks/add-mime-type-flv-mp4- in-iis-for-a-website-or-global / e http://4rapiddev.com/tips-and-tricks/add-mime-type-flv-mp4-to-web-config-in-iis-7 /

George Birbilis
fonte
Você está fazendo isso como uma nova pergunta ou retoricamente? Se o primeiro, faça uma nova pergunta com todos os detalhes. Neste último caso, isso provavelmente deve ser um comentário - tal como está é uma resposta muito pobres ( ver aqui para isso )
voretaq7
revisado com links melhores
George Birbilis
Muito melhor :-)
voretaq7 /
2

Eu usei a resposta Kev, por:

  1. Instalando o IIS 8.0 Express a partir do Instalador da Plataforma Web
  2. Alterando as propriedades do projeto para usar o IIS Express e criando o Diretório Virtual para ele
  3. Adicionando na configuração do web.config → system.webServer
<staticContent>
    <remove fileExtension=".svg" />
    <mimeMap fileExtension=".svg" mimeType="image/svg+xml" />
</staticContent>
Volodymyr Kotylo
fonte
2

Minha solução para isso foi criar meu próprio manipulador de http localmente, que substituiu o tipo de conteúdo para 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();
    }
}

e no web.config eu adicionei:

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

com esta solução, você não precisa usar o IIS Express, basta usar o servidor de desenvolvimento regular no visual studio 2010

Robin Karlsson
fonte
1
É muito grave que este tipo de coisa tem que acontecer ...
Jarrod Mosen
1

Estou executando o IIS7 e consegui corrigir isso clicando com o botão direito do mouse no servidor no IIS e escolhendo propriedades. Depois, cliquei no botão MIME Types .... Depois, cliquei em Novo. Para a extensão, digitei .svg. Para o tipo MIME, digitei image / svg + xml. Em seguida, salvei tudo e fiz um iisreset no prompt de comando. Trabalhou muito bem.

Troy Tabor
fonte