Потенциально опасное значение Request.Form из IE8

Question

У меня есть Facebook-стиль современного кнопки управления которой на стороне клиента разметки выглядит следующим образом:

<button id="ctl00_uxBtn" value="ctl00$uxBtn" name="ctl00$uxBtn type="submit"> 
    <div style="background-image: url("Icons/page_edit.png"); background-position: left center; background-repeat: no-repeat; line-height: 16px; padding: 3px 0pt 3px 22px;">Save Draft</div> 
</button> 

Эта кнопка отлично работает и с IE и FF с использованием Visual Studio 2010 Интернет сервер, но когда я развертываю приложение на сервере (Windows Server 2008/IIS 7.0), я получаю сообщение «Обнаружено потенциально опасное значение Request.Form», но только с IE. Похоже, что IE передает ctl00_uxBtn = "< div style =" background-image: ... "разметку в коллекции Request.Form, которую IIS правильно интерпретирует как потенциальную уязвимость для инъекций скрипта. Насколько я могу судить, FF проходит .?. ctl00_uxBtn = «ctl00 $ uxBtn», который вполне приемлемо ли способ заставить IE в более FF типа поведения я не хочу, чтобы отключить проверку запроса

Answer 1

IE настаивает на отправку содержимого между < кнопкой > и </кнопкой > как значение кнопки, и не кажется, способом предотвратить это. Таким образом, мы перехватывать запрос на стороне клиента, используя onsubmit обработчик события, как, например:

<form id="form1" runat="server" onsubmit="fixModernButton()"> 

Наша яваскрипта функция затем проверяет, является ли браузер IE и если баттона innerHTML свойство начинается с «<». Если это так, это разметка и приведет к тому, что ASP.Net вызовет ошибку «Потенциально опасное значение Request.Form», поэтому мы установим значение свойства innerHTML на значение свойства innerText, а затем отправьте форму. Источник для яваскрипта функции:

function fixModernButton() { 
    if (navigator.appName === 'Microsoft Internet Explorer') { 
     if (document.activeElement.innerHTML && document.activeElement.innerHTML.charAt(0) === '<') { 
      document.activeElement.innerHTML = document.activeElement.innerText; 
     } 
    } 
    document.forms['form1'].submit(); 
} 

Answer 2

Вы должны использовать правильные цитаты:

<button id="ctl00_uxBtn" value="ctl00$uxBtn" name="ctl00$uxBtn" type="submit"> 
    <div style="background-image: url('Icons/page_edit.png'); background-position: left center; background-repeat: no-repeat; line-height: 16px; padding: 3px 0pt 3px 22px;">Save Draft</div> 
</button> 

Я бы порекомендовал вам не следует смешивать CSS и разметки и экстернализация этого правила в отдельный CSS:

.edit { 
    background-image: url('Icons/page_edit.png'); 
    background-position: left center; 
    background-repeat: no-repeat; 
    line-height: 16px; 
    padding: 3px 0pt 3px 22px; 
} 

, а затем применить его к DIV:

<button id="ctl00_uxBtn" value="ctl00$uxBtn" name="ctl00$uxBtn" type="submit"> 
    <div class="edit">Save Draft</div> 
</button> 

Это сделает разметку намного чище, сохранить пропускную способность и избежать ошибок вам, как тот, который вы сделали об использовании правильных цитат.