У меня есть сайт, который до недавнего времени вставлял изображение png через aspx в другой aspx, сгенерированный HTML-код выглядит так:
<div class="widgetcontent" style="padding: 0px; margin: 0px; padding-left: 5px;">
<div id="ctl00_CPHMaster_UPRanges">
<img id="ctl00_CPHMaster_IMRanges" src="range.aspx" style="height:280px;width:460px;border-width:0px;" />
</div>
</div>
range.aspx предоставил только png-изображение, созданное на лету.
Теперь я изменил range.aspx, чтобы он доставлял svg, и изменил страницу встраивания, чтобы полученный HTML-код теперь выглядел следующим образом:
<div class="widgetcontent" style="padding: 0px; margin: 0px; padding-left: 5px;">
<div id="ctl00_CPHMaster_UPRanges">
<img id="ctl00_CPHMaster_IMRanges" type="image/svg+xml" src="range.aspx" style="height:280px;width:460px;border-width:0px;" />
</div>
</div>
Хотя это не работает правильно. Вот факты:
a) Он работает прямо на моей машине разработчиков Windows с сервером разработки ASP.NET, созданным VisualStudio 2012.
b) Он работает на тестовой машине с IIS 8.5.
в) Это не работает на моем производственном компьютере, на котором работает IIS 7.5.
d) «Это не работает» означает: на странице, которая должна показывать встроенный svg, вместо этого просто отображается знак разбитого изображения.
e) Но когда я щелкаю правой кнопкой мыши по значку с разбитым изображением и выбираю «Просмотр изображения», отображается svg!
f) Когда я щелкаю правой кнопкой мыши на единственном svg и выбираю «просмотреть исходный код страницы», он показывает чистый текст svg, без HTML.
g) Некоторые места в сети пишут, что svg должен быть включен в конфигурации IIS 7.5. Я сделал это уже. Это все еще не работает.
h) Это не проблема браузера, я проверял с Chrome, IE, Firefox и другими.
Любая помощь приветствуется.
Обновление 1: Поскольку Брандо Чжан спросил о коде range.aspx, в принципе это выглядит так:
<%@ Import Namespace="WVA.Client.Web" %>
<%@ Page Language="c#" AutoEventWireup="true" Culture="en-Us" UICulture="auto" %>
<%@ Import Namespace="WVA.ServiceAccessLayer.WebService" %>
<%@ Import Namespace="WVA.SharedBusinessLogic" %>
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.0 Strict//EN">
<html>
<head>
<script runat="server" language="C#">
protected void Page_Load(object sender, EventArgs e)
{
Response.Clear();
byte[] imageByteData = funcGetImage(bildformat);
if (format == Format.Svg)
{
Response.ContentType = "image/svg+xml";
Response.Flush();
string imageTextUtf8 = Encoding.UTF8.GetString(imageByteData, 0, imageByteData.Length);
Response.Write(imageTextUtf8);
}
else if (format == Format.Png)
{
Response.ContentType = "image/png";
Response.Flush();
Response.BinaryWrite(imageByteData);
}
Response.End();
}
</script>
</head>
</html>
Обновление 2: Из-за подсказки Хакермана я попытался добавить это в web.config:
<staticContent>
<remove fileExtension=".svg" />
<mimeMap fileExtension=".svg" mimeType="image/svg+xml" />
</staticContent>
Это не улучшило качество встроенного изображения. Но это имело интересный эффект: впоследствии в Chrome и Opera «Просмотр изображения на отдельной вкладке» больше не показывал изображение svg, а текст svg. Firefox все еще показывал изображение.
Обновление 3:
После подсказки Лекса Ли мы проверили инструмент разработчика Chrome. Не удалось найти там никакой ошибки. Но что интересно
Там, где все в порядке, заголовок ответа содержит строку
Тип содержимого: image / svg + xml . В IIS 7.5, где все не так, в заголовке ответа нет Content-Type: .