ASPX + градиент SVG не работает в Visual Studio 2010 - PullRequest
0 голосов
/ 30 августа 2011

Недавно я столкнулся с проблемой проектирования веб-страницы. Мне нужно было иметь закругленные углы и градиентный фон. Для IE6-8, Firefox и Chrome я решил это, используя CSS3Pie . Поскольку Pie не работает в IE 9, я создал SVG-градиенты . Поскольку я проверил на моей локальной машине, не было никаких проблем. Все нормально. Но когда я вставил на свой проект VS2010 ничего не произошло, так как .svg не был найден. Никогда не достиг? или VS2010 проблема ?. Вот мой код:

default.aspx

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
    <meta http-equiv="content-type" content="text/html;charset=utf-8" />
    <title>Sample</title>
    <style type="text/css" media="screen">
    .svgWorkPlease
    {
        border-radius: 100px;
        box-shadow: 0px 2px 4px #999;
        margin:20px;
        height:500px;
        width:500px;
        background-repeat: repeat-x;
        background-position-x: 0px;
        background-position-y: 100%;
        filter:none;
        background-image: url(gradients.svg);
        background-size: 100% 200%;
    }
    </style>
</head>
<body>
    <div class="svgWorkPlease">Hmmmmm....</div>
</body>
</html>

gradients.svg

<?xml version="1.0" standalone="no"?>
<!DOCTYPE svg PUBLIC "-//W3C//DTD SVG 1.1//EN" "http://www.w3.org/Graphics/SVG/1.1/DTD/svg11.dtd">
<svg width="100" height="200" version="1.1" xmlns="http://www.w3.org/2000/svg">
  <defs>
    <linearGradient id="grad1" x1="0%" y1="0%" x2="0%" y2="100%">
      <stop offset="0%" style="stop-color:rgb(255,255,0);stop-opacity:1" />
      <stop offset="100%" style="stop-color:rgb(255,0,0);stop-opacity:1" />
    </linearGradient>
    <linearGradient id="grad2" x1="0%" y1="0%" x2="0%" y2="100%">
      <stop offset="0%" style="stop-color:rgb(0,255,255);stop-opacity:1" />
      <stop offset="100%" style="stop-color:rgb(0,0,255);stop-opacity:1" />
    </linearGradient>
  </defs>
  <rect x="0" y="0" width="100" height="100" style="fill:url(#grad1)" />
  <rect x="0" y="100" width="100" height="100" style="fill:url(#grad2)" />
</svg>

Заранее спасибо!

1 Ответ

0 голосов
/ 13 июня 2012

Думаю, я немного опоздаю с этой игрой, но если у вас все еще есть эта проблема, тогда у меня может быть решение для вас:

Кассини (сервер разработки ASP.Net) не может обслуживать SVG. Решение, которое работало для меня (и, следовательно, для всей моей команды разработчиков), состояло в том, чтобы запустить IIS и настроить проект для запуска с использованием IIS в качестве серверной среды. (Другое решение заключается в том, чтобы просто использовать встроенные данные SVG в содержимом страницы, но я не рекомендую этого; я нахожу это грязным.)

Это было решение, которое мне представляли различные темы здесь на SO и одна или две веб-страницы здесь и там, ссылки на которые я забыл заархивировать. К сожалению, я также столкнулся с проблемами аутентификации, и мне пришлось искать отдельное решение для этого. Вот мой скомпилированный список инструкций, которые я разослал своей команде разработчиков (немного сжатый, с меньшим количеством деталей, чтобы не стать книгой):

Примечание: для большинства следующих шагов требуется либо административная учетная запись на локальном компьютере, либо учетная запись администратора Active Directory, если вы находитесь в домене AD (или попросите администратора домена предоставить вам локальный права администратора - это то, что я сделал).

Включить проверку подлинности IIS и Windows

Примечание: если это не работает для вас, возможно, вам придется установить IIS с нуля.

  1. Перейдите в Пуск> Панель управления> Программы и компоненты> Включение и выключение функций Windows
  2. В списке функций установите флажок рядом с Internet Information Services, затем разверните дерево и перейдите к Internet Information Services> World Wide Web Services> Security и установите флажок рядом с Windows Authentication. Нажмите ОК.

Настройка IIS

  1. Откройте меню «Пуск» и введите «IIS» в поле поиска. Нажмите Enter / Return, чтобы открыть его.
  2. Добавьте новый сайт, убедившись, что используете правильный пул приложений (моим приложением был MVC, опираясь на .NET 4.0) и укажите каталог на локальный каталог, где вы храните свою копию проекта (я храню свою в C : \ Projects \). Убедитесь, что вы указываете на корневую папку веб-приложения, а не на корневую папку проекта (правильная папка будет напрямую содержать ваши папки Models / Views / Controllers, если вы используете MVC). Дайте сайту номер порта (просто придумайте что-нибудь запоминающееся, но не используйте «80», если вы планируете тестировать несколько проектов на этом компьютере одновременно). Нажмите ОК.
  3. В панели конфигурации для основного сервера в верхней части дерева выберите MIME-типы и убедитесь, что в списке есть запись, которая выглядит как ".svg" | "image / svg + xml" & mdash; добавь его сам, если его там нет.
  4. В панели конфигурации вашего нового веб-сайта выберите Аутентификация. Отключить все формы аутентификации, кроме «Аутентификация Windows» & mdash; включить этот.

Примечание: , если пул приложений ASP.NET v4.0 отсутствует в списке на шаге 2, выполните следующие действия на случай непредвиденных обстоятельств:

Резервный пул приложений

Примечание: эти шаги предназначены только для использования в случае, если ASP.NET v4.0 не является опцией при выборе пула приложений в IIS Manager.

  1. Открыть командный терминал.
  2. Введите cd C:\Windows\Microsoft.NET\Framework64 (имя папки Framework64 может отличаться, поэтому вам может понадобиться просто просмотреть каталог C:\Windows\Microsoft.NET, чтобы найти его). Нажмите Enter / Return.
  3. Введите dir, чтобы просмотреть содержимое этой папки. Найдите в ней имя папки, например v4.0.30319 и cd.
  4. Тип aspnet_regiis -ir. Нажмите Enter / Return.
  5. Как только это произойдет, закройте окно терминала и закройте / снова откройте IIS Manager, затем снова включите «Аутентификацию Windows».

Теперь для предварительного просмотра вашего веб-сайта настройте проект VS2010 так, чтобы он указывал на http://localhost:<port>, где <port> - это номер порта, который вы ввели на шаге 2 Настройка IIS . Вам также необходимо настроить проект для аутентификации Windows.


Обратите внимание, что эти инструкции были лично проверены только в Windows 7 Enterprise edition с IIS 7.5. Даже если ваша среда идентична моей, ваше приложение может не совпадать, и поэтому вам, вероятно, придется изменить несколько моих шагов.

Я надеюсь, что я был полезным и не излишним здесь. Я подумал, что мог бы просто скомпилировать все шаги вместе в одном месте, а не просто передать вам кучу ссылок и сказать «удачи». Если вы (или кто-либо другой) предпочли бы более подробную информацию о шагах выше, я могу быть более точным; Я просто предполагаю определенный уровень знакомства с Windows, IIS и Visual Studio.

Если я найду упомянутые выше ссылки, я отредактирую этот пост и включу их.

Добро пожаловать на сайт PullRequest, где вы можете задавать вопросы и получать ответы от других членов сообщества.
...