Dlaczego ta grafika SVG jest wyświetlana jako surowa w przeglądarce, ale nie na stronie internetowej?

This SVG można wyświetlać poprawnie w moim oknie przeglądarki.Dlaczego ta grafika SVG jest wyświetlana jako surowa w przeglądarce, ale nie na stronie internetowej?

Jednak gdy próbuję użyć go jako obraz na stronie internetowej (próbuje to na moim żywo miejscu w JSFiddle), to nie pojawiają się:

<img src="http://54.186.131.77/Style/Resources/SVG/logo.svg"/>

Każdy czas mój serwer twierdzi, że plik został pomyślnie dostarczony, ale nie jest renderowany.

Na czym polega problem?

W przypadku, że mój problem może polegać moje serwujące rodzajów metoda/MIME, I've created a Gist with my Node.js custom server implementation. traktuję .svg jako text/xml według jakiegokolwiek wykresu użyłem przy opracowywaniu tego serwera jakiś czas temu.

Źródło

2015-07-31 Anonymous

Czy próbowałeś już ustawiania typów MIME i tego, co działa po stronie serwera? http://stackoverflow.com/questions/27338648/svg-wont-display Instrukcje Apache - http://planetsvg.com/tools/mime.php#apache – Mousey

@Mousey Pokażę ci, jak mój MIME obsługuje serwer typy. –

@Mousey to zbyt dużo kodu, by zagracić to pytanie, ponieważ nie wiem, która część może być problematyczna, aby "... [snip] ...", więc tutaj jest to w Gist: https: // gist .github.com/anonymous/a39603f3ee74694e8186 –

Nagłówek odpowiedź Content-type kiedy załadować tę SVG z serwera jest aktualnie Content-Type:text/xml, który jest nieprawidłowy typ MIME dla SVG. Spróbuj zmienić swój nagłówek Content-type na image/svg+xml.

Z istoty ty pisał w swoim komentarzu, wygląda na to będzie można to zrobić przez zmianę linii 15 od:

'.svg' : 'text/xml',

'.svg' : 'image/svg+xml',

Polecam przeciwko prostu zmieniając znaczników, ponieważ jest to krótkoterminowa poprawka dla niepoprawnych nagłówków HTTP.

Źródło

2015-07-31 22:26:58

Tak naprawdę zmieniłem typ zawartości, jak powiedziałeś i załadowałem ponownie serwer, załadowałem ponownie stronę z wyłączoną pamięcią podręczną - problem nie został rozwiązany -, ale na pewno, czy możliwe jest sprawdzenie typu zawartości obsługiwanej przez javascript, aby móc się dowiedzieć na pewno typ MIME jest obsługiwany poprawnie? –

@ JonathanTodd Sprawdziłem ponownie i wygląda na to, że Twój typ zawartości to teraz 'text/svg-xml' - nadal niepoprawny. Aby sprawdzić typ zawartości, przejdź do [web-sniffer.net] (http://web-sniffer.net/) i podłącz swój URL SVG, pozostawiając wszystko inne domyślnie. Następnie sprawdź sekcję "Nagłówek HTTP" dla 'Content-Type' z' image/svg + xml'. –

Ahh Rozumiem. Głupi błąd. –

Oto jak to zrobiłem, używając zwykłego starego HTML. Użyłem odpowiedzi pokazanej w linku SO here, aby to zrozumieć.

<!DOCTYPE html> 
<html lang="en" xmlns="http://www.w3.org/1999/xhtml"> 
<head> 
    <meta charset="utf-8" /> 
    <title>Test page</title> 
</head> 
<body> 
    <object data="http://54.186.131.77/Style/Resources/SVG/logo.svg" type="image/svg+xml"> 
     <img src="http://54.186.131.77/Style/Resources/SVG/logo.svg" /> 
    </object> 
</body> 
</html>

Źródło

2015-07-31 22:26:30

Dlaczego ta grafika SVG jest wyświetlana jako surowa w przeglądarce, ale nie na stronie internetowej?

Odpowiedz

Powiązane problemy