This is a migrated thread and some comments may be shown as answers.

Case Sensitivity in Path for StyleSheetManager

4 Answers 167 Views

ScriptManager and StyleSheetManager

This is a migrated thread and some comments may be shown as answers.

Dave asked on 04 Oct 2020, 11:25 AM

Hello,

It appears that setting a Path for StyleSheetReference is case sensitive. The below page was served up from a local IIS and the style sheet is "Package.css." I had inadvertently typed "package.css" and the lower case failed. Chrome indicated a 200 result code, but the body of the request showed: /* START */ /* Skipped loading 1 invalid resource. */ /* END */ . IE 11 also indicated a 200 result code, but gave this error: SEC7113: CSS was ignored due to mime type mismatch.

Is this an issue with IIS or the RadStyleSheetManager? Been a while since I had a single typo cause this much grief. :)

Thanks!

Dave

<%@ Page Language="C#" AutoEventWireup="true" CodeBehind="Default.aspx.cs" Inherits="Default" %>

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">

<html xmlns="http://www.w3.org/1999/xhtml">

<head runat="server">

<title></title>

<telerik:RadStyleSheetManager id="RadStyleSheetManager1" runat="server">

<StyleSheets>

<telerik:StyleSheetReference Path="package.css" />

</StyleSheets>

</telerik:RadStyleSheetManager>

</head>

<body>

<form id="form1" runat="server">

<telerik:RadScriptManager ID="RadScriptManager1" runat="server">

<Scripts>

<asp:ScriptReference Assembly="Telerik.Web.UI" Name="Telerik.Web.UI.Common.Core.js" />

<asp:ScriptReference Assembly="Telerik.Web.UI" Name="Telerik.Web.UI.Common.jQuery.js" />

<asp:ScriptReference Assembly="Telerik.Web.UI" Name="Telerik.Web.UI.Common.jQueryInclude.js" />

</Scripts>

</telerik:RadScriptManager>

<script type="text/javascript">

//Put your JavaScript code here.

</script>

<telerik:RadAjaxManager ID="RadAjaxManager1" runat="server">

</telerik:RadAjaxManager>

<div>

</div>

</form>

</body>

</html>

4 Answers, 1 is accepted

answered on 07 Oct 2020, 02:15 PM

Hi Dave,

I am not sure if this is related to the case sensitivity or the web application configuration. It may likely be both. Let me explain more below.

As noted in the Serving External Style Sheets documentation, a safe folder or folders must be specified in the web.config or an exception will be thrown.

To troubleshoot this, I recommend placing the Package.css file into a safe folder and then adding the following to the web.config app settings.

<appsettings>   
    <add key="Telerik.Web.UI.StyleSheetFolders" value="~/[SAFE_FOLDER_NAME]" />
</appsettings>

Please give this a try and let me know if you experience any additional issues. Thank you for using the UI for ASP.NET AJAX forums.

Regards,

Eric R | Senior Technical Support Engineer
Progress Telerik

Virtual Classroom, the free self-paced technical training that gets you up to speed with Telerik and Kendo UI products quickly just got a fresh new look + new and improved content including a brand new Blazor course! Check it out at https://learn.telerik.com/.

answered on 07 Oct 2020, 03:27 PM

lowercase.png

uppercase.png

Hi Eric,
My web.config did have the appsetting specifying the folder, which was "~/". I changed this to "~/css" and put Package.css into this folder. The result was the same. If in the aspx, I use "package.css", it doesn't work. If I use "Package.css", then it does. I've attached screenshots showing the two different outcomes.

Below are the source files involved.

aspx:

<%@ Page Language="C#" AutoEventWireup="true" CodeBehind="Default.aspx.cs" Inherits="Default" %>

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">

<html xmlns="http://www.w3.org/1999/xhtml">

<head runat="server">

<title></title>

<telerik:RadStyleSheetManager id="RadStyleSheetManager1" runat="server">

<StyleSheets>

<telerik:StyleSheetReference Path="~/css/Package.css" />

</StyleSheets>

</telerik:RadStyleSheetManager>

</head>

<body>

<form id="form1" runat="server">

<telerik:RadScriptManager ID="RadScriptManager1" runat="server">

<Scripts>

<asp:ScriptReference Assembly="Telerik.Web.UI" Name="Telerik.Web.UI.Common.Core.js" />

<asp:ScriptReference Assembly="Telerik.Web.UI" Name="Telerik.Web.UI.Common.jQuery.js" />

<asp:ScriptReference Assembly="Telerik.Web.UI" Name="Telerik.Web.UI.Common.jQueryInclude.js" />

</Scripts>

</telerik:RadScriptManager>

<script type="text/javascript">

//Put your JavaScript code here.

</script>

<telerik:RadAjaxManager ID="RadAjaxManager1" runat="server">

</telerik:RadAjaxManager>

<div>

</div>

</form>

</body>

</html>

web.confg:

<?xml version="1.0"?>

<configuration>

<appSettings>

<add key="Telerik.Skin" value="Bootstrap"/>

<add key="Telerik.ScriptManager.TelerikCdn" value="Disabled"/>

<add key="Telerik.StyleSheetManager.TelerikCdn" value="Disabled"/>

<add key="Telerik.Web.UI.RenderMode" value="lightweight"/>

<add key="Telerik.Web.UI.StyleSheetFolders" value="~/css" />

</appSettings>

<system.web>

<compilation debug="true" targetFramework="4.7.2"/>

<httpRuntime targetFramework="4.7.2"/>

<pages>

<controls>

<add tagPrefix="telerik" namespace="Telerik.Web.UI" assembly="Telerik.Web.UI"/>

</controls>

</pages>

<httpHandlers>

<add path="ChartImage.axd" type="Telerik.Web.UI.ChartHttpHandler" verb="*" validate="false"/>

<add path="Telerik.Web.UI.SpellCheckHandler.axd" type="Telerik.Web.UI.SpellCheckHandler" verb="*" validate="false"/>

<add path="Telerik.Web.UI.DialogHandler.aspx" type="Telerik.Web.UI.DialogHandler" verb="*" validate="false"/>

<add path="Telerik.RadUploadProgressHandler.ashx" type="Telerik.Web.UI.RadUploadProgressHandler" verb="*" validate="false"/>

<add path="Telerik.Web.UI.WebResource.axd" type="Telerik.Web.UI.WebResource" verb="*" validate="false"/>

</httpHandlers>

</system.web>

<system.webServer>

<validation validateIntegratedModeConfiguration="false"/>

<handlers>

<remove name="ChartImage_axd"/>

<add name="ChartImage_axd" path="ChartImage.axd" type="Telerik.Web.UI.ChartHttpHandler" verb="*" preCondition="integratedMode"/>

<remove name="Telerik_Web_UI_SpellCheckHandler_axd"/>

<add name="Telerik_Web_UI_SpellCheckHandler_axd" path="Telerik.Web.UI.SpellCheckHandler.axd" type="Telerik.Web.UI.SpellCheckHandler" verb="*" preCondition="integratedMode"/>

<remove name="Telerik_Web_UI_DialogHandler_aspx"/>

<add name="Telerik_Web_UI_DialogHandler_aspx" path="Telerik.Web.UI.DialogHandler.aspx" type="Telerik.Web.UI.DialogHandler" verb="*" preCondition="integratedMode"/>

<remove name="Telerik_RadUploadProgressHandler_ashx"/>

<add name="Telerik_RadUploadProgressHandler_ashx" path="Telerik.RadUploadProgressHandler.ashx" type="Telerik.Web.UI.RadUploadProgressHandler" verb="*" preCondition="integratedMode"/>

<remove name="Telerik_Web_UI_WebResource_axd"/>

<add name="Telerik_Web_UI_WebResource_axd" path="Telerik.Web.UI.WebResource.axd" type="Telerik.Web.UI.WebResource" verb="*" preCondition="integratedMode"/>

</handlers>

</system.webServer>

</configuration>

Package.css: (note uppercase)

.SomeClass {

background-color: blue;

}

Thanks,

Dave

Accepted

answered on 08 Oct 2020, 01:21 PM

Hi Dave,

Thank you for the additional information. However, I have confirmed with the development team that this is expected behavior. Let me explain more below.

The reason why is because case sensitivity is better for security. To elaborate, the files are aggregated from the configuration settings and then validated in the resource Handler.

It is after they are passed to the handler that validation is important which as a result makes case-sensitivity equally important.

Please let me know if you need any additional information. Thank you.

Regards,

Eric R | Senior Technical Support Engineer
Progress Telerik